/* ==========================================================================
   AdCoins — hand-written, standalone. build.js does not touch this.
   A rate card, not a brochure: warm paper, hairline rules, numbers in
   tabular figures, and one dark band under the pricing.
   Palette from the logo's yellow→orange→red ramp, taken at the orange.
   ========================================================================== */

:root{
  --paper:#FDFBF7;
  --card:#FFFFFF;
  --band:#17150F;
  --band-2:#221F17;

  --ink:#17150F;
  --dim:#5A5348;
  --faint:#8A8175;
  --line:#E6DFD2;
  --line-2:#D2C8B7;

  --accent:#E07A18;
  --accent-hi:#C4670F;
  --accent-soft:#FDF1DF;
  --hot:#FFC20E;

  --display:"Outfit",system-ui,-apple-system,sans-serif;
  --body:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;

  --gut:clamp(20px,5vw,60px);
  --maxw:1180px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--body);font-size:clamp(15.5px,1vw,17px);line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,p{margin:0}
ul{margin:0;padding:0;list-style:none}
a{color:inherit;text-decoration:none}
svg{display:block}
::selection{background:var(--accent);color:#fff}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gut)}
.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
.lbl{font-size:.6875rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}
.lbl--accent{color:var(--accent)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px;background:var(--accent);color:#fff;padding:12px 18px;z-index:100}
.skip:focus{left:0}

/* --- header ------------------------------------------------------------- */
.head{position:sticky;top:0;z-index:40;background:rgba(253,251,247,.9);
  backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.head__in{display:flex;align-items:center;justify-content:space-between;gap:20px;height:68px}
.brand{display:flex;align-items:center;gap:11px}
.brand__mark{height:30px;width:auto;flex:none}
.brand__wm{font-family:var(--display);font-weight:600;font-size:1.15rem;letter-spacing:-.02em}
.nav{display:flex;align-items:center;gap:clamp(16px,2.4vw,30px)}
.nav a{font-size:.875rem;color:var(--dim);transition:color .16s ease}
.nav a:hover{color:var(--accent)}
.nav .go{font-weight:600;color:var(--ink);border-bottom:2px solid var(--accent);padding-bottom:2px}
.nav .go:hover{color:var(--accent)}
@media (max-width:760px){.nav a:not(.go){display:none}}

/* --- hero --------------------------------------------------------------- */
.hero{border-bottom:1px solid var(--line)}
.hero__in{padding-block:clamp(56px,10vh,116px) clamp(40px,6vh,72px);
  display:flex;flex-direction:column;gap:clamp(20px,3vh,30px)}
.huge{font-family:var(--display);font-weight:700;
  font-size:clamp(2.2rem,6.6vw,5.2rem);line-height:1;letter-spacing:-.038em;
  max-width:16ch;text-wrap:balance}
.huge em{font-style:normal;color:var(--accent)}
.hero__sub{max-width:50ch;color:var(--dim);font-size:clamp(1.05rem,1.5vw,1.25rem)}
.hero__acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}

/* --- spec strip: numbers as a line of type, not tiles ------------------- */
.spec{border-bottom:1px solid var(--line);background:var(--card)}
.spec__in{display:flex;flex-wrap:wrap;gap:clamp(20px,4vw,56px);
  padding-block:clamp(22px,3.4vh,34px);align-items:baseline}
.spec div{display:flex;align-items:baseline;gap:10px}
.spec b{font-family:var(--display);font-weight:700;font-size:clamp(1.3rem,2.4vw,1.9rem);
  letter-spacing:-.03em;color:var(--ink)}
.spec span{font-size:.875rem;color:var(--faint)}

/* --- sections ----------------------------------------------------------- */
.sec{padding-block:clamp(48px,7.5vh,100px);border-bottom:1px solid var(--line)}
.sec__head{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:clamp(22px,3.4vh,38px)}
.sec__head h2{font-family:var(--display);font-weight:700;
  font-size:clamp(1.5rem,3.4vw,2.5rem);letter-spacing:-.034em;line-height:1.02}
.sec__note{color:var(--dim);max-width:56ch;margin-bottom:clamp(22px,3.4vh,36px)}

/* --- buttons ------------------------------------------------------------ */
.btn{display:inline-flex;align-items:center;gap:9px;padding:14px 24px;border-radius:3px;
  font-size:.9375rem;font-weight:600;cursor:pointer;border:1px solid transparent;
  transition:background .16s ease,color .16s ease,border-color .16s ease}
.btn--go{background:var(--accent);color:#fff}
.btn--go:hover{background:var(--accent-hi)}
.btn--ghost{border-color:var(--line-2);color:var(--ink)}
.btn--ghost:hover{border-color:var(--accent);color:var(--accent)}
.band .btn--ghost{border-color:rgba(255,255,255,.28);color:#fff}
.band .btn--ghost:hover{border-color:var(--hot);color:var(--hot)}

/* --- numbered steps: a real sequence ------------------------------------ */
.steps{counter-reset:s;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;background:var(--line);border:1px solid var(--line)}
@media (max-width:900px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}
.step{background:var(--card);padding:24px 22px 26px;counter-increment:s}
.step::before{content:counter(s,decimal-leading-zero);font-family:var(--display);
  font-weight:700;font-size:.8125rem;color:var(--accent);display:block;margin-bottom:14px;
  font-variant-numeric:tabular-nums}
.step h3{font-family:var(--display);font-weight:600;font-size:1.02rem;letter-spacing:-.02em}
.step p{margin-top:9px;color:var(--dim);font-size:.9375rem;line-height:1.55}

/* --- hairline product rows ---------------------------------------------- */
.rows{border-top:1px solid var(--line)}
.row{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,9fr) minmax(0,4fr);
  gap:clamp(12px,2.6vw,36px);align-items:start;
  padding-block:clamp(18px,2.6vh,28px);border-bottom:1px solid var(--line);
  transition:background .18s ease}
.row:hover{background:var(--card)}
.row h3{font-family:var(--display);font-weight:600;
  font-size:clamp(1.05rem,1.9vw,1.35rem);letter-spacing:-.025em;line-height:1.2}
.row p{color:var(--dim);font-size:.9375rem;line-height:1.55}
.row .min{font-family:var(--display);font-weight:600;font-size:.9375rem;
  color:var(--accent);white-space:nowrap;font-variant-numeric:tabular-nums}
.row .min small{display:block;font-family:var(--body);font-weight:400;
  font-size:.75rem;color:var(--faint);letter-spacing:.02em;margin-top:3px}
@media (max-width:820px){
  .row{grid-template-columns:1fr;gap:8px}
  .row .min{margin-top:6px}
}

/* --- the rate card: dark band, the centrepiece -------------------------- */
.band{background:var(--band);color:#fff;border-bottom:1px solid var(--band)}
.band .sec__head h2{color:#fff}
.band .sec__note{color:rgba(255,255,255,.62)}
.band .lbl{color:var(--hot)}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid rgba(255,255,255,.14)}
table{width:100%;border-collapse:collapse;min-width:560px;font-variant-numeric:tabular-nums}
caption{text-align:left;padding:0 0 14px;color:rgba(255,255,255,.55);font-size:.8125rem}
th,td{text-align:left;padding:16px 20px;border-bottom:1px solid rgba(255,255,255,.12)}
thead th{font-size:.6875rem;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(255,255,255,.5);font-weight:700;background:var(--band-2)}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:rgba(255,255,255,.04)}
td:first-child{font-family:var(--display);font-weight:600;font-size:1.02rem}
td.imp{font-family:var(--display);font-weight:600;color:var(--hot);font-size:1.02rem}
td.small{color:rgba(255,255,255,.62);font-size:.9375rem}
.band .fineprint{margin-top:18px;color:rgba(255,255,255,.5);font-size:.8125rem;max-width:70ch}

/* --- plain wrapped list ------------------------------------------------- */
.plain{display:flex;flex-wrap:wrap;gap:6px 0;font-family:var(--display);
  font-weight:600;font-size:clamp(1.05rem,2.3vw,1.7rem);letter-spacing:-.028em;line-height:1.3}
.plain li:not(:last-child)::after{content:"\00a0·\00a0";color:var(--accent)}

/* --- two-up partner blocks ---------------------------------------------- */
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line)}
@media (max-width:760px){.two{grid-template-columns:1fr}}
.two > div{background:var(--card);padding:clamp(24px,3vw,34px)}
.two h3{font-family:var(--display);font-weight:600;
  font-size:clamp(1.1rem,2vw,1.4rem);letter-spacing:-.025em;margin-top:14px}
.two p{margin-top:11px;color:var(--dim);font-size:.9375rem}
.two a{display:inline-block;margin-top:16px;font-weight:600;color:var(--accent);
  border-bottom:1px solid currentColor;font-size:.9375rem}

/* --- contact ------------------------------------------------------------ */
.contact{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:clamp(28px,5vw,68px);align-items:start}
@media (max-width:820px){.contact{grid-template-columns:1fr}}
.contact h2{font-family:var(--display);font-weight:700;
  font-size:clamp(1.6rem,3.4vw,2.4rem);letter-spacing:-.034em;line-height:1.04;max-width:15ch}
.contact__note{color:var(--dim);margin-top:14px;max-width:42ch}
.mailto{display:inline-block;margin-top:22px;font-family:var(--display);font-weight:600;
  font-size:clamp(1.05rem,2vw,1.3rem);border-bottom:2px solid var(--accent);padding-bottom:2px}
.mailto:hover{color:var(--accent)}
.form{display:grid;gap:15px}
.field{display:grid;gap:6px}
.field label{font-size:.6875rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.field input,.field textarea,.field select{width:100%;font:inherit;font-size:.9375rem;
  color:var(--ink);background:var(--card);border:1px solid var(--line-2);border-radius:3px;
  padding:12px 14px;transition:border-color .16s ease}
.field textarea{min-height:110px;resize:vertical}
.field input:focus,.field textarea:focus,.field select:focus{outline:0;border-color:var(--accent)}
.field--row{display:grid;grid-template-columns:1fr 1fr;gap:15px}
@media (max-width:560px){.field--row{grid-template-columns:1fr}}
.form__note{font-size:.8125rem;color:var(--faint)}
.form__status{font-size:.9375rem;padding:12px 14px;border-radius:3px;display:none}
.form__status.is-ok{display:block;background:var(--accent-soft);color:var(--accent-hi)}
.form__status.is-err{display:block;background:#FDECEC;color:#96201F}

/* --- footer ------------------------------------------------------------- */
.foot{padding-block:28px 38px;display:flex;flex-wrap:wrap;gap:12px 28px;
  justify-content:space-between;align-items:center;color:var(--faint);font-size:.8125rem}
.foot a:hover{color:var(--accent)}