/* LAWAVA — site styles. Brand tokens inherited from the LUQMEDIA system. */
:root{
  --bg:#F8F7F3; --card:#FFFFFF; --surface:#EFEDE6; --surface-2:#E7E5DE; --border:#E2DFDA;
  --ink:#1A1917; --muted:#4A4840; --faint:#7A7870;
  --gold:#C9A84C; --gold-l:#D9BB6E; --gold-dim:rgba(201,168,76,.10);
  --dark:#0D0D0D; --dark-s:#141414; --dark-text:#F0EDE6;
  --dark-muted:rgba(240,237,230,.55); --dark-border:rgba(255,255,255,.08);
  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --sans:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --max:1140px; --gutter:24px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--muted);
  font-family:var(--sans); font-size:16px; line-height:1.8;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img,svg{max-width:100%}
.wrap{max-width:var(--max); margin:0 auto; padding-inline:var(--gutter)}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold); outline-offset:3px; border-radius:2px}

/* ---------- type ---------- */
h1,h2,h3{color:var(--ink); margin:0; text-wrap:balance}
h1{font-family:var(--serif); font-weight:300; font-size:clamp(38px,5.4vw,60px); line-height:1.12; letter-spacing:.005em}
h2{font-family:var(--serif); font-weight:300; font-size:clamp(30px,3.9vw,42px); line-height:1.22}
h3{font-family:var(--sans); font-weight:600; font-size:17px; line-height:1.7}
p{margin:0}
.kicker{font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--gold)}
.eyebrow{font-size:11px; font-weight:700; letter-spacing:.26em; text-transform:uppercase; color:var(--faint)}
.lead{font-size:clamp(17px,2vw,19px); line-height:1.65; color:var(--muted)}
.small{font-size:14px; line-height:1.75; color:var(--faint)}
.tiny{font-size:12.5px; line-height:1.7; color:var(--faint)}
.serif-q{font-family:var(--serif); font-weight:300; font-size:clamp(22px,2.6vw,28px); line-height:1.4; color:var(--ink)}

/* ---------- nav ---------- */
.nav{
  position:sticky; top:0; z-index:60;
  background:rgba(248,247,243,.92); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid var(--border);
}
.nav-in{display:flex; align-items:center; gap:22px; height:68px}
.nav a.mark{display:flex; align-items:center; text-decoration:none; flex-shrink:0}
.nav .mark svg{height:24px; width:auto; display:block}
.nav-links{margin-left:auto; display:flex; align-items:center; gap:26px}
.nav-links a{font-size:13px; text-decoration:none; color:var(--muted)}
.nav-links a:hover{color:var(--ink)}
.btn{
  display:inline-block; background:var(--gold); color:var(--dark);
  border:0; border-radius:6px; padding:10px 20px;
  font-family:var(--sans); font-weight:700; font-size:13px; letter-spacing:.02em;
  text-decoration:none; white-space:nowrap; cursor:pointer;
}
.btn:hover{background:var(--gold-l)}
.btn-lg{border-radius:8px; padding:16px 34px; font-size:15px; font-weight:600}
.btn-ghost{background:transparent; color:var(--ink); border:1px solid var(--border)}
.btn-ghost:hover{background:var(--surface)}
.btn-block{display:block; width:100%; text-align:center}

/* ---------- sections ---------- */
section{padding-block:clamp(64px,9vw,104px)}
.hero{padding-block:clamp(72px,11vw,120px) clamp(48px,7vw,74px)}
.hero-in{max-width:820px; display:flex; flex-direction:column; gap:26px; align-items:flex-start}
.hero-actions{display:flex; flex-wrap:wrap; gap:14px; align-items:center; margin-top:4px}
.textlink{font-size:14px; font-weight:600; color:var(--gold); text-decoration:none; border-bottom:2px solid rgba(201,168,76,.3); padding-bottom:2px}
.textlink:hover{border-bottom-color:var(--gold)}
.sec-head{max-width:720px; display:flex; flex-direction:column; gap:18px; margin-bottom:52px}

