/* ==========================================================================
   Trueline Solutions — design system
   Palette and type are carried over from the PDF Highlighter product (ink +
   gold on paper) so the consultancy site and the software read as one brand.
   ========================================================================== */

:root{
  /* Surfaces */
  --canvas:#f3f5f9;
  --paper:#ffffff;
  --ink:#141b27;
  --ink-deep:#0c111a;
  --ink-mid:#1d2837;
  --ink-soft:#5c6678;
  --ink-faint:#8d95a5;
  --line:#e3e8f0;
  --line-strong:#cfd6e2;

  /* Accents — gold is the brand mark, green only ever means "in good standing" */
  --gold:#e0ac1c;
  --gold-deep:#8a6410;
  --gold-wash:#fdf3da;
  --verify:#17795e;
  --verify-wash:#e6f3ee;
  --alert:#a3402c;
  --alert-wash:#faece8;

  /* Glass */
  --glass:rgba(255,255,255,.07);
  --glass-line:rgba(255,255,255,.14);
  --glass-light:rgba(255,255,255,.72);

  /* Shape + depth */
  --r-sm:6px;
  --r:10px;
  --r-lg:16px;
  --shadow-sm:0 1px 2px rgba(20,27,39,.06);
  --shadow:0 10px 30px -18px rgba(20,27,39,.45);
  --shadow-lg:0 30px 70px -40px rgba(20,27,39,.55);

  /* Rhythm */
  --wrap:1180px;
  --gutter:24px;
  --section:96px;
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important;}
}

body{
  margin:0;
  background:var(--canvas);
  color:var(--ink);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;height:auto;display:block;}
a{color:inherit;}

/* ---------- Type scale ---------------------------------------------------- */
h1,h2,h3,h4{
  font-family:'Source Serif 4',Georgia,'Times New Roman',serif;
  font-weight:600;
  letter-spacing:-.011em;
  line-height:1.18;
  margin:0 0 .5em;
  color:var(--ink);
}
h1{font-size:clamp(2.1rem,1.35rem + 2.6vw,3.35rem);}
h2{font-size:clamp(1.6rem,1.2rem + 1.5vw,2.3rem);}
h3{font-size:1.2rem;line-height:1.3;}
h4{font-size:1.02rem;}
p{margin:0 0 1rem;max-width:68ch;}
.lede{font-size:1.09rem;color:var(--ink-soft);max-width:62ch;line-height:1.66;}
.small{font-size:.85rem;}
.muted{color:var(--ink-soft);}
.faint{color:var(--ink-faint);}

