/* Kallavi Studios - ana stil */

:root{
  /* marka: 1 ana + 1 notr + 1 vurgu */
  --bordo:#6C151E; --deep:#4A0D14; --ink:#140C0E; --krem:#F7F3E7;
  --altin:#C59F54; --gri:#6B5F56; --line:#DED3BE;
  --disp:'Archivo',system-ui,sans-serif; --sans:'Inter',system-ui,sans-serif;
  /* 8px tabanli bosluk sistemi */
  --s1:8px; --s2:16px; --s3:24px; --s4:32px; --s5:48px; --s6:64px; --s7:96px;
  /* golge ve kenarlik marka renginden turetildi */
  --sh-sm:0 2px 8px rgba(108,21,30,.08);
  --sh-md:0 8px 32px rgba(108,21,30,.14);
  --sh-lg:0 40px 70px -30px rgba(20,12,14,.6);
}

/* ---- arka plan: projeksiyon ---- */
.bg{position:fixed;inset:0;z-index:-2;pointer-events:none;overflow:hidden;background:var(--krem)}
.bg .lamp{position:absolute;width:76vmax;height:76vmax;border-radius:50%;filter:blur(60px);opacity:.5;
   background:radial-gradient(circle,rgba(197,159,84,.30),transparent 60%);animation:drift1 34s ease-in-out infinite alternate}
.bg .lamp2{position:absolute;right:-18vmax;bottom:-22vmax;width:64vmax;height:64vmax;border-radius:50%;filter:blur(70px);opacity:.38;
   background:radial-gradient(circle,rgba(108,21,30,.30),transparent 62%);animation:drift2 44s ease-in-out infinite alternate}
@keyframes drift1{
  0%{transform:translate3d(-24vmax,-30vmax,0) scale(1)}
  100%{transform:translate3d(6vmax,-14vmax,0) scale(1.16)}}
@keyframes drift2{
  0%{transform:translate3d(0,0,0) scale(1)}
  100%{transform:translate3d(-14vmax,-8vmax,0) scale(1.12)}}
/* film rayi: dikey perforasyon cizgileri, cok yavas akar */
.bg .rails{position:absolute;inset:-10% 0;opacity:.055;
   background:repeating-linear-gradient(to bottom,var(--ink) 0 3px,transparent 3px 22px),
              repeating-linear-gradient(to right,transparent 0 calc(50% - 1px),var(--ink) calc(50% - 1px) calc(50% + 1px),transparent calc(50% + 1px) 100%);
   background-size:6px 22px,100% 100%;animation:rails 9s linear infinite}
@keyframes rails{from{background-position:0 0,0 0}to{background-position:0 22px,0 0}}
/* isik sizmasi: tarama cizgisi */
.bg .leak{position:absolute;left:0;right:0;height:34vh;
   background:linear-gradient(to bottom,transparent,rgba(197,159,84,.12),transparent);
   animation:leak 17s ease-in-out infinite}
@keyframes leak{0%{top:-40vh}55%,100%{top:120vh}}

.hero,.dark,.ink,section[style*="FBF8EF"],.final,footer{position:relative;z-index:1}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--krem);color:var(--ink);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
.wrap{max-width:1240px;margin:0 auto;padding:0 var(--s3)}
h1,h2,h3,.big{font-family:var(--disp);font-weight:900;line-height:.94;letter-spacing:-.035em}
h1{font-size:clamp(3rem,7vw,6rem)}
h2{font-size:clamp(2.2rem,5vw,3.9rem)}
h3{font-size:1.34rem;font-weight:800;letter-spacing:-.025em}
a{color:inherit}
section{padding:var(--s7) 0}

.label{display:flex;align-items:center;gap:14px;font-size:.74rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--altin);margin-bottom:var(--s3)}
.label::before{content:"";width:38px;height:2px;background:var(--altin)}
.lede{font-size:1.24rem;line-height:1.5;font-weight:500;max-width:26ch}
.sub{font-size:1.02rem;color:var(--gri);max-width:58ch;margin-top:16px}

