/* Shared Focusly layout: centered timer, readable locks and normal page flow. */
#home { --muted:#66545e; }
#home .circular-hero { max-width:1180px; }
#home .circular-hero .guest-hero { display:flex; flex-direction:column; align-items:center; text-align:center; padding:36px 0 48px; }
#home .guest-hero>.hero-tag { margin:0 0 16px; }
#home .circular-hero h1 { max-width:1100px; font-size:clamp(46px,5.6vw,80px); line-height:1.05; margin:0 0 20px; }
#home .circular-hero h1 .focus-word { display:inline-block; }
#home .circular-hero .lead { font-size:18px; line-height:1.6; max-width:650px; margin:0; color:var(--ink); }
#home .circular-hero .hero-cta { justify-content:center; margin:22px 0 0; }
#home .hero-cta .guest-signup-link { font-size:14px!important; font-weight:650; color:var(--pink-ink); }
#guestStudyTimer { width:min(600px,100%); max-width:640px; margin:28px auto 0; padding:28px; border-color:#e5bfd1; box-shadow:0 18px 50px -35px #b83f8660; }
#guestStudyTimer .guest-heading { margin-bottom:12px; }
#guestStudyTimer .guest-dial { width:min(100%,360px); margin:20px auto; }
#guestStudyTimer .guest-clock { font-size:clamp(64px,6.5vw,88px); }
#guestStudyTimer .guest-dial-hint, #guestStudyTimer .guest-switch-note { display:none; }
#guestStudyTimer .guest-settings { gap:10px; }
#guestStudyTimer .guest-status { margin:10px 0 12px; font-size:13px; }
#guestStudyTimer .guest-note { margin-top:12px; font-size:11px; }
#guestStudyTimer .guest-invitation p { margin-bottom:8px; }
.timer-sound-button, #guestStudyTimer .guest-settings .timer-sound-button { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; min-width:44px; padding:10px; border:1px solid var(--line); border-radius:50%; background:var(--card); color:var(--ink); vertical-align:middle; cursor:pointer; }
.timer-sound-button [data-guest-sound-label], .timer-sound-button [data-sound-label] { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.timer-sound-button[aria-pressed=false] .guest-sound-audible, .timer-sound-button[aria-pressed=true] .guest-sound-muted { display:none; }
.timer-sound-button:focus-visible { outline:3px solid var(--pink); outline-offset:3px; }
#home .how-simple { display:grid; grid-template-columns:1fr 260px; gap:80px; align-items:center; padding:32px 0 48px; border-top:1px solid var(--line); }
#home .how-simple h2 { font-size:clamp(34px,4vw,52px); letter-spacing:-.05em; line-height:1.12; margin:14px 0; }
#home .how-simple p { color:var(--muted); font-size:17px; line-height:1.7; max-width:400px; }
.phone-preview { width:172px; border:6px solid #281d23; border-radius:30px; padding:16px 12px 14px; background:var(--card); text-align:center; color:var(--ink); transform:rotate(5deg); box-shadow:12px 18px 0 var(--peach-soft); justify-self:center; }
.phone-island { width:55px; height:10px; border-radius:20px; background:#281d23; margin:-8px auto 14px; }
.phone-brand { font-size:13px; font-weight:750; color:var(--pink-ink); }
.phone-mode { font-size:10px; margin-top:14px; }
.phone-ring { display:grid; place-items:center; width:112px; height:112px; border:5px solid var(--soft); border-radius:50%; margin:10px auto 14px; }
.phone-ring span { font-size:28px; font-variant-numeric:tabular-nums; letter-spacing:-.06em; }
.phone-start { background:var(--pink); color:white; font-size:11px; font-weight:700; padding:9px; border-radius:9px; }
.phone-preview small { display:block; font-size:9px; color:var(--muted); margin-top:10px; }
#home .pricing-v4 { padding:44px 0; }
#home .pricing-intro { margin-bottom:25px; }
#home .pricing-intro h2 { font-size:clamp(34px,4vw,52px); line-height:1.1; }
#home .together-section { padding:38px 0; }
#home .together-art { max-height:200px; }
#home .together-layout p { font-size:16px; line-height:1.6; }
#tab-achievements .achievement-card.locked { background:#f3f3f4; border-color:#d9d9dd; filter:none; opacity:1; }
#tab-achievements .achievement-card.locked .badge-art { filter:grayscale(1); }
#tab-achievements .achievement-card.locked h4 { color:#44434b; }
#tab-achievements .achievement-card.locked p, #tab-achievements .achievement-card.locked .achievement-detail { color:#62616a; }
#tab-achievements .achievement-card.locked .rarity { background:#e3e3e6; color:#50505a; }
#tab-achievements .achievement-card.locked progress::-webkit-progress-value { background:#85848d; }
#tab-achievements .achievement-card.locked progress::-moz-progress-bar { background:#85848d; }
@media(max-width:800px) {
 #home .circular-hero .guest-hero { padding:28px 0 36px; }
 #home .guest-hero>.hero-tag { margin-bottom:14px; }
 #home .circular-hero h1 { font-size:clamp(42px,8.5vw,64px); margin-bottom:18px; }
 #home .circular-hero .lead { max-width:600px; font-size:16px; margin:0; }
 #guestStudyTimer { width:min(600px,100%); padding:20px; margin-top:24px; }
 #guestStudyTimer .guest-dial { width:min(100%,300px); margin:18px auto; }
 #home .circular-hero .hero-cta { margin-top:20px; }
 #home .how-simple { grid-template-columns:1fr 172px; gap:20px; padding:28px 0 36px; }
 #home .how-simple h2 { font-size:34px; }
 #home .how-simple p { font-size:14px; }
 .phone-preview { transform:rotate(3deg) scale(.85); }
}
@media(max-width:420px) {
 #guestStudyTimer .guest-dial { width:min(100%,280px); }
 #guestStudyTimer { padding:18px; }
 #guestStudyTimer .guest-clock { font-size:64px; }
 #home .how-simple { grid-template-columns:1fr 128px; gap:10px; }
 #home .how-simple h2 { font-size:28px; }
 .phone-preview { width:148px; padding:14px 8px; transform:scale(.8); margin-left:-6px; }
 .phone-ring { width:98px; height:98px; }
 #home .hero-cta { gap:6px 12px; }
}
@media(prefers-reduced-motion:reduce) { .phone-preview { transform:none; box-shadow:6px 6px 0 var(--peach-soft); } }

/* Public sections remain in normal flow; only their own artwork may clip. */
#home { overflow:visible; height:auto; padding-bottom:0; }
#home #how-it-works, #home #pricing, #home #features { scroll-margin-top:96px; }
.landing-footer { padding:30px 0 calc(30px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); background:var(--card); color:var(--ink); }
.landing-footer .landing-shell { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:18px; }
.landing-footer strong { font-size:22px; letter-spacing:-.04em; }
.landing-footer nav { display:flex; gap:20px; flex-wrap:wrap; }
.landing-footer a { display:inline-flex; align-items:center; min-height:44px; font-size:13px; color:var(--ink); }
.landing-footer small { display:block; color:var(--muted); font-size:12px; margin-top:6px; }
#tab-achievements .achievement-lock { display:none; }
#tab-achievements .achievement-card.locked .badge-art::before { background:transparent; box-shadow:none; border:0; }
#tab-achievements .achievement-card.locked .badge-art>svg:not(.achievement-lock) { display:none; }
#tab-achievements .achievement-card.locked .badge-art>.achievement-lock { display:block; width:56px; height:56px; color:#71717b; }
.modal-dismiss-note { color:var(--ink); font-size:13px; line-height:1.6; margin:12px 0 0; }
@media(max-width:560px) {
 .landing-footer .landing-shell { align-items:flex-start; }
 .landing-footer nav { gap:12px; }
 #tab-achievements .achievement-card.locked .badge-art>.achievement-lock { width:48px; height:48px; }
}