/* rule strip */
.strip{border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding-block:30px; background:var(--surface)}
.strip-in{display:flex; flex-wrap:wrap; gap:18px 48px; align-items:baseline}
.strip .eyebrow{flex-shrink:0}
.strip p{font-size:15px; color:var(--muted); max-width:66ch}

/* ---------- numbered rows ---------- */
.rows{border-top:1px solid var(--border)}
.row{
  display:grid; grid-template-columns:64px 1fr 1.25fr; gap:28px;
  padding-block:34px; border-bottom:1px solid var(--border); align-items:start;
}
.row .n{font-family:var(--serif); font-weight:300; font-size:30px; color:var(--gold); line-height:1}
.row p{font-size:15.5px}

/* ---------- two column compare ---------- */
.compare{display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--border); background:var(--card)}
.compare > div{padding:38px 34px; display:flex; flex-direction:column; gap:16px}
.compare > div + div{border-left:1px solid var(--border)}
.compare .tag{font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase}
.compare .a .tag{color:var(--faint)}
.compare .b .tag{color:var(--gold)}
.compare ul{margin:0; padding-left:18px; display:flex; flex-direction:column; gap:10px}
.compare li{font-size:15px; line-height:1.7}

/* ---------- timeline ---------- */
.timeline{border-top:1px solid var(--border)}
.tl{display:grid; grid-template-columns:120px 1fr; gap:28px; padding-block:26px; border-bottom:1px solid var(--border); align-items:baseline}
.tl .t{font-family:var(--sans); font-weight:700; font-size:13px; letter-spacing:.08em; color:var(--ink)}
.tl p{font-size:15.5px}
.tl.hit .t{color:var(--gold)}

/* ---------- filters grid ---------- */
.filters{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border)}
.filter{background:var(--card); padding:30px 26px; display:flex; flex-direction:column; gap:10px}
.filter .n{font-size:11px; font-weight:700; letter-spacing:.18em; color:var(--gold)}
.filter p{font-size:14.5px; line-height:1.7}

/* ---------- bilingual proof ---------- */
.bili{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--border); border:1px solid var(--border)}
.bili > div{background:var(--card); padding:34px 30px; display:flex; flex-direction:column; gap:14px}
.bili .lang{font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--faint)}
.bili .msg{font-size:15px; line-height:1.75; color:var(--ink)}
.bili .stamp{font-size:12px; color:var(--gold); font-weight:600; letter-spacing:.04em}

/* ---------- fit / not fit ---------- */
.fit{display:grid; grid-template-columns:1fr 1fr; gap:44px}
.fit ul{margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:14px}
.fit li{font-size:15.5px; line-height:1.7; padding-left:26px; position:relative}
.fit li::before{position:absolute; left:0; top:0; font-weight:700; font-size:14px}
.fit .yes li::before{content:"\2713"; color:var(--gold)}
.fit .no li::before{content:"\2715"; color:var(--faint)}

/* ---------- founder ---------- */
.founder{display:grid; grid-template-columns:1fr 1.4fr; gap:56px; align-items:start}
.creds{border-top:1px solid var(--border)}
.cred{display:grid; grid-template-columns:150px 1fr; gap:22px; padding-block:18px; border-bottom:1px solid var(--border)}
.cred .k{font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--faint)}
.cred .v{font-size:15px; color:var(--muted)}

/* ---------- dark blocks ---------- */
.dark{background:var(--dark); color:var(--dark-muted)}
.dark h1,.dark h2,.dark h3{color:var(--dark-text)}
.dark .lead{color:var(--dark-muted)}
.dark .eyebrow{color:rgba(240,237,230,.4)}
.dark a.textlink{color:var(--gold-l)}
.cta-in{max-width:760px; display:flex; flex-direction:column; gap:24px; align-items:flex-start}