.dark{background:var(--bordo);color:var(--krem)}
.dark .sub{color:#D6C6B4}
.ink{background:var(--ink);color:var(--krem)}
.ink .sub{color:#A99C92}

.btn{display:inline-block;padding:var(--s2) var(--s5);font-weight:800;font-size:1rem;text-decoration:none;border:2px solid transparent;transition:.16s;letter-spacing:-.015em;border-radius:999px}
.btn-gold{background:var(--altin);color:var(--ink)}
.btn-gold:hover{background:#D9B368}
.btn-dark{background:var(--bordo);color:var(--krem)}
.btn-dark:hover{background:var(--deep)}
.btn-line{border-color:currentColor}
.btn-line:hover{background:rgba(247,243,231,.12)}
.btn-sm{padding:10px var(--s3);font-size:.92rem}

/* announcement */
.annc{background:var(--altin);color:var(--ink);text-align:center;padding:11px 20px;font-size:.92rem;font-weight:800;letter-spacing:-.02em}
.annc a{text-decoration:underline;text-underline-offset:3px}

/* scroll progress */
.prog{position:fixed;top:0;left:0;height:3px;width:0;background:var(--altin);z-index:100;transition:width .1s linear}

/* reveal */
[data-rv]{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.3,1),transform .7s cubic-bezier(.2,.7,.3,1)}
[data-rv].in{opacity:1;transform:none}
[data-rv][data-d="1"]{transition-delay:.09s}
[data-rv][data-d="2"]{transition-delay:.18s}
[data-rv][data-d="3"]{transition-delay:.27s}
[data-rv][data-d="4"]{transition-delay:.36s}
[data-rv][data-d="5"]{transition-delay:.45s}

/* hero line mask */
.hero h1 .ln{display:block;overflow:hidden}
.hero h1 .ln i{display:block;font-style:normal;transform:translateY(104%);transition:transform .9s cubic-bezier(.2,.75,.25,1)}
.hero.ready h1 .ln i{transform:none}
.hero.ready h1 .ln:nth-child(2) i{transition-delay:.1s}
.hero.ready h1 .ln:nth-child(3) i{transition-delay:.2s}

/* marquee */
.mq{overflow:hidden;border-top:1px solid rgba(247,243,231,.2);border-bottom:1px solid rgba(247,243,231,.2);padding:16px 0;margin-top:14px}
.mq-in{display:flex;gap:0;width:max-content;animation:mqs 34s linear infinite}
.mq:hover .mq-in{animation-play-state:paused}
.mq span{font-family:var(--disp);font-size:1.2rem;font-weight:800;color:#D8C7B4;padding:0 26px;white-space:nowrap;letter-spacing:-.03em}
.mq span::after{content:"·";color:var(--altin);margin-left:26px}
@keyframes mqs{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* sticky cta */
.scta{position:fixed;left:0;right:0;bottom:0;z-index:90;background:rgba(20,12,14,.97);backdrop-filter:blur(12px);color:var(--krem);
      transform:translateY(110%);transition:transform .38s cubic-bezier(.2,.7,.3,1);border-top:2px solid var(--altin)}
.scta.on{transform:none}
.scta .wrap{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:13px;padding-bottom:13px}
.scta .t{font-size:.95rem;line-height:1.35}
.scta .t b{display:block;font-family:var(--disp);font-size:1.18rem;font-weight:800;letter-spacing:-.03em}
.scta .t s{color:#8E8078;margin-right:8px;font-size:.9rem}
.scta .t em{font-style:normal;color:var(--altin);font-weight:700}
@media(max-width:620px){.scta .t b{font-size:1rem}.scta .btn{padding:13px 20px;font-size:.9rem;white-space:nowrap}}

/* ---- sahne dizisi: normal akis, kilitlenme yok ---- */
.story{background:var(--ink);padding:0;display:block}
.scene{position:relative;height:100vh;min-height:520px;overflow:hidden;background:var(--ink)}
.scene video{position:absolute;top:50%;left:50%;width:100%;height:112%;
  transform:translate3d(-50%,calc(-50% + var(--pz,0px)),0);object-fit:cover;display:block;
  will-change:transform;backface-visibility:hidden}
/* kenar gecisleri: sahneler birbirine karisir, sert dikis olmaz */
.scene::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to bottom,rgba(20,12,14,.85) 0%,transparent 18%,transparent 62%,rgba(20,12,14,.9) 100%)}
.scene::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to right,rgba(20,12,14,.8) 0%,rgba(20,12,14,.25) 52%,transparent 100%)}
.scene .cap{position:absolute;z-index:2;left:0;right:0;bottom:var(--s7);
  opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.3,1)}
