/* ============================================================
   FairDeal Landing Pages — shared component styles
   (loads after lp-base.css which holds tokens, buttons, reveal)
   ============================================================ */

/* header */
.lp-header{position:fixed;top:0;left:0;right:0;z-index:100;transition:.5s var(--ease)}
.lp-header::after{content:"";position:absolute;inset:0;z-index:-1;background:rgba(246,244,239,.82);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);opacity:0;transition:opacity .5s var(--ease)}
.lp-header.scrolled::after{opacity:1}
.lp-header-inner{max-width:var(--maxw);margin:0 auto;padding:16px var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:24px}
.lp-brand img{height:38px;width:auto;display:block}
.lp-header .back{font-family:"Archivo",sans-serif;font-size:12px;letter-spacing:.12em;color:var(--stone);display:inline-flex;align-items:center;gap:8px;transition:color .3s}
.lp-header .back:hover{color:var(--amber)}
.lp-header .back .ar{transition:transform .4s var(--ease)}
.lp-header .back:hover .ar{transform:translateX(-3px)}
.lp-header .head-cta{display:flex;align-items:center;gap:16px}

/* top progress hairline */
.lp-progress{position:fixed;top:0;left:0;height:3px;width:100%;z-index:200;pointer-events:none;background:transparent}
.lp-progress .bar{height:100%;width:0;background:linear-gradient(90deg,var(--amber-deep),var(--amber),var(--champagne-2));box-shadow:0 0 12px rgba(214,154,58,.5)}

/* hero */
.lp-hero{position:relative;overflow:hidden;padding-top:clamp(120px,15vh,168px);padding-bottom:clamp(56px,8vw,110px)}
.lp-hero .aura{display:none}
.lp-hero .grain{display:none}
.lp-hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,80px);align-items:center}
.lp-hero h1{font-family:"Archivo Expanded","Archivo",sans-serif;font-weight:600;font-size:clamp(32px,4.4vw,60px);line-height:1.04;letter-spacing:-.028em}
.lp-hero h1 .em{font-style:normal;color:var(--brass-deep)}
.lp-hero h1 .em svg{display:none}
.lp-hero .lead{margin-top:clamp(20px,3vw,30px);max-width:52ch}
.lp-hero .acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(26px,3.5vw,36px)}
.lp-hero .microtrust{list-style:none;display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:24px;padding:0}
.lp-hero .microtrust li{font-family:"Archivo",sans-serif;font-size:13.5px;color:#5a5f64;font-weight:500}
.lp-hero .rating{display:flex;align-items:center;gap:14px;margin-top:26px}
.lp-hero .rating .stars{color:var(--brass);letter-spacing:2px}
.lp-hero .rating .txt{font-family:"Archivo",sans-serif;font-size:14px;color:#454a4f}
.lp-hero .rating b{color:var(--ink)}

/* hero visual — clean framed studio image */
.lp-visual{position:relative;aspect-ratio:4/4.4;border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-lg);background:radial-gradient(120% 90% at 62% 26%,#3a352c,#211d18 46%,#0d0a05)}
.lp-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:contrast(1.05) brightness(.94)}
.lp-visual .ov{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,17,9,.1) 40%,rgba(20,17,9,.6) 100%),radial-gradient(120% 80% at 70% 12%,rgba(230,210,174,.12),transparent 55%)}
.lp-visual .tag{position:absolute;left:18px;bottom:18px;z-index:2;display:inline-flex;align-items:center;gap:8px;font-family:"Archivo",sans-serif;font-size:10.5px;letter-spacing:.01em;color:var(--champagne);background:rgba(20,17,9,.5);backdrop-filter:blur(6px);border:1px solid rgba(230,210,174,.22);padding:8px 13px;border-radius:100px}
.lp-visual .tag .d{display:none}
@keyframes lpPulse{0%{box-shadow:0 0 0 0 rgba(221,164,60,.5)}70%{box-shadow:0 0 0 7px rgba(221,164,60,0)}100%{box-shadow:0 0 0 0 rgba(221,164,60,0)}}
.lp-badge{position:absolute;z-index:3;background:rgba(246,244,239,.95);backdrop-filter:blur(8px);border-radius:12px;padding:12px 16px;box-shadow:0 20px 40px -16px rgba(0,0,0,.5);top:18px;right:18px}
.lp-badge .k{font-family:"Archivo",sans-serif;font-size:11px;letter-spacing:.01em;color:var(--brass-deep)}
.lp-badge .v{font-family:"Archivo Expanded","Archivo",sans-serif;font-size:16px;margin-top:2px}

