:root{--white:#fffdf6;--ink:#171712;--gold:#ffc367;--line:rgba(255,255,255,.18);--muted:rgba(255,253,246,.63)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--white);background:#111a17;font-family:"Arial Narrow","PingFang SC","Microsoft YaHei",Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit}
.shell{width:min(1260px,calc(100% - clamp(40px,10vw,152px)));margin-inline:auto}
.hero{position:relative;min-height:100svh;min-height:max(760px,100svh);overflow:hidden;display:flex;align-items:flex-end;background:#5f7778}
.hero-wallpaper,.hero-shade{position:absolute;inset:0;width:100%;height:100%}
.hero-wallpaper{left:10%;width:120%;border:0;pointer-events:none}
.hero-shade{pointer-events:none;background:linear-gradient(90deg,rgba(5,9,8,.97),rgba(5,9,8,.92) 44%,rgba(5,9,8,.55) 69%,rgba(5,9,8,.08) 96%),linear-gradient(0deg,rgba(5,8,7,.94),transparent 49%),linear-gradient(180deg,rgba(5,8,7,.35),transparent 25%)}
.topbar{position:absolute;z-index:2;top:0;left:0;right:0;height:100px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;flex-direction:column;gap:5px;text-decoration:none;text-shadow:0 1px 12px rgba(0,0,0,.55)}
.wordmark{font-family:"Segoe Script","Bradley Hand","Brush Script MT",cursive;font-size:25px;font-weight:600;letter-spacing:-.06em;line-height:.9}.wordmark>span{color:var(--gold)}.brand-subline{font-family:"Segoe Script","Bradley Hand","Brush Script MT",cursive;font-size:12px;opacity:.82;letter-spacing:-.02em}
.brand strong{font-size:16px;letter-spacing:.01em}
.brand span{color:rgba(255,255,255,.72);font-size:10px;font-weight:700;letter-spacing:.1em}
.brand:hover span{text-decoration:underline}
.install-switch{display:flex;align-items:center;gap:5px;padding:6px 7px 6px 17px;border:1px solid rgba(255,255,255,.28);border-radius:999px;background:rgba(8,12,11,.38);backdrop-filter:blur(14px);font-size:11px;font-weight:800;white-space:nowrap}
.install-switch span{margin-right:7px}
.install-switch a{display:grid;place-items:center;min-width:42px;height:32px;padding-inline:10px;border-radius:999px;text-decoration:none;font-size:10px;letter-spacing:.08em}
.install-switch a:first-of-type{color:var(--ink);background:var(--white)}
.install-switch a:hover{color:var(--ink);background:var(--gold)}
.hero-content{position:relative;z-index:1;padding-top:180px;padding-bottom:clamp(105px,15vh,165px)}
.kicker{position:relative;margin:0 0 22px;padding-left:38px;color:var(--gold);font-size:11px;font-weight:800;letter-spacing:.17em;line-height:1.5}
.kicker::before{content:"";position:absolute;left:0;top:.65em;width:27px;height:2px;background:var(--gold)}
h1,h2,h3,p{overflow-wrap:break-word}
h1{max-width:750px;margin:0;font-size:clamp(54px,5.6vw,78px);line-height:1;letter-spacing:-.07em;text-shadow:0 2px 22px rgba(0,0,0,.26)}
h1 span{color:#fff2d7}
.hero-statement{margin:24px 0 0;font-size:clamp(22px,2.6vw,35px);font-weight:700;letter-spacing:-.025em}
.hero-copy{max-width:660px;margin:18px 0 0;color:rgba(255,253,246,.83);font-size:16px;line-height:1.75}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:29px}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;min-height:51px;padding:13px 18px;border:1px solid rgba(255,255,255,.38);border-radius:999px;text-decoration:none;font-size:11px;font-weight:850;letter-spacing:.08em;transition:background .2s ease,transform .2s ease}
.button:hover{transform:translateY(-2px)}
.button-primary{color:var(--ink);background:var(--white);border-color:var(--white)}
.button-primary:hover{background:var(--gold);border-color:var(--gold)}
.button-quiet{background:rgba(8,12,11,.28);backdrop-filter:blur(12px)}
.button-quiet:hover{background:rgba(8,12,11,.58)}
.hero-note{max-width:640px;margin:18px 0 0;color:rgba(255,253,246,.61);font-size:12px;line-height:1.65}
.scroll-cue{position:absolute;right:clamp(24px,5vw,76px);bottom:38px;z-index:1;text-decoration:none;font-size:10px;font-weight:800;letter-spacing:.15em;opacity:.68}
.scroll-cue span{margin-left:10px;font-size:17px}
.experience,.themes,.setup,.faq{padding-block:clamp(90px,10vw,145px)}
.experience{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:90px}
.section-heading h2,.themes h2,.host-section h2{margin:0;font-size:clamp(42px,5vw,72px);line-height:1.05;letter-spacing:-.055em}
.section-heading>p:last-child{max-width:485px;margin:22px 0 0;color:var(--muted);font-size:16px;line-height:1.7}
.feature-list{border-top:1px solid var(--line)}
.feature-list article{display:grid;grid-template-columns:48px 120px 1fr;gap:14px;align-items:baseline;padding:26px 0;border-bottom:1px solid var(--line)}
.feature-list article>span{color:var(--gold);font-size:11px;font-weight:800}
.feature-list h3{margin:0;font-size:25px;letter-spacing:-.03em}
.feature-list p{margin:0;color:var(--muted);font-size:14px;line-height:1.65}
.themes{padding-top:0}
.themes-heading{display:flex;align-items:end;justify-content:space-between;gap:45px;margin-bottom:34px}
.themes-heading>p{max-width:420px;margin:0;color:var(--muted);font-size:15px;line-height:1.7}
.theme-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
.theme-strip a{position:relative;display:block;min-height:350px;overflow:hidden;border:1px solid var(--line);border-radius:16px;background:#385152;text-decoration:none;transition:transform .22s ease,border-color .22s ease}
.theme-strip a:hover{transform:translateY(-6px);border-color:var(--white)}
.theme-strip a::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,8,7,.82),transparent 58%)}
.theme-strip img{display:block;width:100%;height:100%;position:absolute;inset:0;object-fit:cover}
.theme-strip span{position:absolute;z-index:1;left:24px;bottom:22px;display:flex;flex-direction:column;gap:6px}
.theme-strip small{font-size:10px;font-weight:800;letter-spacing:.16em;opacity:.75}
.theme-strip strong{font-size:27px;letter-spacing:-.025em}
.host-section{padding-block:clamp(90px,10vw,145px);background:radial-gradient(circle at 82% 25%,rgba(113,155,131,.17),transparent 38%),#18231f;border-block:1px solid var(--line)}
.host-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px}
.host-copy{max-width:610px}
.host-copy p{margin:0 0 22px;color:rgba(255,253,246,.7);font-size:17px;line-height:1.8}
.host-copy p:last-child{margin-bottom:0}
.host-copy a{color:var(--white);text-underline-offset:4px}
.setup{border-bottom:1px solid var(--line)}
.setup-links{margin-top:54px;border-top:1px solid var(--line)}
.setup-links a{display:grid;grid-template-columns:210px 1fr 28px;align-items:center;gap:28px;min-height:155px;padding-block:25px;border-bottom:1px solid var(--line);text-decoration:none;transition:background .2s ease,padding .2s ease}
.setup-links a:hover{padding-inline:15px;background:rgba(255,255,255,.045)}
.platform-label{color:var(--gold);font-size:11px;font-weight:850;letter-spacing:.13em}
.setup-links h3{margin:0;font-size:29px;letter-spacing:-.03em}
.setup-links p{margin:8px 0 0;color:var(--muted);font-size:14px;line-height:1.6}
.setup-links b{font-size:24px;font-weight:400}
.faq{display:grid;grid-template-columns:1fr 1.25fr;gap:90px}
.faq-list{border-top:1px solid var(--line)}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list summary{position:relative;cursor:pointer;list-style:none;padding:24px 34px 24px 0;font-size:18px;font-weight:700;line-height:1.4}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"+";position:absolute;right:4px;top:23px;color:var(--gold);font-size:26px;font-weight:300}
.faq-list details[open] summary::after{content:"−"}
.faq-list details p{margin:0;padding:0 30px 23px 0;color:var(--muted);font-size:15px;line-height:1.75}
footer{min-height:110px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);color:var(--muted);font-size:12px}
footer a{color:var(--white);text-decoration:none;font-weight:800}
footer a:last-child{color:var(--gold);letter-spacing:.1em}
@media(max-width:1000px){.experience,.host-grid,.faq{gap:50px}.feature-list article{grid-template-columns:38px 95px 1fr}.theme-strip a{min-height:290px}}
@media(max-width:760px){.shell{width:calc(100% - 36px)}.hero{min-height:max(790px,100svh)}.hero-wallpaper{left:0;width:100%}.hero-shade{background:linear-gradient(0deg,rgba(5,8,7,.94),rgba(5,8,7,.5) 70%,rgba(5,8,7,.42)),linear-gradient(90deg,rgba(5,8,7,.5),transparent)}.topbar{height:78px}.brand strong{font-size:13px}.brand span{font-size:8px}.install-switch{padding-left:9px}.install-switch span{display:none}.hero-content{padding-top:150px;padding-bottom:105px}.kicker{font-size:9px}.hero h1{font-size:clamp(43px,11vw,70px)}.hero-statement{font-size:22px}.hero-copy{font-size:14px}.scroll-cue{display:none}.experience,.host-grid,.faq{grid-template-columns:1fr;gap:42px}.themes-heading{display:block}.themes-heading>p{margin-top:20px}.theme-strip{display:flex;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:10px}.theme-strip a{flex:0 0 min(76vw,300px);min-height:300px;scroll-snap-align:start}.setup-links a{grid-template-columns:1fr 24px;gap:12px;min-height:160px}.platform-label{grid-column:1/-1}.setup-links h3{font-size:25px}.setup-links b{grid-column:2;grid-row:2}.feature-list article{grid-template-columns:42px 90px 1fr}}
@media(max-width:480px){.hero h1{font-size:43px}.hero-actions{display:flex;flex-direction:column;align-items:flex-start}.button{min-width:240px}.feature-list article{grid-template-columns:38px 1fr;gap:5px}.feature-list h3{font-size:23px}.feature-list p{grid-column:2}.themes h2,.section-heading h2,.host-section h2{font-size:42px}.faq-list summary{font-size:16px}footer{flex-wrap:wrap;padding-block:26px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}