
:root{--bg:#F6EFE3;--bg2:#EFE5D3;--card:#FFFBF2;--line:#E2D6C0;--ink:#1B1612;--mut:#5E554A;--acc:#E4571B;--onacc:#fff;--hero1:#F2E7D2;--ok:#2a8a4f;--bad:#c0392b;--shadow:0 6px 24px rgba(40,25,10,.10);--disp:'Bricolage Grotesque','Inter',system-ui,sans-serif;--body:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0E1117;--bg2:#12161E;--card:#171B24;--line:#262C38;--ink:#F3EFE8;--mut:#A9AEB8;--acc:#F26A1B;--hero1:#151A24;--ok:#4fcf86;--bad:#ff7d6e;--shadow:0 6px 24px rgba(0,0,0,.45);color-scheme:dark}}
:root[data-theme=dark]{--bg:#0E1117;--bg2:#12161E;--card:#171B24;--line:#262C38;--ink:#F3EFE8;--mut:#A9AEB8;--acc:#F26A1B;--hero1:#151A24;--ok:#4fcf86;--bad:#ff7d6e;--shadow:0 6px 24px rgba(0,0,0,.45);color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 var(--body);-webkit-font-smoothing:antialiased}img{max-width:100%;display:block}a{color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}
nav{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}nav .wrap{display:flex;align-items:center;gap:14px;height:64px}
.brand{white-space:nowrap;display:flex;align-items:center;gap:10px;text-decoration:none;font:800 19px/1 var(--disp);letter-spacing:-.02em}.brand svg{width:26px;height:30px;fill:var(--ink)}.brand .eye,.gh .eye{fill:var(--bg)}
nav .sp{flex:1}.lang{display:flex;gap:4px}.lang button{border:1px solid var(--line);background:transparent;color:var(--mut);padding:6px 9px;border-radius:8px;font:700 12px var(--body);cursor:pointer}.lang button[aria-pressed=true]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.btn{border:0;border-radius:999px;background:var(--acc);color:var(--onacc);font:700 15px var(--body);padding:13px 24px;min-height:46px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.btn:hover{filter:brightness(1.08)}.btn.sec{background:transparent;color:var(--ink);border:1.5px solid var(--line)}.btn.sm{padding:9px 18px;min-height:40px}
.back{display:inline-flex;align-items:center;gap:10px;margin:0 12px 14px 0;padding:7px 16px 7px 10px;border:1.5px solid var(--line);border-radius:999px;background:var(--card);text-decoration:none;font:600 14px var(--body)}.back:hover{border-color:var(--bc,var(--acc))}.back .gimg{width:20px;height:24px;fill:var(--ink)}.back .eye{fill:var(--card)}img.gimg{width:auto!important;height:28px;max-width:44px;object-fit:contain}.back img.gimg{height:26px}
.chip{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;background:var(--card);border:1px solid var(--line);font:600 13px var(--body)}.chip i{width:9px;height:9px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px color-mix(in srgb,var(--ok) 25%,transparent)}.chip.off i{background:var(--bad);box-shadow:none}
.hero{position:relative;overflow:hidden;background:radial-gradient(900px 420px at 90% -10%,color-mix(in srgb,var(--bc,var(--acc)) 22%,transparent),transparent 62%),var(--hero1);border-bottom:1px solid var(--line)}
.hero .gh{position:absolute;right:-40px;top:20px;width:300px;opacity:.07;pointer-events:none}.hero .gh svg{width:100%;fill:var(--ink)}
.hero .wrap{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:center;padding-top:56px;padding-bottom:60px}
.kick{font:700 12px var(--body);letter-spacing:.22em;text-transform:uppercase;color:var(--bc,var(--acc));margin:18px 0 0}
h1{font:800 clamp(38px,6vw,68px)/1.02 var(--disp);letter-spacing:-.035em;margin:12px 0 16px}h1 em{font-style:normal;color:var(--bc,var(--acc))}
.lead{font-size:18px;color:var(--mut);max-width:34em;margin:0 0 26px}.cta{display:flex;gap:12px;flex-wrap:wrap}
.vid{border-radius:22px;overflow:hidden;background:#000;aspect-ratio:16/10;box-shadow:var(--shadow);border:1px solid var(--line)}.vid[hidden]{display:none}.vid video,.vid iframe{width:100%;height:100%;object-fit:cover;border:0}
.ph1{border-radius:22px;aspect-ratio:16/10;background:color-mix(in srgb,var(--bc,var(--acc)) 28%,var(--card)) center/cover;border:1px solid var(--line);display:grid;place-items:center}
@media(max-width:520px){nav .wrap{gap:8px}.brand{font-size:16px;gap:7px}.brand svg{width:22px;height:26px}.lang{gap:3px}.lang button{padding:5px 6px;font-size:11px}.btn.sm{padding:8px 13px;font-size:14px}}
@media(max-width:860px){.hero .wrap{grid-template-columns:1fr;padding-top:34px;padding-bottom:40px}.hero .gh{width:200px}}
section{padding:54px 0}h2{font:800 clamp(26px,3.6vw,38px)/1.1 var(--disp);letter-spacing:-.03em;margin:0 0 22px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}.cc{display:block;text-decoration:none;background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden;border-top:5px solid var(--bc);transition:transform .15s}.cc:hover{transform:translateY(-3px)}
.cc .im{aspect-ratio:16/10;background:color-mix(in srgb,var(--bc) 30%,var(--card)) center/cover}.cc div.t{padding:16px}.cc b{display:block;font:800 20px var(--disp);letter-spacing:-.02em}.cc span{color:var(--mut);font-size:14px}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}.steps div{border-top:2px solid var(--acc);padding-top:12px}.steps b{display:block;font:800 18px var(--disp)}.steps span{color:var(--mut);font-size:15px}
.pts{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.pts div{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;border-left:5px solid var(--bc)}.pts b{display:block;font:700 17px var(--disp)}.pts span{color:var(--mut);font-size:15px}
.txt p{color:var(--mut);font-size:17px;max-width:44em}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,160px),1fr));gap:12px}@media(min-width:700px){.grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}}.it{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;text-decoration:none}.it .im{aspect-ratio:4/3;background:color-mix(in srgb,var(--bc) 26%,var(--card)) center/cover}.it .b{padding:12px 14px;display:flex;justify-content:space-between;gap:10px;align-items:baseline}.it b{font-weight:650;font-size:15px}.it span{font-weight:700;color:var(--bc)}
h3.cat{font:700 14px var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin:26px 0 12px}
details{background:var(--card);border:1px solid var(--line);border-radius:14px;margin:0 0 10px;padding:0 18px}summary{cursor:pointer;font-weight:650;padding:15px 0;list-style:none;display:flex;justify-content:space-between;gap:12px}summary::after{content:"+";font-size:22px;color:var(--acc)}details[open] summary::after{content:"\2212"}details p{margin:0 0 16px;color:var(--mut)}
.plat{display:flex;gap:10px;flex-wrap:wrap;align-items:center;color:var(--mut);font-size:14px;margin-top:18px}.plat a{border:1px solid var(--line);border-radius:999px;padding:6px 14px;text-decoration:none;font-weight:600;color:var(--ink)}
.tabs{display:flex;gap:8px;overflow-x:auto;padding:4px 0 14px;position:sticky;top:64px;z-index:20;background:var(--bg2);scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}
.tab{flex:none;display:flex;align-items:center;gap:8px;border:1.5px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:6px 16px 6px 6px;font:600 15px var(--body);cursor:pointer}.tab .th{width:34px;height:34px;border-radius:50%;background:color-mix(in srgb,var(--bc) 30%,var(--card)) center/cover}.tab[aria-selected=true]{background:var(--bc);border-color:var(--bc);color:var(--onbc,#fff)}
.subs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}.sb{border:1.5px solid var(--line);background:transparent;color:var(--ink);border-radius:999px;padding:8px 16px;font:600 14px var(--body);cursor:pointer}.sb[aria-pressed=true]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.tsep{flex:none;width:2px;background:var(--line);margin:4px 4px;border-radius:2px}
footer{background:var(--bg2);border-top:1px solid var(--line);padding:34px 0 46px;font-size:14px;color:var(--mut)}footer .wrap{display:flex;gap:30px;flex-wrap:wrap;justify-content:space-between}footer b{color:var(--ink)}
