:root{--ink:#101b31;--muted:#536078;--teal:#00256b;--teal2:#2457a7;--mint:#e6edf8;--paper:#f8f9fc;--line:#d7deea;--night:#001947;--white:#fff;--orange:#f28c00;--radius:22px;--shadow:0 18px 50px rgba(0,37,107,.11)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.6}a{color:inherit}.skip-link{position:fixed;left:1rem;top:-5rem;z-index:99;background:var(--ink);color:#fff;padding:.75rem 1rem;border-radius:6px}.skip-link:focus{top:1rem}.site-header{height:74px;padding:0 clamp(1.2rem,4vw,4rem);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:20;background:rgba(248,249,252,.95);backdrop-filter:blur(14px);border-bottom:1px solid rgba(215,222,234,.9)}.brand{display:flex;gap:.7rem;align-items:center;text-decoration:none;font-weight:800;letter-spacing:-.02em}.brand-mark{width:36px;height:36px;object-fit:cover;border-radius:10px;background:var(--teal)}nav{display:flex;gap:1.4rem}nav a{text-decoration:none;color:var(--muted);font-size:.92rem;font-weight:700}nav a:hover,nav a:focus-visible{color:var(--teal)}.hero{padding:5rem clamp(1.2rem,7vw,7rem);display:grid;position:relative;grid-template-columns:minmax(0,1.05fr) minmax(320px,.8fr);gap:clamp(3rem,7vw,8rem);align-items:center;overflow:hidden;background:radial-gradient(circle at 82% 14%,rgba(36,87,167,.16),transparent 34%),linear-gradient(180deg,#f8f9fc 0%,#eef2f8 100%)}.hero::after{content:"";position:absolute;left:clamp(1.2rem,7vw,7rem);right:clamp(1.2rem,7vw,7rem);bottom:1.5rem;height:2px;border-radius:999px;background:linear-gradient(90deg,transparent 0%,rgba(36,87,167,.28) 12%,var(--teal2) 50%,rgba(36,87,167,.28) 88%,transparent 100%)}.eyebrow{margin:0 0 1rem;color:var(--teal);text-transform:uppercase;letter-spacing:.15em;font-size:.77rem;font-weight:850}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(3.7rem,8vw,7.3rem);line-height:.93;letter-spacing:-.067em;margin-bottom:2rem;max-width:820px}h1 span{color:var(--teal)}.lead{max-width:670px;font-size:clamp(1.08rem,1.65vw,1.32rem);color:var(--muted)}.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2.2rem}.button{display:inline-block;padding:.9rem 1.2rem;border-radius:10px;font-weight:800;text-decoration:none;text-align:center;transition:transform .18s ease,box-shadow .18s ease}.button:hover{transform:translateY(-2px)}.button.primary{color:#fff;background:var(--teal);box-shadow:0 8px 22px rgba(0,37,107,.25)}.button.secondary{border:1px solid var(--line);background:var(--white)}.button.wide{display:block;width:100%}.privacy-note{margin:1.35rem 0 0;color:var(--muted);font-size:.93rem}.privacy-note span{color:var(--teal);font-weight:900}.app-preview{padding:1.2rem;border-radius:26px;background:var(--night);box-shadow:0 28px 80px rgba(0,25,71,.28);transform:rotate(1deg)}.preview-top{display:flex;justify-content:space-between;align-items:center;padding:.45rem .5rem 1.1rem;color:#fff;font-weight:800}.status-dot{font-size:.78rem;color:#dce8ff;background:rgba(255,255,255,.13);padding:.25rem .55rem;border-radius:999px}.preview-card{display:grid;grid-template-columns:44px 1fr;gap:.1rem .8rem;padding:1rem;margin:.7rem 0;border-radius:14px;background:#fff}.preview-card.accent{background:var(--mint)}.preview-card small{grid-row:1/3;display:grid;place-items:center;width:38px;height:38px;border-radius:10px;color:#fff;background:var(--teal);font-weight:850}.preview-card strong{line-height:1.25}.preview-card span{color:var(--muted);font-size:.85rem}.preview-image-card{overflow:hidden;border-radius:14px;background:#fff;box-shadow:0 10px 28px rgba(0,0,0,.2)}.preview-image-card img{display:block;width:100%;height:auto}.section{padding:clamp(5rem,9vw,8rem) clamp(1.2rem,7vw,7rem)}.section-heading{max-width:780px;margin-bottom:3rem}.section-heading h2,.final-cta h2{font-size:clamp(2.35rem,5vw,4.6rem);line-height:1.02;letter-spacing:-.05em;margin-bottom:1.2rem}.section-heading>p:last-child{color:var(--muted);font-size:1.1rem}.faq-section{padding-top:4rem}.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.faq-grid details{padding:1.25rem 1.4rem;border:1px solid var(--line);border-radius:16px;background:#fff}.faq-grid summary{cursor:pointer;font-weight:800;list-style:none;padding-right:2rem;position:relative}.faq-grid summary::after{content:"+";position:absolute;right:0;color:var(--teal);font-size:1.2rem}.faq-grid details[open] summary::after{content:"−"}.faq-grid p{margin:.8rem 0 0;color:var(--muted)}.step-section{background:#eef2f8}.instruction-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:3rem;align-items:start}.numbered-steps{list-style:none;padding:0;margin:0}.numbered-steps li{display:grid;grid-template-columns:52px 1fr;gap:1rem;padding:0 0 2rem}.numbered-steps li>span{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--mint);color:var(--teal);font-weight:900}.numbered-steps h3{margin:.15rem 0 .25rem}.numbered-steps p{color:var(--muted);margin:0}.action-card{padding:2rem;border-radius:var(--radius);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);position:sticky;top:100px}.action-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--teal);font-weight:850}.action-card h3{font-size:1.8rem;line-height:1.15;margin:.7rem 0}.action-card p{color:var(--muted)}code{background:#e8edf5;padding:.1rem .35rem;border-radius:5px}.dark-section{background:var(--night);color:#fff}.section-heading.light .eyebrow{color:#8fb7ff}.section-heading.light>p:last-child{color:#c4d1e8}.walkthrough{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.walk-card{padding:1rem 1rem 1.4rem;border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);background:rgba(255,255,255,.06)}.walk-card h3{margin:.5rem 0}.walk-card p{margin:0;color:#c4d1e8}.walk-number{display:inline-block;margin-top:1rem;color:#8fb7ff;font-size:.75rem;font-weight:900;letter-spacing:.1em}.walk-card .ui-shot-img{display:block;width:100%;height:230px;object-fit:contain;background:#f7f9fc;border-radius:15px;box-shadow:inset 0 0 0 1px #d7deea}
.ui-shot{min-height:220px;padding:1rem;border-radius:15px;color:var(--ink);background:#f7f9fc;box-shadow:inset 0 0 0 1px #d7deea}.ui-bar{display:flex;gap:.3rem;margin-bottom:1rem}.ui-bar span{width:7px;height:7px;border-radius:50%;background:#c2ccdc}.ui-title{font-size:.72rem;color:var(--teal);font-weight:900;letter-spacing:.12em;margin-bottom:.7rem}.ui-grid{display:grid;grid-template-columns:1fr 1fr;gap:.55rem}.ui-grid>*{padding:.75rem .55rem;border-radius:8px;background:#fff;border:1px solid var(--line);font-size:.72rem;text-align:center}.ui-grid b{background:var(--mint);border-color:#a9bfe2}.dialog-shot label{display:block;font-size:.68rem;font-weight:800;margin-top:.65rem}.dialog-title{font-weight:900;border-bottom:1px solid var(--line);padding-bottom:.65rem}.fake-field{margin-top:.2rem;padding:.55rem .65rem;border:1px solid #bcc8da;border-radius:7px;background:#fff;color:#67748b;font-size:.75rem}.fake-check{margin-top:.8rem;color:var(--teal);font-size:.72rem;font-weight:700}.success-shot{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}.success-shot .success-icon{display:grid;place-items:center;width:54px;height:54px;margin-bottom:.8rem;border-radius:50%;background:var(--mint);color:var(--teal);font-size:1.5rem;font-weight:900}.success-shot span{margin-top:.35rem;color:var(--muted);font-size:.8rem}.notice{display:grid;grid-template-columns:auto 1fr;gap:1rem;margin-top:1.4rem;padding:1rem 1.2rem;border-radius:13px;background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.35)}.notice strong{color:#ffd47c}.notice p{margin:0;color:#dce4f2}.check-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:3rem;align-items:start}.check-flow article{display:grid;grid-template-columns:48px 1fr;gap:1rem;padding:0 0 2rem;position:relative}.check-flow article:not(:last-child)::before{content:"";position:absolute;top:45px;bottom:0;left:22px;border-left:1px solid #b6c6df}.check-flow article>span{display:grid;place-items:center;width:45px;height:45px;border-radius:50%;color:#fff;background:var(--teal);font-weight:900}.check-flow h3{margin:.15rem 0 .25rem}.check-flow p{margin:0;color:var(--muted)}.calendar-card{padding:2rem;border-radius:var(--radius);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}.calendar-head{display:flex;gap:1rem;align-items:center;padding-bottom:1.2rem;border-bottom:1px solid var(--line)}.calendar-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:12px;background:#4285f4;color:#fff;font-size:1.25rem;font-weight:800}.calendar-head span,.calendar-head strong{display:block}.calendar-head span{color:var(--muted);font-size:.78rem}.calendar-card ul{padding-left:1.2rem;color:var(--muted)}.calendar-card li{margin:.55rem 0}.tip{margin-top:1.4rem;padding:1rem;border-radius:12px;background:var(--mint)}.tip p{margin:.35rem 0 0;color:var(--muted);font-size:.9rem}.final-cta{text-align:center;background:linear-gradient(135deg,#e2eaf7,#f4f6fa)}.final-cta h2{max-width:850px;margin:0 auto 2rem}.final-cta .button{min-width:220px}footer{padding:2.5rem clamp(1.2rem,7vw,7rem);display:flex;justify-content:space-between;gap:2rem;color:#c4d1e8;background:#001238;font-size:.9rem}footer p{margin:0}footer strong{color:#fff}
@media(max-width:1000px){nav{display:none}.walkthrough{grid-template-columns:1fr}.ui-shot{min-height:190px}.check-layout{grid-template-columns:1fr}.calendar-card{max-width:700px}}
@media(max-width:820px){.hero{grid-template-columns:1fr;padding-top:4.5rem}.app-preview{max-width:560px}.faq-grid{grid-template-columns:1fr}.faq-grid details:last-child{grid-column:auto}.instruction-grid{grid-template-columns:1fr}.action-card{position:static}}
@media(max-width:560px){.site-header{height:64px}.brand span{font-size:.92rem}.hero{min-height:auto;padding-bottom:4rem}h1{font-size:clamp(3.1rem,16vw,4.7rem)}.section{padding-left:1rem;padding-right:1rem}.faq-grid details{padding:1rem}.walk-card{padding:.8rem .8rem 1.2rem}.ui-shot{min-height:210px}.notice{grid-template-columns:1fr}.calendar-card{padding:1.25rem}.calendar-head{align-items:flex-start}footer{flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}
.check-flow .ui-shot-img{display:block;width:100%;max-width:520px;height:auto;margin-top:.8rem;border-radius:15px;background:#f7f9fc;box-shadow:inset 0 0 0 1px #d7deea}

.tip .calendar-id-shot{display:block;width:100%;height:auto;margin-top:.9rem;border-radius:10px;border:1px solid #b6c6df}

.calendar-guide-block{padding-top:1.2rem}.calendar-guide-block+ .calendar-guide-block{margin-top:.2rem;border-top:1px solid var(--line)}.calendar-guide-block>strong{display:block;color:var(--ink);font-size:1rem}.calendar-guide-block>p{margin:.35rem 0 0;color:var(--muted);font-size:.92rem}.calendar-guide-block ul{margin-bottom:0}
.create-calendar-shot{display:block;width:100%;height:auto;max-height:420px;object-fit:contain;object-position:left center;margin-top:.8rem;border-radius:12px;background:#f7f9fc;box-shadow:inset 0 0 0 1px var(--line)}

.menu-separator{width:1px;height:1.15rem;align-self:center;background:var(--line);margin-left:.15rem}.calendar-id-shot{width:100%;height:auto;object-fit:contain}

/* Hero responsive containment */
.hero>*{min-width:0}
.app-preview{width:100%;max-width:560px;justify-self:end;min-width:0}
.preview-image-card{width:100%;min-width:0;padding:clamp(.45rem,1vw,.8rem)}
.preview-image-card img{max-width:100%;object-fit:contain}
@media(max-width:820px){.app-preview{justify-self:start}}
@media(max-width:560px){.hero-copy{min-width:0}.hero-actions{display:grid;grid-template-columns:1fr;align-items:stretch}.hero-actions .button{width:100%;min-width:0}.app-preview{max-width:100%;padding:.85rem}.preview-top{padding:.35rem .2rem .75rem}.preview-image-card{padding:.45rem}h1{overflow-wrap:anywhere}}