/* ---------- footer ---------- */
.foot{background:var(--dark); color:var(--dark-muted); padding-block:56px 40px}
.foot-top{display:flex; flex-wrap:wrap; gap:36px; justify-content:space-between; align-items:flex-start}
.foot .mark svg{height:26px; width:auto; display:block}
.foot-links{display:flex; flex-wrap:wrap; gap:26px}
.foot a{font-size:13.5px; color:var(--dark-muted); text-decoration:none}
.foot a:hover{color:var(--dark-text)}
.foot-bot{margin-top:40px; padding-top:22px; border-top:1px solid var(--dark-border); display:flex; flex-wrap:wrap; gap:14px 28px; justify-content:space-between}
.foot-bot p{font-size:12.5px; color:rgba(240,237,230,.38)}

/* ---------- form ---------- */
.formwrap{background:var(--card); border:1px solid var(--border); padding:clamp(28px,4vw,44px)}
.field{display:flex; flex-direction:column; gap:7px; margin-bottom:18px}
.field label{font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--faint)}
.field input,.field select,.field textarea{
  font-family:var(--sans); font-size:15px; color:var(--ink); background:var(--bg);
  border:1px solid var(--border); border-radius:6px; padding:13px 14px; width:100%;
}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--gold)}
.field textarea{min-height:104px; resize:vertical}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:0 18px}
.consent{display:flex; gap:12px; align-items:flex-start; margin:22px 0 8px; padding:18px; background:var(--surface); border:1px solid var(--border); border-radius:6px}
.consent input{width:18px; height:18px; margin-top:3px; flex-shrink:0; accent-color:var(--gold)}
.consent span{font-size:12.5px; line-height:1.65; color:var(--muted)}
.formnote{font-size:12px; color:var(--faint); margin-top:14px; line-height:1.65}
.formstatus{margin-top:14px; font-size:14px; font-weight:600; display:none}
.formstatus.ok{display:block; color:#3F6B3A}
.formstatus.err{display:block; color:#9A3B2E}

/* ---------- offer stack (landing) ---------- */
.stack{border-top:1px solid var(--border)}
.stack-item{display:grid; grid-template-columns:44px 1fr; gap:22px; padding-block:26px; border-bottom:1px solid var(--border); align-items:start}
.stack-item .n{font-family:var(--serif); font-weight:300; font-size:26px; color:var(--gold); line-height:1.1}
.stack-item p{font-size:15.5px}
.lp-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:60px; align-items:start}

/* ---------- guarantee panel ---------- */
.guarantee{border:1px solid var(--gold); background:var(--gold-dim); padding:clamp(28px,4vw,42px); display:flex; flex-direction:column; gap:18px}

/* ---------- toast ---------- */
.toast{
  position:fixed; left:50%; bottom:26px; transform:translate(-50%,14px);
  background:var(--dark); color:var(--dark-text); font-size:14px; font-weight:600;
  padding:13px 20px; border-radius:8px; opacity:0; pointer-events:none;
  transition:opacity .22s ease, transform .22s ease; z-index:99; max-width:calc(100vw - 32px);
}
.toast.show{opacity:1; transform:translate(-50%,0)}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .founder,.lp-grid{grid-template-columns:1fr; gap:36px}
  .filters{grid-template-columns:1fr 1fr}
  .fit{gap:34px}
}
@media (max-width:760px){
  .nav-links a:not(.btn){display:none}
  .nav-in{height:62px}
  .row{grid-template-columns:40px 1fr; gap:16px}
  .row .n{font-size:24px}
  .row h3{grid-column:2}
  .row p{grid-column:2}
  .compare,.bili,.fit{grid-template-columns:1fr}
  .compare > div + div{border-left:0; border-top:1px solid var(--border)}
  .filters{grid-template-columns:1fr}
  .tl{grid-template-columns:1fr; gap:6px}
  .cred{grid-template-columns:1fr; gap:4px}
  .grid2{grid-template-columns:1fr}
  .strip-in{gap:12px}
}

/* ---------- landing form: sticky on desktop, clear of the sticky nav ---------- */
[id]{scroll-margin-top:88px}
@media (min-width:901px){
  #apply{position:sticky; top:92px}
}
.formwrap{box-shadow:0 1px 2px rgba(26,25,23,.03)}