.scene.live .cap{opacity:1;transform:none}
.scene .cap .inner{max-width:1240px;margin:0 auto;padding:0 var(--s3)}
.scene .n{display:block;font-family:var(--disp);font-size:.8rem;font-weight:900;color:var(--altin);
  letter-spacing:.24em;margin-bottom:var(--s2)}
.scene h2{color:var(--krem);max-width:13ch;margin-bottom:var(--s2)}
.scene p{color:#CBBAA9;max-width:42ch;font-size:1.06rem}
.scene .idx{position:absolute;z-index:2;right:var(--s5);bottom:var(--s7);
  font-family:var(--disp);font-size:clamp(3rem,7vw,6rem);font-weight:800;color:rgba(247,243,231,.14);line-height:1}
@media(max-width:760px){
  .scene{height:88vh}
  .scene .cap{bottom:var(--s6)}
  .scene .idx{right:var(--s3);bottom:var(--s6)}
}
@media (prefers-reduced-motion: reduce){
  .scene video{transform:translate3d(-50%,-50%,0)}
  .scene .cap{opacity:1;transform:none}
}

/* ---- 3D sahne ---- */
.stage{perspective:1400px;perspective-origin:50% 45%;margin:var(--s6) 0 var(--s1);height:340px;position:relative}
@media(max-width:700px){.stage{height:250px}}
.ring{position:absolute;inset:0;margin:auto;width:230px;height:74px;transform-style:preserve-3d;animation:spin 26s linear infinite}
.stage:hover .ring{animation-play-state:paused}
@keyframes spin{from{transform:rotateY(0) rotateX(-9deg)}to{transform:rotateY(360deg) rotateX(-9deg)}}
.ri{position:absolute;inset:0;display:grid;place-items:center;border:1px solid var(--altin);
    background:var(--deep);
    font-family:var(--disp);font-weight:800;font-size:1.02rem;color:var(--krem);letter-spacing:-.03em;
    box-shadow:0 var(--s1) var(--s4) rgba(20,12,14,.45);padding:0 var(--s2);text-align:center}
.ri::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 40%,rgba(197,159,84,.28),transparent 62%)}
.stage .glow{position:absolute;inset:0;margin:auto;width:400px;height:400px;border-radius:50%;
    background:radial-gradient(circle,rgba(197,159,84,.24),transparent 62%);filter:blur(28px);pointer-events:none}
.stage .floor{position:absolute;left:50%;bottom:34px;transform:translateX(-50%) rotateX(78deg);
    width:300px;height:300px;border-radius:50%;background:radial-gradient(ellipse,rgba(197,159,84,.16),transparent 66%);filter:blur(16px)}

/* tilt kartlar */
.w{transform-style:preserve-3d;will-change:transform}
.tiltwrap{perspective:1000px}
.w .sheen{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s;
    background:radial-gradient(600px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.18),transparent 42%)}
.w:hover .sheen{opacity:1}