/* ---------- Layout -------------------------------------------------------- */
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);}
.section{padding:var(--section) 0;}
.section--tight{padding:64px 0;}
.section--dark{background:var(--ink);color:#e9edf4;}
.section--dark h1,.section--dark h2,.section--dark h3,.section--dark h4{color:#fff;}
.section--dark .lede,.section--dark .muted{color:#a9b4c6;}
.section--paper{background:var(--paper);}

.grid{display:grid;gap:22px;}
.g-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.g-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.g-4{grid-template-columns:repeat(4,minmax(0,1fr));}
@media (max-width:960px){.g-3,.g-4{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:620px){.g-2,.g-3,.g-4{grid-template-columns:1fr;}}

.stack>*+*{margin-top:14px;}
.row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;}
.between{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;}

/* The one recurring brand device: the product's hand-drawn highlight stroke. */
.section-mark{display:block;width:54px;height:6px;margin-bottom:20px;
  background:linear-gradient(90deg,var(--gold) 0%,rgba(224,172,28,.25) 100%);
  border-radius:3px;}

/* ---------- Buttons ------------------------------------------------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:13px 22px;border-radius:var(--r-sm);border:1.5px solid transparent;
  font:600 .95rem/1 'Inter',sans-serif;cursor:pointer;text-decoration:none;
  transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease;
}
.btn:focus-visible{outline:3px solid var(--gold);outline-offset:2px;}
.btn--primary{background:var(--ink);color:#fff;}
.btn--primary:hover{background:var(--ink-mid);}
.btn--gold{background:var(--gold);color:#2c2003;}
.btn--gold:hover{background:#c9991a;}
.btn--ghost{border-color:var(--line-strong);color:var(--ink);background:var(--paper);}
.btn--ghost:hover{border-color:var(--ink);}
.btn--onDark{border-color:rgba(255,255,255,.28);color:#fff;background:rgba(255,255,255,.06);}
.btn--onDark:hover{background:rgba(255,255,255,.14);}
.btn--sm{padding:9px 15px;font-size:.85rem;}
.btn--block{width:100%;}
.btn[disabled],.btn.is-disabled{opacity:.5;pointer-events:none;}

.link-quiet{color:var(--gold-deep);font-weight:600;text-decoration:none;border-bottom:1px solid rgba(138,100,16,.32);}
.link-quiet:hover{border-bottom-color:var(--gold-deep);}

/* ---------- Announcement + navigation ------------------------------------ */
.announce{
  background:var(--ink-deep);color:#cdd6e4;font-size:.84rem;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.announce .wrap{display:flex;align-items:center;justify-content:center;gap:14px;padding-top:9px;padding-bottom:9px;text-align:center;}
.announce b{color:var(--gold);font-weight:600;}
.announce button{background:none;border:none;color:#7f8aa0;cursor:pointer;font-size:1rem;line-height:1;padding:2px 4px;}
.announce button:hover{color:#fff;}

.nav{
  position:sticky;top:0;z-index:60;
  background:rgba(12,17,26,.82);
  backdrop-filter:saturate(150%) blur(14px);
  -webkit-backdrop-filter:saturate(150%) blur(14px);
  border-bottom:1px solid rgba(255,255,255,.08);
  transition:padding .18s ease,background .18s ease;
}
.nav .wrap{display:flex;align-items:center;gap:26px;padding-top:16px;padding-bottom:16px;transition:padding .18s ease;}
.nav.is-scrolled .wrap{padding-top:9px;padding-bottom:9px;}
.nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0;}
.nav-logo img{height:39px;width:auto;filter:invert(1) brightness(1.9);}
.nav-links{display:flex;align-items:center;gap:4px;margin-left:auto;}
.nav-links a,.nav-trigger{
  color:#c9d2e0;text-decoration:none;font-size:.9rem;font-weight:500;
  padding:9px 12px;border-radius:var(--r-sm);background:none;border:none;cursor:pointer;
  font-family:inherit;display:inline-flex;align-items:center;gap:6px;
}
.nav-links a:hover,.nav-trigger:hover,.nav-trigger[aria-expanded="true"]{color:#fff;background:rgba(255,255,255,.08);}
.nav-links a.is-active{color:#fff;box-shadow:inset 0 -2px 0 var(--gold);}
.nav-trigger svg{transition:transform .18s ease;}
.nav-trigger[aria-expanded="true"] svg{transform:rotate(180deg);}
.nav-actions{display:flex;align-items:center;gap:10px;flex-shrink:0;}

/* Mega menu */
.mega{
  position:absolute;left:0;right:0;top:100%;
  background:rgba(13,18,27,.97);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:var(--shadow-lg);
  display:none;
}
.mega.is-open{display:block;}
.mega .wrap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:start;gap:30px;padding-top:34px;padding-bottom:34px;}
.mega-col h4{color:#fff;font-size:.82rem;font-family:'Inter',sans-serif;font-weight:600;letter-spacing:.02em;
  padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid rgba(255,255,255,.1);}
.mega-item{display:flex;gap:11px;padding:9px 10px;border-radius:var(--r-sm);text-decoration:none;transition:background .15s ease;}
.mega-item:hover{background:rgba(255,255,255,.07);}
.mega-item .ic{flex-shrink:0;width:30px;height:30px;border-radius:7px;background:rgba(224,172,28,.14);
  display:flex;align-items:center;justify-content:center;color:var(--gold);}
.mega-item .t{color:#fff;font-size:.9rem;font-weight:600;display:block;line-height:1.3;}
.mega-item .d{color:#8f9ab0;font-size:.79rem;display:block;line-height:1.45;margin-top:2px;}
.mega-item .arrow{margin-left:auto;color:#5c6982;align-self:center;opacity:0;transition:opacity .15s;}
.mega-item:hover .arrow{opacity:1;}
/* Single-line items (no description) — used for the Services mega, which
   lists every service and gets crowded fast with a second line each. */
.mega-item--tight{align-items:center;padding:8px 10px;}
.mega-item--tight .t{line-height:1.2;}

/* Mobile navigation */
.nav-burger{display:none;background:none;border:1px solid rgba(255,255,255,.2);border-radius:var(--r-sm);
  padding:8px 10px;color:#fff;cursor:pointer;margin-left:auto;}
.mobile-nav{display:none;background:var(--ink-deep);border-bottom:1px solid rgba(255,255,255,.08);}
.mobile-nav.is-open{display:block;}
.mobile-nav .wrap{padding-top:14px;padding-bottom:22px;}
.mobile-nav details{border-bottom:1px solid rgba(255,255,255,.08);}
.mobile-nav summary{list-style:none;cursor:pointer;color:#dfe5ee;padding:13px 2px;font-weight:600;font-size:.95rem;
  display:flex;justify-content:space-between;align-items:center;}
.mobile-nav summary::-webkit-details-marker{display:none;}
.mobile-nav details[open] summary{color:var(--gold);}
.mobile-nav .sub a{display:block;color:#a8b2c4;text-decoration:none;padding:9px 2px 9px 14px;font-size:.89rem;}
.mobile-nav .sub a:hover{color:#fff;}
.mobile-nav>.wrap>a{display:block;color:#dfe5ee;text-decoration:none;padding:13px 2px;font-weight:600;font-size:.95rem;
  border-bottom:1px solid rgba(255,255,255,.08);}
.mobile-nav .actions{display:flex;gap:10px;margin-top:18px;}
@media (max-width:1080px){
  .nav-links,.nav-actions{display:none;}
  .nav-burger{display:block;}
}

/* ---------- Hero ---------------------------------------------------------- */
.hero{position:relative;background:var(--ink);color:#e8edf5;overflow:hidden;}
.hero::before{
  content:'';position:absolute;inset:-30% -10% auto -10%;height:120%;
  background:radial-gradient(56% 48% at 22% 12%,rgba(224,172,28,.20) 0%,transparent 62%),
             radial-gradient(48% 42% at 88% 8%,rgba(58,104,168,.24) 0%,transparent 60%);
  pointer-events:none;
}
.hero .wrap{position:relative;display:grid;grid-template-columns:1.06fr .94fr;gap:56px;align-items:center;
  padding-top:88px;padding-bottom:96px;}
.hero h1{color:#fff;max-width:14ch;}
.hero .lede{color:#b3bdcd;max-width:52ch;font-size:1.12rem;}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px;}
.hero-note{margin-top:26px;color:#8894a8;font-size:.85rem;display:flex;align-items:center;gap:9px;}
.hero-note svg{flex-shrink:0;color:var(--gold);}
@media (max-width:960px){
  .hero .wrap{grid-template-columns:1fr;gap:40px;padding-top:56px;padding-bottom:64px;}
  .hero h1{max-width:none;}
}

/* Hero panel — the signature element. A compliance ledger, not a stat block. */
.panel{
  background:var(--glass);border:1px solid var(--glass-line);border-radius:var(--r-lg);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  box-shadow:var(--shadow-lg);overflow:hidden;
}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 20px;border-bottom:1px solid var(--glass-line);}
.panel-head .t{font-size:.86rem;font-weight:600;color:#fff;}
.panel-head .dot{width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(224,172,28,.16);}
.ledger-row{display:flex;align-items:center;gap:14px;padding:14px 20px;border-bottom:1px solid rgba(255,255,255,.07);}
.ledger-row:last-child{border-bottom:none;}
.ledger-row .name{font-size:.9rem;color:#e6ebf4;font-weight:500;}
.ledger-row .meta{font-size:.76rem;color:#7f8ba1;margin-top:2px;}
.ledger-row .pill{margin-left:auto;flex-shrink:0;}
.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:100px;
  font-size:.74rem;font-weight:600;letter-spacing:.01em;}
.pill--ok{background:rgba(23,121,94,.2);color:#7fdcbc;}
.pill--due{background:rgba(224,172,28,.16);color:#f0cc70;}
.pill--wait{background:rgba(255,255,255,.08);color:#9fabc0;}
.panel-foot{padding:14px 20px;background:rgba(255,255,255,.04);font-size:.79rem;color:#8b96ab;}

/* ---------- Cards --------------------------------------------------------- */
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:26px;}
.card--link{text-decoration:none;display:block;position:relative;transition:border-color .18s ease,box-shadow .18s ease;}
.card--link:hover{border-color:var(--line-strong);box-shadow:var(--shadow);}
.card--link::after{content:'';position:absolute;left:0;right:0;top:0;height:3px;border-radius:var(--r) var(--r) 0 0;
  background:var(--gold);opacity:0;transition:opacity .18s ease;}
.card--link:hover::after{opacity:1;}
.card h3{margin-bottom:6px;}
.card p{font-size:.92rem;color:var(--ink-soft);margin-bottom:0;}

.ic-badge{width:40px;height:40px;border-radius:9px;background:var(--gold-wash);color:var(--gold-deep);
  display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
.section--dark .ic-badge{background:rgba(224,172,28,.14);color:var(--gold);}

.price-tag{font-family:'Source Serif 4',Georgia,serif;font-size:1.32rem;font-weight:600;color:var(--ink);}
.price-tag small{font-family:'Inter',sans-serif;font-size:.76rem;font-weight:500;color:var(--ink-faint);display:block;margin-top:1px;}

.service-card{display:flex;flex-direction:column;height:100%;}
.service-card .foot{margin-top:auto;padding-top:18px;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;}
.service-card .go{font-size:.85rem;font-weight:600;color:var(--gold-deep);}

/* Trust strip on dark */
.trust{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.09);border-radius:var(--r-lg);overflow:hidden;}
.trust>div{background:var(--ink-mid);padding:28px 24px;}
.trust h3{font-size:1.02rem;color:#fff;margin-bottom:6px;}
.trust p{font-size:.87rem;color:#a2aec1;margin:0;}
@media (max-width:860px){.trust{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:560px){.trust{grid-template-columns:1fr;}}

/* ---------- Government-fee notice ---------------------------------------- */
.notice{
  display:flex;gap:14px;padding:18px 20px;border-radius:var(--r);
  background:var(--gold-wash);border:1px solid #f0dda6;color:#5f4708;font-size:.89rem;line-height:1.6;
}
.notice svg{flex-shrink:0;margin-top:2px;color:var(--gold-deep);}
.notice strong{color:#493607;}
.notice p{margin:0;max-width:none;}
.notice--plain{background:#f7f9fc;border-color:var(--line);color:var(--ink-soft);}
.notice--plain svg{color:var(--ink-faint);}

/* ---------- Tables -------------------------------------------------------- */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--paper);}
table.data{width:100%;border-collapse:collapse;font-size:.92rem;min-width:520px;}
table.data th{text-align:left;font-weight:600;font-size:.79rem;color:var(--ink-soft);
  padding:13px 18px;border-bottom:1px solid var(--line);background:#fafbfd;white-space:nowrap;}
table.data td{padding:14px 18px;border-bottom:1px solid var(--line);vertical-align:middle;}
table.data tr:last-child td{border-bottom:none;}
table.data tbody tr:hover{background:#fbfcfe;}
table.data td.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;}

/* ---------- Calculator ---------------------------------------------------- */
.calc{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow);}
.calc-head{padding:22px 26px;border-bottom:1px solid var(--line);}
.calc-head h3{margin-bottom:4px;}
.calc-head p{margin:0;font-size:.88rem;color:var(--ink-soft);}
.calc-body{display:grid;grid-template-columns:1fr 1fr;gap:0;}
.calc-input{padding:26px;border-right:1px solid var(--line);}
.calc-output{padding:26px;background:#fafbfd;}
@media (max-width:760px){.calc-body{grid-template-columns:1fr;}.calc-input{border-right:none;border-bottom:1px solid var(--line);}}
.calc-line{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--line);font-size:.92rem;}
.calc-line:last-of-type{border-bottom:none;}
.calc-line span:last-child{font-variant-numeric:tabular-nums;font-weight:600;}
.calc-total{display:flex;justify-content:space-between;gap:16px;align-items:baseline;margin-top:14px;padding-top:16px;
  border-top:2px solid var(--ink);}
.calc-total .amount{font-family:'Source Serif 4',Georgia,serif;font-size:1.7rem;font-weight:600;font-variant-numeric:tabular-nums;}

/* ---------- Forms --------------------------------------------------------- */
.field{margin-bottom:18px;}
.field label{display:block;font-size:.86rem;font-weight:600;margin-bottom:6px;color:var(--ink);}
.field .hint{font-size:.79rem;color:var(--ink-faint);margin-top:5px;}
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=number],input[type=date],select,textarea{
  width:100%;padding:12px 14px;border:1.5px solid var(--line-strong);border-radius:var(--r-sm);
  font:400 .95rem/1.5 'Inter',sans-serif;color:var(--ink);background:var(--paper);
  transition:border-color .15s ease,box-shadow .15s ease;
}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold-deep);box-shadow:0 0 0 3px rgba(224,172,28,.2);}
textarea{min-height:130px;resize:vertical;}
.field.has-error input,.field.has-error select,.field.has-error textarea{border-color:var(--alert);}
.err-msg{color:var(--alert);font-size:.82rem;margin-top:5px;}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
fieldset{border:1px solid var(--line);border-radius:var(--r);padding:20px;margin:0 0 20px;}
legend{font-size:.85rem;font-weight:600;padding:0 8px;}
.check{display:flex;gap:10px;align-items:flex-start;padding:10px 0;font-size:.9rem;}
.check input{margin-top:3px;accent-color:var(--gold-deep);width:16px;height:16px;flex-shrink:0;}

/* ---------- Toggle + accordions ------------------------------------------ */
.toggle{display:inline-flex;background:#eef1f6;border:1px solid var(--line);border-radius:100px;padding:4px;gap:2px;}
.toggle button{border:none;background:none;padding:8px 18px;border-radius:100px;font:600 .85rem 'Inter',sans-serif;
  cursor:pointer;color:var(--ink-soft);}
.toggle button.is-on{background:var(--paper);color:var(--ink);box-shadow:var(--shadow-sm);}

.accordion{border:1px solid var(--line);border-radius:var(--r);background:var(--paper);overflow:hidden;}
.accordion details{border-bottom:1px solid var(--line);}
.accordion details:last-child{border-bottom:none;}
.accordion summary{cursor:pointer;list-style:none;padding:18px 22px;font-weight:600;font-size:.96rem;
  display:flex;justify-content:space-between;align-items:center;gap:16px;}
.accordion summary::-webkit-details-marker{display:none;}
.accordion summary::after{content:'+';font-size:1.3rem;color:var(--gold-deep);line-height:1;flex-shrink:0;}
.accordion details[open] summary::after{content:'–';}
.accordion .body{padding:0 22px 20px;color:var(--ink-soft);font-size:.93rem;}
.accordion .body p{margin-bottom:0;}

/* ---------- Lists --------------------------------------------------------- */
.ticks{list-style:none;padding:0;margin:0;}
.ticks li{position:relative;padding:8px 0 8px 28px;font-size:.93rem;color:var(--ink-soft);border-bottom:1px solid var(--line);}
.ticks li:last-child{border-bottom:none;}
.ticks li::before{content:'';position:absolute;left:4px;top:16px;width:9px;height:9px;border-radius:2px;
  background:var(--gold);}
.ticks--plain li::before{background:var(--line-strong);}

.steps{list-style:none;counter-reset:s;padding:0;margin:0;}
.steps li{counter-increment:s;position:relative;padding:0 0 26px 52px;}
.steps li::before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:-2px;
  width:34px;height:34px;border-radius:50%;border:1.5px solid var(--ink);background:var(--paper);
  display:flex;align-items:center;justify-content:center;
  font-family:'Source Serif 4',Georgia,serif;font-size:.83rem;font-weight:600;}
.steps li::after{content:'';position:absolute;left:17px;top:34px;bottom:0;width:1px;background:var(--line);}
.steps li:last-child{padding-bottom:0;}
.steps li:last-child::after{display:none;}
.steps h4{margin-bottom:3px;}
.steps p{font-size:.9rem;color:var(--ink-soft);margin:0;}
.section--dark .steps li::before{background:var(--ink);border-color:rgba(255,255,255,.4);color:#fff;}
.section--dark .steps li::after{background:rgba(255,255,255,.14);}

.dos-donts{display:grid;grid-template-columns:1fr 1fr;gap:22px;}
@media (max-width:700px){.dos-donts{grid-template-columns:1fr;}}
.dos,.donts{border-radius:var(--r);padding:24px;border:1px solid;}
.dos{background:var(--verify-wash);border-color:#bfe0d4;}
.donts{background:var(--alert-wash);border-color:#efcfc6;}
.dos h3{color:#0f5f49;}
.donts h3{color:#8a3323;}
.dos ul,.donts ul{list-style:none;padding:0;margin:0;}
.dos li,.donts li{padding:7px 0 7px 24px;position:relative;font-size:.92rem;}
.dos li::before{content:'✓';position:absolute;left:0;color:#17795e;font-weight:700;}
.donts li::before{content:'✕';position:absolute;left:0;color:#a3402c;font-weight:700;}

/* ---------- Pricing ------------------------------------------------------- */
.plan{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:32px;position:relative;
  display:flex;flex-direction:column;color:var(--ink);}
.plan--featured{border-color:var(--ink);box-shadow:var(--shadow);}
.plan .badge{position:absolute;top:-11px;left:32px;background:var(--gold);color:#2c2003;font-size:.73rem;font-weight:700;
  padding:4px 12px;border-radius:100px;}
.plan h3{color:var(--ink);}
/* .plan cards are a light "paper" surface even when the section wrapping
   them (e.g. section--dark) sets a pale text colour for its own background —
   without this, the price and tagline inherit that pale colour and become
   nearly invisible against the white card. */
.plan .muted{color:var(--ink-soft);}
.plan .amount{font-family:'Source Serif 4',Georgia,serif;font-size:2.4rem;font-weight:600;line-height:1;margin:14px 0 4px;color:var(--ink);}
.plan .per{color:var(--ink-faint);font-size:.87rem;}
.plan ul{list-style:none;padding:0;margin:22px 0;flex:1;}
.plan li{padding:8px 0 8px 26px;position:relative;font-size:.9rem;color:var(--ink-soft);}
.plan li::before{content:'';position:absolute;left:2px;top:15px;width:8px;height:8px;border-radius:2px;background:var(--gold);}
.plan li.off{color:var(--ink-faint);}
.plan li.off::before{background:var(--line-strong);}
.saving{display:inline-block;background:var(--verify-wash);color:#0f5f49;font-size:.78rem;font-weight:600;
  padding:3px 10px;border-radius:100px;margin-top:8px;}

/* ---------- Bundle -------------------------------------------------------- */
.bundle{background:var(--ink);color:#e8edf5;border-radius:var(--r-lg);padding:38px;position:relative;overflow:hidden;}
.bundle::before{content:'';position:absolute;right:-70px;top:-70px;width:280px;height:280px;border-radius:50%;
  background:radial-gradient(circle,rgba(224,172,28,.22) 0%,transparent 68%);}
.bundle h2,.bundle h3{color:#fff;position:relative;}
.bundle .inner{position:relative;display:grid;grid-template-columns:1.25fr .75fr;gap:38px;align-items:center;}
@media (max-width:800px){.bundle{padding:28px;}.bundle .inner{grid-template-columns:1fr;gap:26px;}}
.bundle ul{list-style:none;padding:0;margin:18px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:6px 18px;}
.bundle li{padding:5px 0 5px 22px;position:relative;font-size:.92rem;color:#c3ccdb;}
.bundle li::before{content:'';position:absolute;left:2px;top:13px;width:8px;height:8px;border-radius:2px;background:var(--gold);}
.bundle .amount{font-family:'Source Serif 4',Georgia,serif;font-size:2.6rem;color:#fff;line-height:1;}

/* ---------- Breadcrumbs --------------------------------------------------- */
.crumbs{font-size:.83rem;color:var(--ink-faint);padding:18px 0 0;}
.crumbs a{color:var(--ink-soft);text-decoration:none;}
.crumbs a:hover{color:var(--ink);}
.crumbs span{margin:0 7px;opacity:.55;}

/* ---------- Service page layout ------------------------------------------ */
.svc-hero{background:var(--ink);color:#e8edf5;padding:52px 0 62px;position:relative;overflow:hidden;}
.svc-hero::before{content:'';position:absolute;inset:auto -5% -60% 45%;height:150%;
  background:radial-gradient(45% 40% at 50% 50%,rgba(224,172,28,.16) 0%,transparent 65%);}
.svc-hero .wrap{position:relative;}
.svc-hero h1{color:#fff;margin-bottom:14px;}
.svc-hero .crumbs{color:#7f8ba1;padding-top:0;margin-bottom:22px;}
.svc-hero .crumbs a{color:#9dabc2;}
.svc-hero .lede{color:#b3bdcd;}
.svc-meta{display:flex;flex-wrap:wrap;gap:26px;margin-top:28px;padding-top:26px;border-top:1px solid rgba(255,255,255,.12);}
.svc-meta .item .k{font-size:.77rem;color:#7f8ba1;margin-bottom:3px;}
.svc-meta .item .v{font-size:1rem;font-weight:600;color:#fff;}

.svc-body{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:46px;align-items:start;}
@media (max-width:980px){.svc-body{grid-template-columns:1fr;}}
.svc-main>section{padding-bottom:42px;}
.svc-main>section:last-child{padding-bottom:0;}
.svc-aside{position:sticky;top:96px;display:flex;flex-direction:column;gap:18px;}
@media (max-width:980px){.svc-aside{position:static;}}
.aside-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:24px;}
.aside-card .amount{font-family:'Source Serif 4',Georgia,serif;font-size:2rem;font-weight:600;line-height:1;}

/* ---------- Footer -------------------------------------------------------- */
.footer{background:var(--ink-deep);color:#93a0b5;padding:70px 0 0;font-size:.9rem;}
.footer h4{color:#fff;font-family:'Inter',sans-serif;font-size:.83rem;font-weight:600;margin-bottom:14px;}
.footer a{color:#93a0b5;text-decoration:none;display:block;padding:5px 0;}
.footer a:hover{color:var(--gold);}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1.1fr;gap:34px;padding-bottom:46px;}
@media (max-width:900px){.footer-grid{grid-template-columns:1fr 1fr;gap:28px;}}
@media (max-width:520px){.footer-grid{grid-template-columns:1fr;}}
.footer-brand img{height:43px;width:auto;margin-bottom:16px;filter:invert(1) brightness(1.9);}
.footer-social{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;}
.footer-social a{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:100px;
  background:#eef1f6;color:var(--ink-soft);padding:0;transition:background .15s ease,color .15s ease;}
.footer-social a:hover{background:var(--ink);color:#fff;}
.footer-brand .footer-social a{background:rgba(255,255,255,.08);color:#b3bdcd;}
.footer-brand .footer-social a:hover{background:var(--gold);color:#2c2003;}
.footer-brand p{font-size:.88rem;max-width:34ch;color:#7f8ca2;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding:22px 0;display:flex;flex-wrap:wrap;
  justify-content:space-between;gap:14px;font-size:.82rem;color:#6d7a90;}
.footer-bottom .legal{display:flex;flex-wrap:wrap;gap:20px;}
.footer-bottom a{display:inline;padding:0;}
.footer .footer-contact-item{display:flex;align-items:flex-start;gap:10px;}
.footer-contact-item svg{flex-shrink:0;margin-top:2px;color:var(--gold);}
.footer-contact-item span{line-height:1.45;}

/* ---------- Floating WhatsApp -------------------------------------------- */
.wa{position:fixed;right:20px;bottom:20px;z-index:70;display:flex;flex-direction:column;align-items:flex-end;gap:10px;}
.wa-btn{width:54px;height:54px;border-radius:50%;background:#1faa55;color:#fff;display:flex;align-items:center;
  justify-content:center;box-shadow:0 12px 30px -10px rgba(31,170,85,.7);text-decoration:none;border:none;cursor:pointer;}
.wa-btn:hover{background:#178f46;}
.wa-menu{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-lg);
  width:250px;padding:8px;display:none;}
.wa-menu.is-open{display:block;}
.wa-menu a{display:block;padding:10px 12px;border-radius:var(--r-sm);text-decoration:none;color:var(--ink);font-size:.88rem;}
.wa-menu a:hover{background:#f4f6fa;}
.wa-menu .head{padding:8px 12px 10px;font-size:.78rem;color:var(--ink-faint);border-bottom:1px solid var(--line);margin-bottom:6px;}

/* ---------- Flash messages ------------------------------------------------ */
.flashes{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:90;width:min(560px,calc(100% - 32px));
  display:flex;flex-direction:column;gap:8px;}
.flash{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:var(--r);
  box-shadow:var(--shadow-lg);font-size:.91rem;background:var(--paper);border:1px solid var(--line);}
.flash--success{border-color:#bfe0d4;background:var(--verify-wash);color:#0f5f49;}
.flash--error{border-color:#efcfc6;background:var(--alert-wash);color:#8a3323;}
.flash button{margin-left:auto;background:none;border:none;cursor:pointer;color:inherit;opacity:.6;font-size:1rem;line-height:1;}
.flash button:hover{opacity:1;}

/* ---------- Utilities ----------------------------------------------------- */
.skip{position:absolute;left:-9999px;top:0;background:var(--gold);color:#2c2003;padding:12px 18px;z-index:200;
  border-radius:0 0 var(--r-sm) 0;font-weight:600;}
.skip:focus{left:0;}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px;}
.center{text-align:center;}
.mt-0{margin-top:0;}
.mt-3{margin-top:26px;}
.mt-4{margin-top:36px;}
.mb-3{margin-bottom:26px;}
.narrow{max-width:760px;}
.narrow-mid{max-width:920px;}
.badge-soft{display:inline-block;background:var(--gold-wash);color:var(--gold-deep);font-size:.76rem;font-weight:600;
  padding:4px 11px;border-radius:100px;}
.badge-soon{display:inline-block;background:#eef1f6;color:var(--ink-faint);font-size:.72rem;font-weight:600;
  padding:3px 9px;border-radius:100px;margin-left:8px;}
.status-dot{display:inline-flex;align-items:center;gap:7px;font-size:.85rem;font-weight:600;}
.status-dot::before{content:'';width:8px;height:8px;border-radius:50%;background:currentColor;}
.status-active{color:#17795e;}
.status-expired{color:#a3402c;}
.status-suspended{color:#8a6410;}
.status-none{color:var(--ink-faint);}

/* ---- Late additions ----------------------------------------------------- */

/* Visible only to screen readers. */
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

/* Destructive actions in the admin panel. */
.btn--danger{background:#a3402c;color:#fff;border-color:#a3402c;}
.btn--danger:hover{background:#8f3623;border-color:#8f3623;}

/* A feature the current plan does not include. */
.ticks li.off{color:var(--ink-faint);}
.ticks li.off::before{background:var(--line-strong);}

/* ---- Trusted clients & success stories — horizontal marquee ------------
   The scrolling itself is driven by assets/js/site.js, not CSS animation —
   it measures the real rendered content and clones just enough of it at
   runtime to scroll smoothly, however few or many items there are, and it
   explicitly checks prefers-reduced-motion before animating anything. If
   JavaScript is ever unavailable, this still degrades gracefully to a
   normal static row (each item appearing once, as rendered), never to a
   broken or duplicated-looking one. */
.marquee-viewport{overflow:hidden;width:100%;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);}
.marquee-viewport.is-static{overflow-x:auto;-webkit-mask-image:none;mask-image:none;}
.marquee-track{display:flex;align-items:center;width:max-content;will-change:transform;}
.marquee-item{flex-shrink:0;}

.partners-track{gap:56px;padding:6px 28px;}
.partner-item img{height:56px;width:auto;max-width:210px;object-fit:contain;filter:grayscale(1);opacity:.6;
  transition:opacity .2s ease,filter .2s ease;display:block;}
.partner-item:hover img{filter:grayscale(0);opacity:1;}

.story-track{gap:22px;padding:6px 28px;}
.story-card{width:230px;margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;box-shadow:var(--shadow);}
.story-card img{width:100%;height:160px;object-fit:cover;display:block;}
.story-card figcaption{padding:14px 16px 16px;}
.story-card .t{display:block;font-weight:650;font-size:.92rem;color:var(--ink);}
.story-card .d{display:block;font-size:.82rem;color:var(--ink-soft);margin-top:4px;line-height:1.45;}

@media (max-width:640px){
  .partner-item img{height:46px;}
  .story-card{width:190px;}
  .story-card img{height:130px;}
}

/* ---- Public gallery page ------------------------------------------------ */
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:22px;}
.gallery-card{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;box-shadow:var(--shadow);text-decoration:none;transition:transform .15s ease;}
.gallery-card:hover{transform:translateY(-3px);}
.gallery-card img{width:100%;height:180px;object-fit:cover;display:block;}
.gallery-card-body{padding:14px 16px 16px;}
.gallery-card-body .t{display:block;font-weight:650;font-size:.92rem;color:var(--ink);}
.gallery-card-body .d{display:block;font-size:.82rem;color:var(--ink-soft);margin-top:4px;line-height:1.45;}