/* trust bar */
.lp-trustbar{border-block:1px solid var(--line);background:var(--paper-2)}
.lp-trustbar .row{display:grid;grid-template-columns:repeat(4,1fr)}
.lp-trustbar .cell{padding:26px var(--gutter);display:flex;flex-direction:column;gap:4px;position:relative}
.lp-trustbar .cell:not(:last-child)::after{content:"";position:absolute;right:0;top:22%;bottom:22%;width:1px;background:var(--line)}
.lp-trustbar .big{font-family:"Archivo Expanded","Archivo",sans-serif;font-size:clamp(22px,2.6vw,30px);line-height:1}
.lp-trustbar .big em{font-style:italic;color:var(--amber)}
.lp-trustbar .lbl{font-size:13px;color:var(--stone);line-height:1.35}

/* generic section head */
.lp-sec{padding-block:clamp(64px,9vw,120px)}
.lp-sec .eyebrow{margin-bottom:16px}
.lp-sec h2{font-family:"Archivo Expanded","Archivo",sans-serif;font-weight:400;font-size:var(--fs-h2);line-height:1.06;letter-spacing:-.015em;max-width:20ch}
.lp-sec h2 em{font-style:italic;color:var(--amber)}
.lp-sec .sub{color:#4a453d;font-size:var(--fs-body-lg);max-width:52ch;margin-top:18px}

/* reasons (why sell with us) */
.lp-reasons{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:clamp(40px,5vw,60px)}
.lp-reason{border:1px solid var(--line);border-radius:var(--r-lg);padding:30px;background:var(--paper-2);transition:.5s var(--ease)}
.lp-reason:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--champagne)}
.lp-reason .ic{width:46px;height:46px;border-radius:11px;background:var(--paper);border:1px solid var(--line);display:grid;place-items:center;color:var(--amber);font-size:20px;margin-bottom:18px;transition:.4s var(--ease)}
.lp-reason:hover .ic{background:var(--ink);color:var(--champagne);border-color:var(--ink);transform:rotate(-6deg)}
.lp-reason h3{font-family:"Archivo Expanded","Archivo",sans-serif;font-weight:500;font-size:20px;letter-spacing:0}
.lp-reason p{font-size:14.5px;color:var(--stone);margin-top:8px;line-height:1.55}

/* process steps */
.lp-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:clamp(40px,5vw,60px)}
.lp-step{position:relative;padding-top:28px}
.lp-step::before{content:"";position:absolute;top:0;left:0;width:100%;height:1px;background:var(--line)}
.lp-step.on::before{background:linear-gradient(90deg,var(--amber),var(--champagne));box-shadow:0 0 10px rgba(214,154,58,.5)}
.lp-step .n{font-family:"Archivo",sans-serif;font-size:12px;letter-spacing:.01em;color:var(--amber)}
.lp-step h3{font-family:"Archivo Expanded","Archivo",sans-serif;font-weight:400;font-size:21px;margin-top:12px}
.lp-step p{font-size:14px;color:#4a453d;margin-top:8px;line-height:1.5}

/* criteria / details on dark */
.lp-detail{background:var(--graphite);color:var(--paper);position:relative;overflow:hidden}
.lp-detail::before{content:"";position:absolute;width:70%;height:120%;top:-10%;right:-15%;background:radial-gradient(closest-side,rgba(214,154,58,.1),transparent 70%);pointer-events:none}
.lp-detail .grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,72px);align-items:center;position:relative;z-index:1}
.lp-detail .eyebrow{color:var(--champagne)}.lp-detail .eyebrow::before{background:var(--champagne)}
.lp-detail h2{color:#fff}
.lp-detail .sub{color:var(--stone-2)}
.lp-crit{list-style:none;margin:30px 0 0;padding:0;border-top:1px solid rgba(230,210,174,.14)}
.lp-crit li{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:16px 2px;border-bottom:1px solid rgba(230,210,174,.1)}
.lp-crit .k{font-family:"Archivo Expanded","Archivo",sans-serif;font-size:17px;color:var(--paper)}
.lp-crit .v{font-family:"Archivo",sans-serif;font-size:11px;letter-spacing:.1em;color:var(--stone-2);text-align:right}
.lp-detail .visual{position:relative;aspect-ratio:1/1.05;border-radius:var(--r-lg);overflow:hidden;box-shadow:0 40px 80px -30px rgba(0,0,0,.7)}
.lp-detail .visual img{width:100%;height:100%;object-fit:cover;filter:contrast(1.05) brightness(.95)}
.lp-detail .visual .ov{position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(20,17,9,.5))}