/* film grain */
.grain{position:fixed;inset:0;z-index:95;pointer-events:none;opacity:.055;mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E")}

/* hero derinlik */
.hero{position:relative}
.hero .beam{position:absolute;top:-14%;right:-8%;width:62vw;height:62vw;max-width:820px;max-height:820px;border-radius:50%;
    background:radial-gradient(circle,rgba(197,159,84,.2),transparent 58%);filter:blur(10px);pointer-events:none;
    transform:translate3d(var(--px,0),var(--py,0),0);transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.hero-mark{transform:translate3d(calc(var(--px,0px)*-.35),calc(var(--py,0px)*-.35),0);transition:transform .5s cubic-bezier(.2,.7,.3,1)}

/* kinetik baslik */
.hero h1 .ln i{filter:blur(9px);transition:transform .95s cubic-bezier(.2,.75,.25,1),filter .95s ease}
.hero.ready h1 .ln i{filter:blur(0)}

/* prompt kutusu 3D */
.pbox{transform-origin:50% 0;transition:transform .8s cubic-bezier(.2,.7,.3,1),opacity .7s ease;
      box-shadow:var(--sh-lg)}
.pbox[data-rv]{transform:perspective(1300px) rotateX(9deg) translateY(26px)}
.pbox[data-rv].in{transform:perspective(1300px) rotateX(0) translateY(0)}

/* isik supurmesi */
.sweep{position:relative;overflow:hidden}
.sweep::before{content:"";position:absolute;top:0;left:-40%;width:40%;height:100%;
    background:linear-gradient(100deg,transparent,rgba(197,159,84,.12),transparent);transform:skewX(-18deg);animation:sw 7s ease-in-out infinite}
@keyframes sw{0%,72%{left:-40%}100%{left:130%}}

@media (prefers-reduced-motion: reduce){
  .ring{animation:none}
  .sweep::before{animation:none;display:none}
  .pbox{transform:none}
  .hero h1 .ln i{filter:none}
  .grain{display:none}
}

/* micro interactions */
.btn{position:relative;overflow:hidden}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.28),transparent 70%);transform:translateX(-120%)}
.btn:hover::after{transform:translateX(120%);transition:transform .65s}
.btn-gold:hover,.btn-dark:hover{transform:translateY(-2px)}
.btn{transition:.16s,transform .16s}
.plan{transition:transform .3s cubic-bezier(.2,.7,.3,1)}
.plan:hover{transform:translateY(-6px)}
.tl{transition:background .3s}
.tl:hover{background:var(--deep)}
.w figcaption{transform:translateY(14px);opacity:.94;transition:transform .35s,opacity .35s}
.w:hover figcaption{transform:none;opacity:1}
.stats b{transition:color .3s}

@media (prefers-reduced-motion: reduce){
  [data-rv]{opacity:1;transform:none;transition:none}
  .hero h1 .ln i{transform:none;transition:none}
  .mq-in{animation:none}
  .btn:hover{transform:none}
  .plan:hover{transform:none}
}

