/* Vitrolo — scenes.css · imza sahneler ve Home bölümleri. İLKE: CSS varsayılanı = SON HAL (reduced-motion / JS yok / ?static=1). Hareket modunda (html.mo) JS başlangıcı kurar. */
@property --m-bg{syntax:"<color>";inherits:true;initial-value:#FFF4E8}
@property --m-ink{syntax:"<color>";inherits:true;initial-value:#3A1F14}
@property --m-acc{syntax:"<color>";inherits:true;initial-value:#C8442C}
[data-scene]{--vis:1}
html.mo:not(.mo-ready):not(.mo-fail) [data-scene="hero"] .vs,html.mo:not(.mo-ready):not(.mo-fail) [data-scene="device"] .dev__stage{visibility:hidden}

/* =================== HERO (W1 + W7) =================== */
.hero{position:relative;padding-top:calc(var(--hdr) + clamp(24px,4vw,56px));padding-bottom:calc(var(--sec)*.45)}
.hero__grid{align-items:center;row-gap:36px}
.hero__h{font-size:clamp(2.6rem,1.4rem + 3.7vw,4.9rem);margin-bottom:28px}
@media (min-width:1024px){.hero__h{font-size:clamp(2.4rem,min(1.4rem + 3.7vw,8.4vh),4.9rem);margin-bottom:min(28px,3vh)}.hero .lead{font-size:clamp(1rem,min(.95rem + .45vw,2.5vh),1.3rem);margin-bottom:min(32px,3.4vh)}.hero .eyebrow{margin-bottom:min(24px,2.6vh)}.trust3{margin:min(28px,3vh) 0 min(18px,2vh)}}
.hero .lead{margin-bottom:32px;font-size:clamp(1.0625rem,.95rem + .45vw,1.3rem)}
.hero .eyebrow{margin-bottom:24px}
.trust3{display:flex;flex-wrap:wrap;gap:8px 22px;margin:28px 0 18px;font-size:.9375rem;font-weight:600}
.trust3 li{display:flex;align-items:center;gap:8px}
.trust3 li::before{content:"";width:12px;height:7px;border-left:2.5px solid var(--blue);border-bottom:2.5px solid var(--blue);transform:rotate(-45deg) translateY(-2px);flex:none}
.hero__sc{display:flex;flex-direction:column;align-items:center;gap:20px;position:relative}
.vs{position:relative;container-type:inline-size;width:min(100%,max(300px,calc((100svh - var(--hdr) - 190px)*.8333)));max-width:620px;aspect-ratio:100/120}
.vs>*{position:absolute}
.vs__bg{inset:0;width:100%;height:100%}
.vs__lights{inset:0;pointer-events:none}
.vs__lights i{position:absolute}
.vs__glow{left:-12%;top:18%;width:96%;height:80%;background:radial-gradient(closest-side,rgba(107,147,255,.55),rgba(107,147,255,0))}
.vs__pool{left:2%;top:85.5%;width:70%;height:9%;background:radial-gradient(closest-side,rgba(107,147,255,.5),rgba(107,147,255,0))}
.vs__board{left:14%;top:4.17%;width:72%;height:7.9%;display:flex;align-items:center;justify-content:center;color:#fff;overflow:hidden}
.vs__name{font-weight:700;letter-spacing:-.01em;white-space:nowrap;font-size:5.2cqw;line-height:1.1}
.vs__win{left:11%;top:30.83%;width:54%;height:49.17%;overflow:hidden}
.vs__win>i,.vs__win>div{position:absolute}
.vs__glass{inset:0;background:linear-gradient(#16213E,#1E2D58)}
.vs__refl{inset:0;background:linear-gradient(112deg,transparent 38%,rgba(255,255,255,.07) 38%,rgba(255,255,255,.07) 47%,transparent 47%,transparent 52%,rgba(255,255,255,.05) 52%,rgba(255,255,255,.05) 55%,transparent 55%);pointer-events:none;z-index:3}
.vs__panel{left:5%;top:6%;width:90%;height:88%}
.vs__outline{inset:0;width:100%;height:100%;z-index:2}
.vs__outline rect{stroke-dasharray:1;stroke-dashoffset:0;opacity:0}
.vs__paper{position:absolute;inset:0;background:#fff;border-radius:.9cqw;overflow:hidden}
.vs__dim{inset:0;background:#0F1730;opacity:0;z-index:2;pointer-events:none}
.vs__door{left:73.5%;top:32.9%;width:17%;height:40%}
.vs__doorlight{position:absolute;inset:0;background:linear-gradient(rgba(107,147,255,.22),rgba(107,147,255,.04))}
.vs__sway{position:absolute;inset:0;transform-origin:50% 0}
.vs__str{position:absolute;left:50%;top:2%;width:.3cqw;height:8cqw;margin-left:-.15cqw;background:rgba(255,255,255,.55)}
.vs__sign{position:absolute;left:11%;top:15cqw;width:78%;height:6.6cqw}
.vs__closed,.vs__open{position:absolute;inset:0;display:grid;place-items:center;border-radius:.9cqw;font-weight:700;font-size:1.95cqw;letter-spacing:.16em;text-transform:uppercase;transform-origin:50% 50%;backface-visibility:hidden}
.vs__closed{background:#F6F4EF;color:#16213E;transform:scaleX(0)}
.vs__open{background:#2F5BEA;color:#fff;box-shadow:0 0 3cqw rgba(107,147,255,.8)}
html.mo .vs__sway{animation:sway var(--sway-dur,4.4s) ease-in-out infinite}
@keyframes sway{0%,100%{transform:rotate(calc(var(--sway,3)*-1deg))}50%{transform:rotate(calc(var(--sway,3)*1deg))}}
.vs__replay{margin-top:-4px}
.namebox{width:100%;max-width:520px;display:grid;gap:6px}
.namebox__l{font-weight:700;font-size:.9375rem}
.namebox .fn{margin:0}
/* maket site */
.ms{position:absolute;inset:0;display:flex;flex-direction:column;font-size:1.5cqw;color:#16213E;line-height:1.3}
.ms-bar{height:3.6cqw;flex:none;display:flex;align-items:center;gap:.7cqw;padding:0 1.4cqw;background:#F1F3F9;border-bottom:.15cqw solid rgba(22,33,62,.1)}
.ms-bar i{width:.9cqw;height:.9cqw;border-radius:50%;background:#C9D3EE;flex:none}
.ms-url{margin-left:1cqw;flex:1;max-width:62%;height:2.1cqw;border-radius:1.1cqw;background:#fff;font-size:1.15cqw;display:flex;align-items:center;padding:0 1cqw;color:#55607C;overflow:hidden;white-space:nowrap}
.ms-body{flex:1;padding:1.4cqw 2cqw 2cqw;display:flex;flex-direction:column;gap:1.8cqw;min-height:0}
.ms-i{position:relative}
.ms-nav{display:flex;align-items:center;gap:1cqw}
.ms-logo{width:2.4cqw;height:2.4cqw;border-radius:50%;border:.55cqw solid #2F5BEA;border-right-color:#6B93FF;border-bottom-color:#16213E;flex:none}
.ms-nm{font-size:1.5cqw;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:42%}
.ms-links{margin-left:auto;display:flex;gap:1cqw}
.ms-links i{width:3cqw;height:.7cqw;border-radius:.4cqw;background:#C9D3EE}
.ms-btn-s{font-size:1.2cqw;font-weight:700;padding:.5cqw 1.3cqw;border-radius:1.5cqw;background:#16213E;color:#fff}
.ms-hero{display:flex;flex-direction:column;gap:1.1cqw;padding-top:1cqw}
.ms-h{font-size:4.6cqw;line-height:1;letter-spacing:-.025em;margin:0;overflow-wrap:anywhere;font-weight:700}
.ms-h[data-size="md"]{font-size:3.5cqw}.ms-h[data-size="lg"]{font-size:2.8cqw}
.ms-p{font-size:1.45cqw;color:#55607C;margin:0;max-width:78%}
.ms-btn{align-self:flex-start;padding:.9cqw 2.1cqw;border-radius:2cqw;background:#2F5BEA;color:#fff;font-weight:700;font-size:1.5cqw}
.ms-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2cqw;margin-top:auto}
.ms-tiles i{height:8.4cqw;border-radius:1cqw;position:relative;overflow:hidden}
.ms-tiles .t1{background:#2F5BEA}.ms-tiles .t2{background:#6B93FF}.ms-tiles .t3{background:#16213E}
.ms-tiles i::after{content:"";position:absolute;left:50%;top:50%;width:3.4cqw;height:3.4cqw;margin:-1.7cqw 0 0 -1.7cqw;border-radius:50%;border:.5cqw solid rgba(255,255,255,.85)}
.ms-tiles .t2::after{border-radius:.6cqw;transform:rotate(45deg)}
.ms-tiles .t3::after{border-color:#6B93FF;border-radius:.6cqw}
u.sk{position:absolute;inset:0;background:#DEE4F5;border-radius:.6cqw;text-decoration:none;opacity:0;pointer-events:none;z-index:2}
.ms-h u.sk,.ms-p u.sk{border-radius:.5cqw}
/* altyazılar: varsayılan = akış içi, iki sütun */
.hero__caps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gut);margin-top:clamp(40px,6vw,88px);padding-top:32px;border-top:1px solid var(--line)}
.cap__l{font-size:clamp(1.9rem,1.2rem + 2.3vw,3.4rem);font-weight:700;letter-spacing:-.03em;line-height:1.02;margin:6px 0 14px}
.cap__s{max-width:44ch;color:var(--mute)}
.cap .btns{margin-top:24px}
.cap .eyebrow{margin-bottom:8px}
@media (min-width:1024px){
  html.mo .hero{height:calc(var(--hero-vh)*1vh);padding:0}
  html.mo .hero__pin{position:sticky;top:0;height:100svh;min-height:660px;display:flex;flex-direction:column;justify-content:center;padding-top:var(--hdr);overflow:hidden}
  html.mo .hero__grid{align-items:center;row-gap:0;width:100%}
  html.mo .hero__caps{position:absolute;left:0;right:0;top:var(--hdr);bottom:0;margin:auto;display:grid;align-content:center;grid-template-columns:minmax(0,1fr);margin-top:0;padding-top:0;border:0;pointer-events:none;max-width:calc(var(--wrap) + var(--pad)*2)}
  html.mo .cap{grid-area:1/1;max-width:min(560px,46%);opacity:0;visibility:hidden}
  html.mo .cap .btn,html.mo .cap a{pointer-events:auto}
}
@media (max-width:1023px){
  .hero__grid{row-gap:56px}
  .hero__sc{order:2}
  .hero__caps{grid-template-columns:1fr;row-gap:44px}
  .vs{width:min(100%,520px)}
}
@media (max-width:600px){.hero__h{font-size:clamp(2.4rem,9.6vw,3.2rem)}.hero .lead{font-size:1.0625rem}}

/* =================== STORY (03/04/05) =================== */
.story__grid{row-gap:clamp(40px,6vw,88px);align-items:start}
.story__a{grid-row:1/span 2}
.story__b{grid-row:1;margin-top:clamp(0px,7vw,104px)}
.story__c{grid-row:2}
.vis{border-radius:var(--r-l);overflow:hidden;background:var(--mist);margin-bottom:26px;aspect-ratio:4/3;position:relative}
.vis--map{aspect-ratio:1/1.08}
.vis svg{width:100%;height:100%}
.vis--care{display:grid;place-items:center;background:#fff;box-shadow:0 0 0 1px var(--line);aspect-ratio:16/10}
.care-wrap{position:relative;height:78%;aspect-ratio:1}
.care-wrap svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.orbit-g{transform-origin:50px 50px}
html.mo .vis--care.in .orbit-g{animation:spin 9s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.big{font-size:clamp(1.7rem,1.2rem + 1.7vw,2.7rem);letter-spacing:-.025em;margin-bottom:14px}
.story__a .big{font-size:clamp(2rem,1.3rem + 2.4vw,3.6rem)}
.story article p.mute{max-width:42ch}
.story__end{margin-top:clamp(72px,10vw,140px);align-items:end}
.endline{line-height:1.02}
.mm-wave ellipse{transform-box:fill-box;transform-origin:center;opacity:0}
@media (max-width:900px){.story__a,.story__b,.story__c{grid-row:auto;margin-top:0}}

/* =================== WHAT WE MAKE =================== */
.make__head{align-items:end;row-gap:20px;margin-bottom:clamp(40px,6vw,72px)}
.make__grid{row-gap:32px;align-items:stretch}
.make__big{background:var(--mist);border-radius:var(--r-l);padding:clamp(24px,3.2vw,52px);display:flex;flex-direction:column;gap:14px}
.make__mini{max-width:480px;margin-bottom:16px}
.make__price{font-weight:700;color:var(--blue-d);margin:0}
.make__t{margin:0}
.make__big .tlink{align-self:flex-start;margin-top:6px}
.make__list{align-self:stretch;display:flex;flex-direction:column;justify-content:space-between;border-top:1px solid var(--ink)}
.make__list li{flex:1;display:flex}
.mk{padding:22px 0;display:grid;gap:6px;align-content:start}
.mk__p{font-weight:700;font-size:.9375rem;color:var(--blue-d);margin:0}
.mk .h3{margin:0}.mk p.small{margin:2px 0 6px}
.make__care{margin-top:clamp(32px,4vw,56px);font-size:1.125rem}
@media (max-width:900px){.make__list{border-top:1px solid var(--ink)}}

/* =================== SAMPLE / TIDEMARK (lacivert bant) =================== */
.sample .g12{align-items:center;row-gap:48px}
.sample__pts{margin:26px 0 34px}
.sample__pts li{position:relative;padding:11px 0 11px 28px;border-bottom:1px solid rgba(255,255,255,.14);color:#E4EAFB}
.sample__pts li::before{content:"";position:absolute;left:2px;top:20px;width:9px;height:9px;border-radius:50%;background:var(--sky)}
.sample .mute{color:#B9C4E8}
.dev{position:relative;width:100%}
.dev__stage{position:relative;padding-bottom:7%;container-type:inline-size}
.dev__lap{width:86%;transform-origin:50% 100%}
.dev__lid{background:#0B1226;border-radius:2.4cqw 2.4cqw 0 0;padding:2cqw 2cqw 2.4cqw;box-shadow:inset 0 0 0 .15cqw rgba(255,255,255,.14),0 6cqw 12cqw -4cqw rgba(0,0,0,.6)}
.dev__scr{position:relative;aspect-ratio:1100/688;overflow:hidden;border-radius:.5cqw;background:#000}
.dev__strip{display:flex;flex-direction:column;will-change:transform}
.dev__strip img{width:100%;height:auto;aspect-ratio:1100/688;object-fit:cover;flex:none}
.dev__strip--ph img{aspect-ratio:390/844}
.dev__tag{position:absolute;left:1.4cqw;bottom:1.4cqw;font-size:max(.6875rem,1.5cqw);padding:.5cqw 1.3cqw}
.dev__base{height:1.9cqw;width:114%;margin-left:-7%;background:linear-gradient(#C9D3EE,#7F8DB4);border-radius:0 0 2cqw 2cqw}
.dev__ph{position:absolute;right:0;bottom:0;width:25%;border-radius:4cqw;padding:.9cqw;background:#0B1226;box-shadow:inset 0 0 0 .15cqw rgba(255,255,255,.18),0 4cqw 8cqw -2cqw rgba(0,0,0,.65)}
.dev__phscr{aspect-ratio:390/844;overflow:hidden;border-radius:3.2cqw;background:#000}
.dev__cap{margin-top:12px;color:#B9C4E8}
.dev__next{margin-top:14px}
@media (max-width:900px){.dev__lap{width:100%}.dev__ph{width:30%;bottom:-6%}}

/* =================== SEKTÖR DEĞİŞTİRİCİ (W6) =================== */
.sector__head{align-items:end;row-gap:20px;margin-bottom:clamp(32px,5vw,56px)}
.stabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:clamp(28px,4vw,48px)}
.stab{min-height:48px;padding:0 20px;border-radius:999px;border:1.5px solid rgba(22,33,62,.28);background:transparent;font-weight:600;font-size:.9375rem;transition:background .25s,color .25s,border-color .25s}
.stab:hover{border-color:var(--ink)}
.stab[aria-selected=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.sbody{row-gap:32px;align-items:center}
.smock{position:relative;aspect-ratio:1.5;container-type:inline-size;background:transparent;transition:--m-bg .45s,--m-ink .45s,--m-acc .45s}
.smock__br{position:absolute;left:0;top:0;width:80%;height:90%;background:var(--m-bg);color:var(--m-ink);border-radius:2.2cqw;box-shadow:0 0 0 1px var(--line),0 4cqw 8cqw -4cqw rgba(22,33,62,.45);overflow:hidden;padding:0 3cqw 3cqw;display:flex;flex-direction:column;gap:2.4cqw}
.smock__bar{display:flex;gap:.8cqw;padding:1.6cqw 0 0;margin:0 -1cqw}
.smock__bar i{width:1.1cqw;height:1.1cqw;border-radius:50%;background:var(--m-ink);opacity:.25}
.smock__nav{display:flex;justify-content:space-between;align-items:center;font-size:2cqw}
.smock__nav b{font-weight:700}
.smock__nav span{display:flex;gap:1.2cqw}.smock__nav i{width:4cqw;height:.8cqw;border-radius:.4cqw;background:var(--m-ink);opacity:.25}
.smock__hero{display:flex;flex-direction:column;align-items:flex-start;gap:2cqw;padding-top:1.5cqw}
.smock__hero h4,.smock__phin h4{margin:0;font-size:5.6cqw;line-height:1;letter-spacing:-.025em;font-weight:700;max-width:70%}
.smock__btn{display:inline-block;padding:1.2cqw 2.8cqw;border-radius:3cqw;background:var(--m-acc);color:var(--m-bg);font-weight:700;font-size:2cqw}
.smock__tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:1.8cqw;margin-top:auto}
.smock__tiles i,.smock__ptiles i{height:10cqw;border-radius:1.4cqw;display:grid;place-items:center;background:color-mix(in srgb,var(--m-acc) 18%,var(--m-bg));color:var(--m-acc)}
.smock__tiles i:nth-child(2){background:var(--m-acc);color:var(--m-bg)}
.smock__tiles i:nth-child(3){background:var(--m-ink);color:var(--m-bg)}
.smock .ic{width:46%;height:46%}
.smock__ph{position:absolute;right:0;bottom:0;width:30%;aspect-ratio:9/18;background:#10172B;border-radius:4cqw;padding:.9cqw;box-shadow:0 4cqw 8cqw -3cqw rgba(22,33,62,.55)}
.smock__phin{background:var(--m-bg);color:var(--m-ink);border-radius:3.2cqw;height:100%;padding:3.4cqw 2.4cqw 2.4cqw;display:flex;flex-direction:column;gap:1.8cqw;overflow:hidden}
.smock__phin b{font-size:1.9cqw}
.smock__phin h4{font-size:3.6cqw;max-width:100%}
.smock__phin .smock__btn{font-size:1.7cqw;padding:1cqw 2cqw}
.smock__call{display:none;font-weight:700;font-size:2cqw;text-align:center;padding:1.4cqw;border-radius:1.4cqw;background:var(--m-ink);color:var(--m-bg)}
.smock[data-call="1"] .smock__call{display:block}
.smock__ptiles{display:grid;grid-template-columns:1fr 1fr;gap:1cqw;margin-top:auto}.smock__ptiles i{height:6cqw}
.sinfo h3{margin-bottom:18px}
.sinfo .checks{margin-bottom:16px}
.sinfo__pages{font-size:.9375rem;margin-top:18px}.sinfo__pages .mute{display:block;font-size:.8125rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;margin-bottom:4px}
.sline{margin-top:28px;font-size:1rem}
html.mo .sinfo:not([hidden]){animation:sinfoin .5s var(--ease-out) both}
@keyframes sinfoin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (max-width:900px){
  .stabs{flex-wrap:nowrap;overflow-x:auto;margin-inline:calc(var(--pad)*-1);padding:2px var(--pad);scrollbar-width:none;scroll-snap-type:x proximity}
  .stabs::-webkit-scrollbar{display:none}
  .stab{flex:none;scroll-snap-align:start}
}

/* =================== 4 ADIM =================== */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gut);margin-top:clamp(40px,6vw,72px);position:relative;padding-top:0}
.steps::before,.steps::after{content:"";position:absolute;left:0;right:0;top:21px;height:2px;background:var(--line);border-radius:2px}
.steps::after{background:var(--blue);transform-origin:0 50%;transform:scaleX(var(--fill,1))}
.steps__i{position:relative;padding-top:68px}
.steps__n{position:absolute;top:0;left:0;width:44px;height:44px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;font-weight:700;z-index:1;transition:background .35s,color .35s,box-shadow .35s}
.steps__i--key .steps__n{box-shadow:0 0 0 6px rgba(47,91,234,.22)}
.steps h3{margin-bottom:10px}
html.mo:not(.mo-fail) .steps__i:not(.lit) .steps__n{background:#fff;color:var(--ink);box-shadow:0 0 0 2px var(--line)}
@media (max-width:900px){
  .steps{grid-template-columns:1fr;gap:36px}
  .steps::before,.steps::after{left:21px;right:auto;top:0;bottom:0;width:2px;height:auto;transform-origin:50% 0;transform:none}
  .steps::after{transform:scaleY(var(--fill,1))}
  .steps__i{padding:0 0 0 68px}
}

/* =================== PAKETLER (W5) =================== */
.pricing__head{align-items:end;row-gap:20px;margin-bottom:clamp(36px,5vw,64px)}
.packs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:2px solid var(--ink)}
.pack{padding:34px 34px 40px;display:flex;flex-direction:column;gap:22px;align-items:flex-start}
.pack:first-child{padding-left:0}.pack:last-child{padding-right:0}
.pack+.pack{border-left:1px solid var(--line)}
.pack--key{background:var(--mist);border-left:0!important;padding-inline:34px}
.pack--key+.pack{border-left:0}
.pack__top{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;min-height:40px}
.pack__top h3{font-size:1.6rem}
.pack__reg{display:flex;align-items:center;gap:10px;margin:0;color:var(--mute);font-weight:600}
.pack__lbl{font-size:.8125rem;letter-spacing:.08em;text-transform:uppercase}
.strike{position:relative;display:inline-block;padding:0 4px}
.strike s{text-decoration:none;font-size:1.3rem;font-weight:600}
.strike svg{position:absolute;left:-8%;top:50%;width:116%;height:.9em;transform:translateY(-50%);overflow:visible}
.strike__p{stroke-dasharray:1;stroke-dashoffset:0}
.pack__now{margin:0;line-height:1}
.pack__now b{font-size:clamp(3.2rem,2.4rem + 2.6vw,4.8rem);letter-spacing:-.04em;font-weight:700}
.packs__d{margin:0;max-width:34ch;flex:1}
.packs__f{font-weight:600;margin:0}
.packs__list{align-self:stretch;flex:1}
.packs--full .pack .btn{margin-top:auto}
@media (max-width:900px){
  .packs{grid-template-columns:1fr}
  .pack,.pack:first-child,.pack:last-child{padding:30px 0}.pack+.pack{border-left:0;border-top:1px solid var(--line)}
  .pack--key{padding-inline:20px;margin-inline:-20px;border-top:0!important}
}

/* =================== SAHİPLİK / DÜRÜST NOT =================== */
.own__list{margin-top:36px}
.own__box{align-self:start;position:sticky;top:calc(var(--hdr) + 28px)}
.honest .g12{row-gap:32px;align-items:start}
.honest__list li>a,.honest__list li>span{display:block;padding:22px 0;font-size:1.125rem;text-decoration:none;line-height:1.4}
.honest__list li>a:hover{color:var(--blue-d)}
.faqp .g12{row-gap:32px;align-items:start}
@media (max-width:900px){.own__box{position:static}}

/* =================== KAPANIŞ (tabela) =================== */
.final{background:var(--mist)}
.final .g12{align-items:center;row-gap:40px}
.osign{display:flex;flex-direction:column;align-items:flex-start;margin:0 0 28px 40px;transform-origin:20px 0}
.osign__str{width:2px;height:34px;background:rgba(22,33,62,.4);margin-left:48px}
.osign__b{position:relative;width:132px;height:56px}
.osign__c,.osign__o{position:absolute;inset:0;display:grid;place-items:center;border-radius:10px;font-weight:700;font-size:1.0625rem;letter-spacing:.16em;text-transform:uppercase;backface-visibility:hidden}
.osign__c{background:var(--paper);color:var(--ink);transform:scaleX(0);box-shadow:0 0 0 1px var(--line)}
.osign__o{background:var(--blue);color:#fff;box-shadow:0 0 28px rgba(47,91,234,.45)}
.final__form{background:#fff;border-radius:var(--r-l);padding:clamp(24px,3.4vw,44px);box-shadow:0 0 0 1px var(--line),0 40px 80px -48px rgba(22,33,62,.5)}
.final__form .btn{width:100%}
.final__form .fn{margin:0}
.final .lead{margin-top:20px}

/* hero sahnesi açılış perdesi (yalnız hareket modu; CONFIG: hero.introDur) */
html.mo .vs{animation:vs-in var(--intro-dur,1.3s) var(--ease-out) .1s both}
@keyframes vs-in{from{clip-path:inset(100% 0 0 0);opacity:.2}to{clip-path:inset(-40% -40% -40% -40%);opacity:1}}

/* kısa ekranlarda (laptop) hero metni sığsın; sonra gelir, genel kuralı ezer */
@media (min-width:1024px) and (max-height:820px){.hero__h{font-size:clamp(2.2rem,min(1.4rem + 3.7vw,7.2vh),4.9rem)}.hero .lead{font-size:clamp(.95rem,2.35vh,1.2rem)}.hero .btn{min-height:46px}.hero .eyebrow{font-size:.72rem;margin-bottom:12px}.trust3{font-size:.875rem;margin:min(20px,2.4vh) 0 10px}.hero .fn{font-size:.8125rem;margin:0}}