/* =========================================================
   AdsLogic — BASE
   Design tokens, reset, typography, buttons, forms, utilities
   Theme rule: black + white carry the layout, orange is the
   highlight colour only (CTAs, key words, numbers, icons).
   ========================================================= */
:root{
  /* brand */
  --brand:#F75A0C;          /* logo orange */
  --brand-2:#FF7A33;
  --brand-deep:#C2410C;     /* orange text on white (AA) */
  --brand-soft:#FFF1E8;
  --brand-glow:rgba(247,90,12,.35);

  /* neutrals */
  --black:#0A0A0B;
  --black-2:#111113;
  --black-3:#18181B;
  --black-4:#232327;
  --white:#FFFFFF;
  --paper:#F5F4F1;          /* light section */
  --paper-2:#EDEBE7;
  --ink:#0A0A0B;
  --ink-2:#2B2B30;
  --muted:#5E6068;
  --line:#E6E3DE;
  --line-2:#D6D2CB;
  --on-dark:#FFFFFF;
  --on-dark-2:rgba(255,255,255,.68);
  --on-dark-3:rgba(255,255,255,.45);
  --dark-line:rgba(255,255,255,.1);

  /* status */
  --ok:#15803D; --ok-soft:#E8F6EC; --warn:#8A3B00; --warn-soft:#FFF0BF; --err:#B91C1C; --err-soft:#FDECEC;

  /* shape + motion */
  --r-sm:10px; --r-md:16px; --r-lg:24px; --r-xl:32px;
  --shadow:0 1px 2px rgba(10,10,11,.05),0 18px 40px -22px rgba(10,10,11,.28);
  --shadow-lg:0 40px 80px -40px rgba(10,10,11,.45);
  --ease:cubic-bezier(.2,.7,.2,1);
  --font:"Plus Jakarta Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --head-h:66px;
  color-scheme:light;
}
@property --p{syntax:"<number>";inherits:false;initial-value:0}

*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:calc(var(--head-h) + 28px);-webkit-text-size-adjust:100%}
@supports (overflow:clip){html{overflow-x:clip}}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
@supports (overflow:clip){body{overflow-x:clip}}
img,svg,video{max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--brand);outline-offset:3px;border-radius:8px}
::selection{background:var(--brand);color:var(--black)}

.wrap{max-width:1240px;margin:0 auto;padding:0 28px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:16px;top:-60px;z-index:200;background:var(--black);color:#fff;padding:12px 18px;border-radius:12px;font-weight:700;text-decoration:none;transition:top .2s}
.skip:focus{top:12px}

/* typography */
h1,h2,h3,h4{margin:0;line-height:1.08;letter-spacing:-.03em;font-weight:800;color:inherit}
h1{font-size:clamp(2.3rem,5.2vw,4.3rem);letter-spacing:-.045em;line-height:1.02}
h2{font-size:clamp(1.9rem,3.6vw,3rem);letter-spacing:-.04em}
h3{font-size:1.22rem;letter-spacing:-.015em;font-weight:700;line-height:1.25}
p{margin:0}
.lead{font-size:1.14rem;color:var(--muted);max-width:60ch}
.muted{color:var(--muted)}
.small{font-size:.9rem}
.hl{color:var(--brand)}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:.8rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-deep);margin-bottom:16px}
.eyebrow::before{content:"";width:22px;height:2px;border-radius:2px;background:var(--brand)}
.dark .eyebrow,.eyebrow.on-dark{color:var(--brand-2)}