/* header */
header{position:sticky;top:0;z-index:60;background:rgba(20,12,14,.95);backdrop-filter:blur(12px);color:var(--krem)}
.nav{display:flex;align-items:center;justify-content:space-between;height:var(--s6)}
.brand{display:flex;align-items:center;gap:12px;font-family:var(--disp);font-weight:900;font-size:1.12rem;text-decoration:none;letter-spacing:-.035em}
.brand img{height:30px;width:auto;display:block}
.hero-mark{height:78px;width:auto;display:block;margin-bottom:26px;opacity:.96}
@media(max-width:700px){.hero-mark{height:58px}}
.nav a.lnk{color:#CFC0B3;text-decoration:none;font-size:.94rem;font-weight:500;margin-left:30px}
.nav a.lnk:hover{color:var(--altin)}
@media(max-width:940px){.nav .lnk{display:none}}

/* hero */
.hero{background:var(--bordo);color:var(--krem);padding:var(--s7) 0 0;overflow:hidden}
.hero h1{max-width:15ch}
.hero .kick{font-size:1.2rem;color:#E8DACA;max-width:50ch;margin:var(--s3) 0 var(--s4);font-weight:500}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.stats{display:flex;gap:0;margin-top:var(--s6);border-top:2px solid rgba(247,243,231,.22)}
.stats div{flex:1;padding:var(--s3) 0 var(--s4);border-right:1px solid rgba(247,243,231,.16)}
.stats div:last-child{border-right:0}
.stats b{display:block;font-family:var(--disp);font-size:clamp(2.1rem,3.6vw,3.1rem);font-weight:900;letter-spacing:-.04em;color:var(--altin);line-height:1}
.stats span{font-size:.82rem;color:#C9B7A6;letter-spacing:.06em;text-transform:uppercase;font-weight:600}

/* work */
.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:var(--s5);background:var(--line)}
@media(max-width:900px){.work-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.work-grid{grid-template-columns:1fr}}
.w{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--ink);display:block}
.w video,.w img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.w:hover video,.w:hover img{transform:scale(1.04)}
.w figcaption{position:absolute;left:0;right:0;bottom:0;padding:22px 20px 18px;background:linear-gradient(transparent,rgba(20,12,14,.9));color:var(--krem)}
.w figcaption b{display:block;font-family:var(--disp);font-size:1.3rem;font-weight:800;letter-spacing:-.03em}
.w figcaption span{font-size:.78rem;color:#CBB9A8;letter-spacing:.08em;text-transform:uppercase;font-weight:600}
.note{font-size:.9rem;color:var(--gri);margin-top:20px}

/* problem: numbered rows */
.rows{margin-top:var(--s5);border-top:1px solid rgba(247,243,231,.26)}
.row{display:grid;grid-template-columns:90px 1fr 1.3fr;gap:var(--s4);padding:var(--s4) 0;border-bottom:1px solid rgba(247,243,231,.26);align-items:start}
@media(max-width:800px){.row{grid-template-columns:1fr;gap:10px}}
.row .n{font-family:var(--disp);font-size:2.6rem;font-weight:900;color:var(--altin);line-height:.9;letter-spacing:-.04em}
.row h3{color:var(--krem);font-size:1.5rem}
.row p{color:#D9C9B8;font-size:1rem}

/* split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:var(--s6);align-items:start}
@media(max-width:900px){.split{grid-template-columns:1fr;gap:40px}}

/* accordion */
.acc{border-top:2px solid var(--ink)}
.acc details{border-bottom:1px solid var(--line)}
.acc summary{padding:24px 0;cursor:pointer;font-weight:700;font-size:1.14rem;list-style:none;display:flex;justify-content:space-between;gap:20px;align-items:center;letter-spacing:-.015em}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";font-size:1.6rem;color:var(--altin);font-weight:500;flex-shrink:0;line-height:1}
.acc details[open] summary::after{content:"–"}
.acc .cnt{font-size:.85rem;color:var(--gri);font-weight:500;margin-left:auto;margin-right:16px;white-space:nowrap}
.acc .body{padding:0 0 26px}
.acc .body li{list-style:none;padding:7px 0 7px 22px;position:relative;color:#39302C;font-size:1rem;border-left:2px solid var(--line);margin-left:2px}
.acc .body li b{font-weight:700;color:var(--ink)}

/* tools */
.tools{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;margin-top:var(--s5);background:rgba(247,243,231,.2)}
@media(max-width:900px){.tools{grid-template-columns:repeat(2,1fr)}}
.tl{background:var(--bordo);padding:var(--s3)}
.tl b{display:block;font-family:var(--disp);font-size:1.3rem;font-weight:800;margin-bottom:8px;letter-spacing:-.03em}
.tl span{font-size:.92rem;color:#D3C2B1;line-height:1.5}

/* prompt */
.pbox{background:var(--ink);color:#EADFCF;padding:var(--s4);font-family:ui-monospace,Menlo,monospace;font-size:.86rem;line-height:1.8;overflow-x:auto;border-left:4px solid var(--altin)}
.pbox .k{color:var(--altin);font-weight:700}
.pbox .n{color:#E08585}
.chips{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:var(--line);margin-top:2px}
@media(max-width:700px){.chips{grid-template-columns:1fr}}
.chip{background:var(--krem);padding:24px}
.chip b{display:block;font-family:var(--disp);font-size:1.18rem;font-weight:800;margin-bottom:5px;letter-spacing:-.025em}
.chip span{font-size:.95rem;color:var(--gri)}

/* pricing */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:var(--s5);background:var(--ink)}
@media(max-width:940px){.plans{grid-template-columns:1fr}}
.plan{background:var(--krem);padding:var(--s5) var(--s4);display:flex;flex-direction:column}
.plan.feat{background:var(--ink);color:var(--krem)}
.plan.feat .meta,.plan.feat li{color:#C6B7AB}
.plan .tag{font-size:.72rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--altin);margin-bottom:14px}
.plan h3{font-size:1.9rem;font-weight:800;margin-bottom:6px}
.plan .meta{font-size:.9rem;color:var(--gri);margin-bottom:26px}
.pr{font-family:var(--disp);font-size:3.4rem;font-weight:900;line-height:1;letter-spacing:-.045em}
.plan.feat .pr{color:var(--altin)}
.pr small{font-size:1.2rem;font-weight:600}
.was{display:inline-block;font-family:var(--sans);font-size:1rem;font-weight:500;text-decoration:line-through;color:var(--gri);margin-left:10px}
.plan ul{list-style:none;margin:28px 0 32px;flex:1}
.plan li{padding:9px 0 9px 26px;position:relative;font-size:1rem;border-top:1px solid var(--line)}
.plan.feat li{border-color:#2E2023}
.plan li:first-child{border-top:0}
.plan li::before{content:"";position:absolute;left:0;top:17px;width:12px;height:6px;border-left:2.5px solid var(--altin);border-bottom:2.5px solid var(--altin);transform:rotate(-45deg)}
.plan .btn{text-align:center}

/* form */
.formwrap{display:grid;grid-template-columns:1fr 1.1fr;gap:70px;align-items:start;margin-top:46px}
@media(max-width:900px){.formwrap{grid-template-columns:1fr;gap:40px}}
.steps{list-style:none}
.steps li{display:grid;grid-template-columns:44px 1fr;gap:18px;padding:18px 0;border-top:1px solid rgba(247,243,231,.2)}
.steps li:last-child{border-bottom:1px solid rgba(247,243,231,.2)}
.steps .sn{font-family:var(--disp);font-size:1.6rem;font-weight:900;color:var(--altin);line-height:1.1;letter-spacing:-.04em}
.steps b{display:block;font-size:1.05rem;font-weight:700;margin-bottom:3px;color:var(--krem)}
.steps span{font-size:.96rem;color:#B5A79D}
.fbox{background:var(--krem);color:var(--ink);padding:var(--s5) var(--s4)}
.fld{margin-bottom:20px}
.fld label{display:block;font-size:.8rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gri);margin-bottom:8px}
.fld input,.fld select{width:100%;padding:15px 16px;border:2px solid var(--line);background:#fff;font-family:var(--sans);font-size:1.02rem;color:var(--ink);border-radius:0}
.fld input:focus,.fld select:focus{outline:none;border-color:var(--bordo)}
.consent{display:flex;gap:12px;align-items:flex-start;margin-bottom:16px;font-size:.9rem;color:var(--gri);line-height:1.5}
.consent input{width:20px;height:20px;flex-shrink:0;margin-top:2px;accent-color:var(--bordo)}
.consent a{color:var(--bordo);font-weight:600}
.fbox .btn{width:100%;text-align:center;border:0;cursor:pointer;font-family:var(--sans)}
.okbox{display:none;background:var(--krem);color:var(--ink);padding:52px 38px;text-align:center}
.okbox.on{display:block}
.okbox .tick{width:58px;height:58px;border:3px solid var(--altin);border-radius:50%;display:grid;place-items:center;margin:0 auto 20px;font-size:1.7rem;color:var(--altin)}
.okbox h3{font-size:1.7rem;margin-bottom:10px}
.okbox p{color:var(--gri);max-width:38ch;margin:0 auto}
.hp{position:absolute;left:-9999px}

/* final */
.final{background:var(--bordo);text-align:center;padding:var(--s7) 0}
.final h2{color:var(--krem);max-width:18ch;margin:0 auto 22px}
.final p{color:#E3D3C2;max-width:50ch;margin:0 auto 36px;font-size:1.1rem}

footer{background:var(--ink);color:#8E8078;padding:var(--s6) 0 var(--s5);font-size:.92rem}
footer a{color:#C4B4A7;text-decoration:none;display:block;padding:5px 0}
footer a:hover{color:var(--altin)}
.fgrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;padding-bottom:34px;border-bottom:1px solid #2A1E21;margin-bottom:26px}
@media(max-width:760px){.fgrid{grid-template-columns:1fr}}
.fgrid h4{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--altin);margin-bottom:12px;font-weight:800}