/* Shared styles for the guide / service pages. The homepage keeps its own inline styles. */
:root{
  --ink:#14243b; --navy:#1b3253;
  --cream:#faf5ec; --cream-2:#f3ead9; --paper:#fffbf3;
  --coral:#d8623c; --coral-soft:#e4845f;
  --gold:#bf9748; --gold-soft:#e7c877;
  --slate:#404a59; --slate-2:#586472;
  --line:rgba(20,36,59,.12); --line-2:rgba(20,36,59,.07);
}
*{box-sizing:border-box; margin:0; padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--cream); color:var(--ink);
  font-family:"Plus Jakarta Sans", system-ui, sans-serif;
  font-size:17.5px; line-height:1.68; font-weight:440;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  background-image:
    radial-gradient(ellipse 720px 520px at 8% -5%, rgba(216,98,60,.08), transparent 60%),
    radial-gradient(ellipse 820px 600px at 95% 8%, rgba(191,151,72,.10), transparent 60%);
}
a{color:inherit; text-decoration:none}
img{max-width:100%; display:block}
::selection{background:var(--coral); color:var(--cream)}
.wrap{max-width:1160px; margin:0 auto; padding:0 40px}
.narrow{max-width:760px}

em.ital{font-family:"Plus Jakarta Sans", system-ui, sans-serif; font-style:italic; font-weight:650; color:var(--coral);}
.eyebrow{
  font-weight:600; font-size:12.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--coral);
  display:inline-flex; align-items:center; gap:9px;
}
.eyebrow::before{content:""; width:26px; height:1.5px; background:currentColor; display:inline-block}

/* Nav */
.nav{position:sticky; top:0; z-index:60; background:rgba(250,245,236,.86); backdrop-filter:saturate(140%) blur(14px); border-bottom:1px solid var(--line-2)}
.nav-in{max-width:1160px; margin:0 auto; padding:14px 40px; display:flex; align-items:center; justify-content:space-between; gap:24px}
.brand{display:flex; align-items:center; gap:13px}
.emblem{width:48px; height:48px; flex:none; border-radius:50%; background:var(--ink); display:grid; place-items:center; position:relative; box-shadow:0 8px 18px -10px rgba(20,36,59,.5)}
.emblem::after{content:""; position:absolute; inset:4px; border-radius:50%; border:1px solid rgba(231,200,119,.5)}
.emblem span{font-family:"Plus Jakarta Sans", system-ui, sans-serif; font-weight:650; font-size:18px; color:var(--gold-soft); line-height:1; letter-spacing:.04em; position:relative; z-index:1; margin-top:1px}
.brand-text{display:flex; flex-direction:column; line-height:1.05}
.brand-name{font-family:"Plus Jakarta Sans", system-ui, sans-serif; font-weight:700; font-size:19px; color:var(--ink); letter-spacing:-.01em}
.brand-sub{font-size:10.5px; font-weight:600; letter-spacing:.13em; text-transform:uppercase; color:var(--slate-2); margin-top:2px}
.nav-links{display:flex; align-items:center; gap:24px}
.nav-links a{font-size:14.5px; font-weight:560; color:var(--slate); padding:4px 0; border-bottom:1.5px solid transparent; transition:color .2s, border-color .2s}
.nav-links a:hover,.nav-links a[aria-current]{color:var(--ink); border-color:var(--coral)}

.btn{
  --bg:var(--ink); --fg:var(--cream);
  display:inline-flex; align-items:center; gap:9px; flex:none;
  font-family:inherit; font-weight:600; font-size:14.5px;
  padding:12px 22px; border-radius:999px; border:none; cursor:pointer;
  background:var(--bg); color:var(--fg); transition:transform .25s, box-shadow .35s, background .3s;
}
.btn:hover{transform:translateY(-2px); background:var(--coral); box-shadow:0 16px 30px -16px rgba(216,98,60,.6)}
.btn.ghost{background:transparent; color:var(--ink); box-shadow:inset 0 0 0 1.5px var(--line)}
.btn.ghost:hover{background:var(--ink); color:var(--cream)}
.btn.lg{padding:16px 30px; font-size:15.5px}

/* Page hero */
.crumbs{font-size:13.5px; color:var(--slate-2); padding-top:34px}
.crumbs a{color:var(--slate); border-bottom:1px solid var(--line)}
.crumbs a:hover{color:var(--coral)}
.page-hero{padding:26px 0 56px}
.page-hero h1{
  font-family:"Plus Jakarta Sans", system-ui, sans-serif; font-weight:650;
  font-size:clamp(36px, 5vw, 58px); line-height:1.05; letter-spacing:-.026em; margin:18px 0 22px; max-width:860px;
}
.page-hero .lede{font-size:19px; color:var(--slate); max-width:640px; margin-bottom:30px}
.page-hero .lede strong{color:var(--ink); font-weight:650}
.hero-cta{display:flex; gap:14px; flex-wrap:wrap}
.trust{display:flex; gap:10px; flex-wrap:wrap; margin-top:30px}
.trust span{font-size:13.5px; font-weight:560; color:var(--slate); background:var(--paper); border:1px solid var(--line); border-radius:999px; padding:6px 14px}
.trust b{color:var(--ink)}

/* Article body */
.article{padding:10px 0 40px}
.article h2{
  font-family:"Plus Jakarta Sans", system-ui, sans-serif; font-weight:650;
  font-size:clamp(26px, 3.2vw, 34px); line-height:1.15; letter-spacing:-.02em; margin:52px 0 16px;
}
.article h3{font-family:"Plus Jakarta Sans", system-ui, sans-serif; font-weight:700; font-size:21px; margin:30px 0 8px}
.article p{color:var(--slate); margin-bottom:16px}
.article p strong,.article li strong{color:var(--ink); font-weight:650}
.article ul,.article ol{color:var(--slate); margin:0 0 18px 22px}
.article li{margin-bottom:8px; padding-left:4px}
.article li::marker{color:var(--coral)}
.article a:not(.btn){color:var(--coral); font-weight:600; border-bottom:1px solid rgba(216,98,60,.3)}
.article a:not(.btn):hover{border-color:var(--coral)}