/* faq */
.lp-faq-list{margin-top:clamp(36px,4vw,52px);border-top:1px solid var(--line)}
.lp-faq{border-bottom:1px solid var(--line)}
.lp-faq button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 4px;text-align:left;transition:padding-left .4s var(--ease)}
.lp-faq button:hover{padding-left:8px}
.lp-faq .q{font-family:"Archivo Expanded","Archivo",sans-serif;font-size:clamp(17px,2vw,21px);color:var(--ink)}
.lp-faq .ic{flex:none;width:30px;height:30px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;color:var(--amber);transition:.4s var(--ease);font-size:16px}
.lp-faq.open .ic{background:var(--amber);color:#fff;border-color:var(--amber);transform:rotate(45deg)}
.lp-faq .a{max-height:0;overflow:hidden;transition:max-height .5s var(--ease)}
.lp-faq .a p{padding:0 4px 24px;color:#4a453d;max-width:70ch;font-size:15px;line-height:1.6}

/* final cta */
.lp-cta{background:var(--ink);color:var(--paper);text-align:center;position:relative;overflow:hidden}
.lp-cta .glow{position:absolute;left:50%;top:-30%;width:120%;height:90%;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(214,154,58,.22),transparent 70%);pointer-events:none}
.lp-cta .inner{position:relative;z-index:1;max-width:720px;margin:0 auto}
.lp-cta h2{font-family:"Archivo Expanded","Archivo",sans-serif;font-weight:400;color:#fff;font-size:clamp(32px,5.4vw,60px);line-height:1.05}
.lp-cta h2 em{font-style:italic;color:var(--amber-bright)}
.lp-cta p{color:var(--stone-2);font-size:var(--fs-body-lg);margin:20px auto 0;max-width:46ch}
.lp-cta .acts{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:34px}
.lp-cta .trust{margin-top:24px;font-family:"Archivo",sans-serif;font-size:12px;letter-spacing:.1em;color:var(--stone)}

/* footer (compact) */
.lp-footer{background:var(--graphite);color:var(--paper)}
.lp-footer .inner{max-width:var(--maxw);margin:0 auto;padding:clamp(48px,6vw,72px) var(--gutter) 32px;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
.lp-footer .flogo img{height:38px;width:auto;display:block;margin-bottom:16px}
.lp-footer p.desc{color:var(--stone-2);font-size:14px;max-width:34ch;line-height:1.6}
.lp-footer h4{font-family:"Archivo",sans-serif;font-size:11px;letter-spacing:.01em;color:var(--stone);margin-bottom:16px}
.lp-footer ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:12px}
.lp-footer ul a{color:var(--stone-2);font-size:14.5px;transition:color .3s}
.lp-footer ul a:hover{color:var(--amber)}
.lp-footer .fbot{max-width:var(--maxw);margin:0 auto;padding:22px var(--gutter);border-top:1px solid rgba(246,244,239,.08);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12.5px;color:var(--stone)}
.lp-footer .fbot a{color:var(--stone-2)}.lp-footer .fbot a:hover{color:var(--amber)}

/* whatsapp float (reuse minimal) */
.wa-float{position:fixed;right:22px;bottom:22px;z-index:80;display:inline-flex;align-items:center;gap:0;background:#1f4a37;color:#fff;border-radius:100px;padding:14px;box-shadow:0 16px 40px -12px rgba(0,0,0,.4);transition:.4s var(--ease)}
.wa-float .t{max-width:0;overflow:hidden;white-space:nowrap;transition:max-width .5s var(--ease),margin .5s var(--ease);display:flex;flex-direction:column;line-height:1.15}
.wa-float:hover .t{max-width:180px;margin-left:12px;margin-right:6px}
.wa-float .t b{font-size:13.5px}.wa-float .t small{font-size:11px;color:rgba(255,255,255,.7)}

/* responsive */
@media (max-width:1000px){
  .lp-hero-grid{grid-template-columns:1fr;gap:36px}
  .lp-visual{aspect-ratio:16/12;max-height:420px}
  .lp-reasons{grid-template-columns:1fr}
  .lp-steps{grid-template-columns:1fr 1fr}
  .lp-detail .grid{grid-template-columns:1fr}
  .lp-trustbar .row{grid-template-columns:1fr 1fr}
  .lp-trustbar .cell:nth-child(2)::after{display:none}
  .lp-footer .inner{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .lp-steps{grid-template-columns:1fr}
  .lp-trustbar .row{grid-template-columns:1fr}
  .lp-trustbar .cell::after{display:none!important}
  .lp-trustbar .cell{border-bottom:1px solid var(--line)}
  .lp-footer .inner{grid-template-columns:1fr}
  .head-cta .btn{display:none}
}
@media (prefers-reduced-motion:reduce){
  .lp-hero h1 .em svg path{animation:none;stroke-dashoffset:0}
  .lp-progress .bar{transition:none}
  .lp-visual .tag .d{animation:none}
}

/* light + glass buttons for dark CTA sections */
.lp-cta .btn-light{background:var(--paper);color:var(--ink);border:none}
.lp-cta .btn-light:hover{background:#fff}
.btn-glass{display:inline-flex;align-items:center;justify-content:center;font-family:"Archivo",sans-serif;font-weight:500;font-size:15px;letter-spacing:.005em;padding:15px 26px;border-radius:var(--r-sm);min-height:50px;border:1px solid rgba(244,243,240,.5);color:#fff;background:rgba(244,243,240,.06);transition:background .35s var(--ease),border-color .35s var(--ease)}
.btn-glass:hover{background:rgba(244,243,240,.16);border-color:#fff}
