/* LEVARA on the capy.life Phangan stylesheets: only what a four-card page needs. */
.activity-grid-four{grid-template-columns:repeat(4,minmax(0,1fr))}
.activity-copy .text-button{margin-top:12px}
.concept-footer [lang=th]{display:block;margin-top:8px;color:var(--muted)}
@media(max-width:1100px){.activity-grid-four{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:580px){.activity-grid-four{grid-template-columns:1fr}}

/* Proposal page: blocks on the same rhythm, colours from the capy.life tokens (day and evening). */
.proposal-block{padding-top:72px;padding-bottom:72px;border-top:1px solid var(--line)}
.proposal-block h2{margin:0 0 40px}
.proposal-pair{display:grid;grid-template-columns:1fr 1fr;gap:64px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.col-head{margin:0 0 12px;font-size:9px;letter-spacing:1.6px;color:var(--olive)}
.checks{margin:0;padding:0;list-style:none}
.checks li{position:relative;padding:12px 0 12px 24px;border-top:1px solid var(--line)}
.checks li::before{content:"";position:absolute;left:4px;top:21px;width:8px;height:8px;border-radius:50%;background:var(--muted)}
.checks.coming li::before{background:var(--terracotta)}
.checks a,.sources a{display:inline-flex;align-items:center;min-height:44px}
.bar{display:flex;margin-top:32px;height:36px;overflow:hidden;font-size:11px;letter-spacing:.5px}
.bar span{display:flex;align-items:center;padding:0 12px;white-space:nowrap;overflow:hidden}
.bar-done{background:var(--ink);color:var(--cream)}.bar-open{background:var(--surface);color:var(--ink)}
.timeline{margin:0;padding:0;list-style:none}
.timeline li{padding:14px 0 14px 20px;border-left:1px solid var(--terracotta)}
.timeline .when{display:block;font-size:9px;letter-spacing:1.6px;text-transform:uppercase;color:var(--olive)}
.story{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0;padding:0;list-style:none}
.story li{display:flex;flex-direction:column;gap:6px;font-size:11px;color:var(--muted)}
.story .card-text{display:flex;align-items:center;justify-content:center;aspect-ratio:9/16;padding:10px;background:var(--surface);color:var(--ink);font:400 17px/1.2 var(--serif);text-align:center}
.story .end .card-text{background:var(--ink);color:var(--cream)}
.table-wrap{overflow-x:auto}
.proposal-page table{width:100%;border-collapse:collapse;font-size:14px}
.proposal-page th,.proposal-page td{padding:10px 8px;border-top:1px solid var(--line);text-align:left;vertical-align:top}
.proposal-page th{font-size:9px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted);font-weight:600}
.proposal-page tr.open td:nth-child(3){color:var(--terracotta);font-weight:600}
.sources{margin:0;padding:0;list-style:none}
.sources li{padding:10px 0;border-top:1px solid var(--line);overflow-wrap:anywhere}
@media(max-width:900px){.proposal-pair{grid-template-columns:1fr}}
@media(max-width:640px){.proposal-block{padding-top:48px;padding-bottom:48px}.two-col{grid-template-columns:1fr}
  .proposal-page table,.proposal-page thead,.proposal-page tbody,.proposal-page tr,.proposal-page td{display:block}.proposal-page thead{display:none}
  .proposal-page tr{padding:8px 0;border-top:1px solid var(--line)}.proposal-page td{border:0;padding:2px 0}
  .proposal-page td:first-child{float:left;width:28px;color:var(--terracotta)}.proposal-page td:last-child{font-size:11px;color:var(--muted)}}

/* At least 24 px everywhere (WCAG 2.5.8) without moving anything. */
.site-header nav a,.programme-note a,.concept-disclaimer a{display:inline-block;padding:6px 0;margin:-6px 0}

/* Tap targets of 44 px on phones without moving anything: padding, cancelled by a negative margin. */
@media(max-width:640px){
  .wordmark,.footer-wordmark{display:inline-block;padding:8px 0;margin:-8px 0}
  .programme-note a,.concept-disclaimer a{padding:17px 0;margin:-17px 0}
  .concept-actions .text-button{min-height:44px}
}

/* Hub page (capy.life): two place cards, three family cards. */
.activity-grid-two{grid-template-columns:repeat(2,minmax(0,1fr))}
.hub-family .activity-copy{padding-top:0;border-top:1px solid var(--line);padding-top:18px}
.concept-actions .button+.button{margin-left:12px}
@media(max-width:580px){.activity-grid-two{grid-template-columns:1fr}.concept-actions .button+.button{margin:12px 0 0}}