/* tags */
.tag{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;font-weight:700;padding:5px 11px;border-radius:999px;background:var(--brand-soft);color:var(--brand-deep);white-space:nowrap;line-height:1.4}
.tag.demo{background:var(--warn-soft);color:var(--warn)}
.tag.off{background:#F1EFEC;color:#4B4640}
.tag.ok{background:var(--ok-soft);color:var(--ok)}
.tag.err{background:var(--err-soft);color:var(--err)}
.tag.dark{background:var(--black);color:#fff}
.tag .dot{width:7px;height:7px;border-radius:50%;background:currentColor}

/* ============ buttons ============ */
.btn{--tx:0px;--ty:0px;position:relative;z-index:0;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border-radius:999px;font-weight:700;font-size:.98rem;text-decoration:none;border:1.5px solid transparent;transform:translate(var(--tx),var(--ty));transition:transform .25s var(--ease),color .3s,border-color .3s,box-shadow .3s,background .3s;white-space:nowrap;cursor:pointer}
.btn::before{content:"";position:absolute;inset:-1px;z-index:-1;background:var(--sweep,var(--black));transform:translateY(102%);transition:transform .45s var(--ease);border-radius:inherit}
.btn:hover::before,.btn:focus-visible::before{transform:none}
.btn svg{width:19px;height:19px;flex:none;transition:transform .3s var(--ease)}
.btn:hover svg.arr{transform:translateX(4px)}
.btn:active{transform:translate(var(--tx),var(--ty)) scale(.97)}
.btn-primary{background:var(--brand);color:var(--black);box-shadow:0 14px 30px -14px var(--brand-glow)}
.btn-primary:hover,.btn-primary:focus-visible{color:#fff}
.btn-dark{background:var(--black);color:#fff;--sweep:var(--brand)}
.btn-dark:hover,.btn-dark:focus-visible{color:var(--black)}
.btn-line{background:transparent;border-color:var(--ink);color:var(--ink);--sweep:var(--ink)}
.btn-line:hover,.btn-line:focus-visible{color:#fff}
.btn-ghost{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.28);color:#fff;--sweep:#fff}
.btn-ghost:hover,.btn-ghost:focus-visible{color:var(--black)}
.btn-wa{background:#15803D;color:#fff;--sweep:var(--black)}
.btn-sm{min-height:42px;padding:0 18px;font-size:.92rem}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.btn-row{display:flex;flex-wrap:wrap;gap:12px}
.link{position:relative;display:inline-flex;align-items:center;gap:8px;color:var(--brand-deep);font-weight:700;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 2px no-repeat;padding-bottom:2px;transition:background-size .35s var(--ease),color .2s}
.link:hover{background-size:0 2px;background-position:100% 100%;color:var(--ink)}
.dark .link{color:var(--brand-2)}
.dark .link:hover{color:#fff}
.link svg{width:18px;height:18px;flex:none}

/* ============ forms ============ */
label{display:block;font-weight:700;font-size:.94rem;margin-bottom:6px}
label .opt{font-weight:500;color:var(--muted)}
input,select,textarea{width:100%;font:inherit;font-size:1rem;color:var(--ink);background:#fff;border:1.5px solid var(--line-2);border-radius:14px;padding:13px 15px;min-height:52px;transition:border-color .2s,box-shadow .2s}
textarea{min-height:140px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 4px rgba(247,90,12,.16)}
.field{margin-bottom:18px}
.field .err{display:none;color:var(--err);font-size:.88rem;margin-top:6px;font-weight:600}
.field.bad input,.field.bad select,.field.bad textarea{border-color:var(--err)}
.field.bad .err{display:block}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
.radios{display:flex;flex-wrap:wrap;gap:8px}
.radios label{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--line-2);border-radius:999px;padding:9px 16px;font-weight:700;margin:0;cursor:pointer;transition:border-color .2s,background .2s}
.radios label:hover{border-color:var(--ink)}
.radios label:has(input:checked){border-color:var(--black);background:var(--black);color:#fff}
.radios input{width:auto;min-height:0;accent-color:var(--brand)}
.hp{position:absolute;left:-9999px}

/* scroll reveal (class removed by JS after it finishes) */
.sw .w{display:inline-block;overflow:hidden;vertical-align:top;padding:.06em 0 .16em;margin:-.06em 0 -.16em}
.sw .wi{display:inline-block;transform:translateY(118%);transition:transform .85s var(--ease);transition-delay:calc(var(--i)*55ms)}
.sw.in .wi{transform:none}
.js .rv{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0ms)}
.js .rv.in{opacity:1;transform:none}
.page-in{animation:pagein .55s var(--ease)}
@keyframes pagein{from{opacity:0;transform:translateY(12px)}}
@keyframes fadein{from{opacity:0}}
@keyframes floaty{0%,100%{translate:0 0}50%{translate:0 -10px}}
@keyframes ripple{0%{transform:scale(1);opacity:.7}100%{transform:scale(2.2);opacity:0}}
@keyframes cmin{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
@keyframes bl{50%{opacity:.25}}

.typing{display:inline-flex;gap:4px;padding:4px 0}
.typing i{width:7px;height:7px;border-radius:50%;background:#9AA0A6}
@media (prefers-reduced-motion:no-preference){.typing i{animation:bl 1s infinite}.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}}

/* Plain-text copy of each page for search engines and browsers without JavaScript.
   Hidden as soon as JavaScript runs (boot.js); the normal website replaces it. */
.js .ssr{display:none}
.ssr{padding:120px 0 64px;line-height:1.6}
.ssr h1{font-size:2rem;margin:12px 0 16px}
.ssr h2{font-size:1.35rem;margin:32px 0 10px}
.ssr h3{font-size:1.05rem;margin:16px 0 6px}
.ssr ul,.ssr ol{padding-left:20px}
.ssr a{text-decoration:underline}
.ssr img{max-width:100%;height:auto}
.foot .ssr{padding:40px 0}