.callout{background:var(--paper); border:1px solid var(--line); border-left:3px solid var(--coral); border-radius:14px; padding:22px 26px; margin:26px 0}
.callout p:last-child,.callout ul:last-child{margin-bottom:0}
.callout .k{display:block; font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--coral); margin-bottom:8px}

.facts{display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:12px; margin:24px 0 8px}
.fact{background:var(--paper); border:1px solid var(--line); border-radius:14px; padding:16px 18px}
.fact b{display:block; font-family:"Plus Jakarta Sans", system-ui, sans-serif; font-weight:700; font-size:24px; color:var(--ink); line-height:1.1}
.fact span{font-size:13.5px; color:var(--slate-2)}

/* Offer card */
.offer{background:var(--ink); color:var(--cream); border-radius:22px; padding:34px 36px; margin:40px 0; display:grid; grid-template-columns:1fr auto; gap:30px; align-items:center}
.offer .eyebrow{color:var(--gold-soft)}
.offer h3{font-family:"Plus Jakarta Sans", system-ui, sans-serif; font-weight:700; font-size:27px; color:var(--cream); margin:12px 0 10px}
.offer ul{list-style:none; margin:0; color:rgba(250,245,236,.8); font-size:15.5px}
.offer li{margin:6px 0; padding-left:22px; position:relative}
.offer li::before{content:"✓"; position:absolute; left:0; color:var(--gold-soft); font-weight:700}
.offer .pr{text-align:right}
.offer .price{font-family:"Plus Jakarta Sans", system-ui, sans-serif; font-weight:650; font-size:52px; line-height:1; color:var(--cream)}
.offer .price small{font-size:18px; color:rgba(250,245,236,.6)}
.offer .dur{font-size:13.5px; color:rgba(250,245,236,.6); margin:8px 0 18px}
.offer .btn{--bg:var(--coral)}
.offer .btn:hover{background:var(--gold-soft); color:var(--ink)}
.offer .alt{font-size:13.5px; color:rgba(250,245,236,.6); margin-top:14px}
.offer .alt a{color:var(--gold-soft)}

/* FAQ */
.faq-list{margin-top:10px}
.faq{border-bottom:1px solid var(--line)}
.faq summary{
  list-style:none; cursor:pointer; padding:20px 0; display:flex; align-items:center; justify-content:space-between; gap:20px;
  font-family:"Plus Jakarta Sans", system-ui, sans-serif; font-weight:700; font-size:19px; color:var(--ink);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover,.faq[open] summary{color:var(--coral)}
.faq summary::after{content:"+"; font-family:"Plus Jakarta Sans", system-ui, sans-serif; font-size:26px; font-weight:400; color:var(--coral); transition:transform .3s}
.faq[open] summary::after{transform:rotate(45deg)}
.faq .ans{padding:0 0 20px; color:var(--slate); font-size:16.5px}

/* Related + CTA */
.related{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px; margin-top:18px}
.related a{display:block; background:var(--paper); border:1px solid var(--line); border-radius:14px; padding:16px 18px; font-weight:600; color:var(--ink) !important; border-bottom:1px solid var(--line) !important; transition:transform .3s, border-color .3s}
.related a:hover{transform:translateY(-3px); border-color:var(--coral) !important}
.related a span{display:block; font-weight:450; font-size:14px; color:var(--slate)}

.cta-band{background:var(--ink); color:var(--cream); padding:76px 0; margin-top:70px; text-align:center}
.cta-band h2{font-family:"Plus Jakarta Sans", system-ui, sans-serif; font-weight:650; font-size:clamp(30px, 4vw, 44px); line-height:1.1; letter-spacing:-.02em}
.cta-band p{color:rgba(250,245,236,.7); margin:16px auto 28px; max-width:560px}
.cta-band .btn{--bg:var(--coral)}
.cta-band .btn:hover{background:var(--gold-soft); color:var(--ink)}
.cta-band .mail{display:block; margin-top:18px; font-size:15px; color:var(--gold-soft)}

footer{background:var(--ink); border-top:1px solid rgba(231,200,119,.12); padding:30px 40px}
.foot-in{max-width:1160px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap}
.foot-in .brand-name{color:var(--cream)} .foot-in .brand-sub{color:rgba(250,245,236,.5)}
.foot-in .emblem{width:42px; height:42px; border:1px solid rgba(231,200,119,.32)}
.foot-in .emblem span{font-size:16px}
.foot-links{display:flex; gap:8px 22px; flex-wrap:wrap; font-size:13.5px}
.foot-links a{color:rgba(250,245,236,.7)} .foot-links a:hover{color:var(--gold-soft)}
footer .meta{font-size:13px; color:rgba(250,245,236,.45)}
footer .meta a{color:var(--gold-soft)}

@media (max-width:980px){
  .nav-links{display:none}
  .offer{grid-template-columns:1fr} .offer .pr{text-align:left}
}
@media (max-width:760px){
  .wrap,.nav-in{padding-left:16px; padding-right:16px}
  footer{padding:30px 16px}
  .nav .btn{padding:10px 16px; font-size:13.5px}
  .brand-sub{display:none}
  .offer{padding:28px 22px}
}
@media (prefers-reduced-motion:reduce){*{transition:none !important}}
