/* =====================================================================
   DOMAIN LANDER  ::  design system  ("Broker")
   ---------------------------------------------------------------------
   Clean, bright, commercial. White ground, one confident blue, generous
   whitespace, Manrope throughout. Hand-authored rather than generated at
   runtime by the Tailwind CDN, because the Play CDN builds its
   stylesheet AFTER first paint and every lander would flash unstyled.

   COMMITTED TO LIGHT. This is a sales page, not an app; the design is
   one considered look rather than two. Every colour is painted
   explicitly so the page holds on any host background.

   TIER ACCENT
   Blue means "you can buy this right now". Gold means "this one is
   negotiated". The switch is a single class on <html>, so one variable
   changes and the whole page follows:
       <html class="t-buy">    Low + Medium
       <html class="t-offer">  Premium + Ultra-Premium
   ================================================================== */

:root{
  --bg:#ffffff;
  --tint:#f4f7fa;          /* alternating section band              */
  --tint2:#eaf0f6;
  --line:#e0e7ee;
  --line2:#cdd8e3;

  --ink:#0d1a26;
  --ink2:#334455;
  --muted:#61728a;
  --faint:#8c9bad;

  --accent:#0b5fd9;        /* the one confident blue                */
  --accent-dk:#0847a8;
  --accent-wash:#eaf2ff;
  --accent-shadow:rgba(11,95,217,.75);

  --ok:#0e9f6e;
  --ok-wash:#e8f7f1;
  --warn:#b45309;
  --warn-wash:#fdf6e3;

  --r:12px;
  --r-sm:9px;
  --shadow:0 1px 2px rgba(13,26,38,.06), 0 12px 28px -18px rgba(13,26,38,.30);
  --shadow-lift:0 2px 4px rgba(13,26,38,.07), 0 20px 44px -22px rgba(13,26,38,.40);

  --font:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  --ease:cubic-bezier(.2,.7,.3,1);
  --maxw:1080px;
  --gut:clamp(18px,4vw,28px);
  color-scheme:light;
}

/* Premium + Ultra-Premium: gold replaces blue everywhere at once. */
:root.t-offer{
  --accent:#a16207;
  --accent-dk:#854d0e;
  --accent-wash:#fdf6e3;
  --accent-shadow:rgba(161,98,7,.70);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale}
img,svg{display:block;max-width:100%}
::selection{background:var(--accent);color:#fff}
a{color:var(--accent);text-underline-offset:3px}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut)}
.tnum{font-variant-numeric:tabular-nums}
.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}

/* =====================================================================
   1. "THIS IS FOR SALE"
   ---------------------------------------------------------------------
   A visitor typed this domain expecting a website. Two signals fire
   before they read any body copy, and the second one never scrolls
   away.
   ================================================================== */
.saleband{background:var(--accent);color:#fff}
.saleband .wrap{display:flex;align-items:center;justify-content:center;gap:8px 18px;
  flex-wrap:nowrap;min-height:46px;padding-top:10px;padding-bottom:10px;text-align:center}
.saleband .msg{display:inline-flex;align-items:center;gap:10px;
  font-size:14.5px;font-weight:700;letter-spacing:-.012em;white-space:nowrap}
.saleband .pulse{width:8px;height:8px;border-radius:50%;background:#fff;flex:none;
  box-shadow:0 0 0 0 rgba(255,255,255,.7);animation:pls 2.6s ease-out infinite}
@keyframes pls{
  0%{box-shadow:0 0 0 0 rgba(255,255,255,.65)}
  70%{box-shadow:0 0 0 8px rgba(255,255,255,0)}
  100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}
}
.saleband .sub{font-size:13.5px;color:rgba(255,255,255,.82)}
.saleband a{color:#fff;font-weight:700;text-decoration:none;
  border-bottom:1.5px solid rgba(255,255,255,.5);padding-bottom:1px;transition:border-color .18s}
.saleband a:hover{border-color:#fff}
/* the secondary clause is the first thing to go, early enough that the
   two halves never stack into an awkward two-line band */
@media(max-width:980px){.saleband .sub{display:none}}

/* =====================================================================
   2. HEADER  (sticky - carries the claim and the price at all times)
   ================================================================== */
.hdr{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.92);
  backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.hdr .wrap{display:flex;align-items:center;justify-content:space-between;height:64px;gap:16px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:15px;
  letter-spacing:-.022em;color:var(--ink);text-decoration:none}
.brand .sq{width:26px;height:26px;flex:none;border-radius:7px;background:var(--accent);
  color:#fff;display:grid;place-items:center;font-size:11px;font-weight:800;font-style:normal}
.hdr .right{display:flex;align-items:center;gap:14px}
.forsale{display:inline-flex;align-items:center;gap:7px;background:var(--accent);color:#fff;
  font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  padding:6px 13px;border-radius:100px;white-space:nowrap}
.forsale .d{width:6px;height:6px;border-radius:50%;background:#fff}
.hprice{font-size:17px;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.btn-mini{display:inline-flex;align-items:center;gap:8px;background:var(--ink);color:#fff;
  font-family:inherit;font-size:14px;font-weight:700;padding:10px 18px;border-radius:var(--r-sm);
  text-decoration:none;transition:transform .12s var(--ease),opacity .16s}
.btn-mini:hover{transform:translateY(-1px);opacity:.9}
.btn-mini svg{width:14px;height:14px;flex:none}
@media(max-width:780px){.hprice,.btn-mini{display:none}}
@media(max-width:430px){.brand .nm{display:none}}

/* =====================================================================
   3. HERO
   ================================================================== */
.hero{padding:52px 0 44px}
.hero .grid{display:grid;grid-template-columns:minmax(0,1fr) 358px;gap:44px;align-items:start}
@media(max-width:900px){.hero .grid{grid-template-columns:1fr;gap:28px}}

.kicker{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:var(--accent);margin:0 0 14px}

h1.domain{font-size:clamp(36px,6.2vw,58px);font-weight:800;letter-spacing:-.038em;
  line-height:1.04;margin:0 0 18px;word-break:break-word;text-wrap:balance}
h1.domain .tld{color:var(--muted);font-weight:600}
.copybtn{margin-left:12px;width:32px;height:32px;flex:none;vertical-align:middle;
  border:1px solid var(--line2);border-radius:var(--r-sm);background:var(--bg);
  color:var(--muted);display:inline-grid;place-items:center;cursor:pointer;
  transition:color .16s,border-color .16s,transform .16s var(--ease)}
.copybtn:hover{color:var(--accent);border-color:var(--accent);transform:translateY(-1px)}
.copybtn svg{width:14px;height:14px}

.lede{font-size:18px;color:var(--ink2);max-width:46ch;margin:0 0 26px;line-height:1.6}

.points{display:grid;gap:11px;margin:0;padding:0;list-style:none}
.points li{display:flex;gap:11px;align-items:flex-start;font-size:15px;color:var(--ink2)}
.points svg{width:19px;height:19px;flex:none;margin-top:3px;color:var(--ok)}
.points strong{color:var(--ink);font-weight:800}

/* =====================================================================
   4. BUY PANEL
   ================================================================== */
.buy{border:1px solid var(--line);border-radius:16px;background:var(--bg);
  box-shadow:var(--shadow);padding:26px;position:sticky;top:88px}
@media(max-width:900px){.buy{position:static}}
.buy .lbl{font-size:12px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;
  color:var(--muted)}
.buy .price{font-size:44px;font-weight:800;letter-spacing:-.042em;line-height:1;
  margin:6px 0 4px;font-variant-numeric:tabular-nums}
.buy .price.gold{color:var(--accent)}
.buy .sub{font-size:14px;color:var(--muted);margin:0 0 20px}
.buy .sub b{color:var(--ink2);font-weight:700}
.buy .headline{font-size:20px;font-weight:800;letter-spacing:-.026em;line-height:1.3;margin:4px 0 8px}

.btn{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;
  font-family:inherit;font-size:15.5px;font-weight:800;letter-spacing:-.012em;
  padding:15px 20px;border-radius:var(--r-sm);border:1px solid transparent;cursor:pointer;
  text-decoration:none;transition:background .16s,border-color .16s,
  transform .12s var(--ease),box-shadow .18s}
.btn svg{width:17px;height:17px;flex:none;transition:transform .22s var(--ease)}
.btn-primary{background:var(--accent);color:#fff;box-shadow:0 8px 18px -10px var(--accent-shadow)}
.btn-primary:hover{background:var(--accent-dk);transform:translateY(-1px);
  box-shadow:0 12px 24px -10px var(--accent-shadow)}
.btn-primary:hover svg{transform:translateX(3px)}
.btn-primary:active{transform:translateY(0)}
.btn-ghost{background:var(--bg);color:var(--ink);border-color:var(--line2);margin-top:10px}
.btn-ghost:hover{border-color:var(--ink2);background:var(--tint)}
.btn-ink{background:var(--ink);color:#fff}
.btn-ink:hover{transform:translateY(-1px)}
.btn-wide{width:100%}

.buy .sep{display:flex;align-items:center;gap:12px;margin:20px 0 14px;
  color:var(--muted);font-size:12.5px;font-weight:600}
.buy .sep::before,.buy .sep::after{content:"";flex:1;height:1px;background:var(--line)}
.mini{display:flex;align-items:flex-start;gap:9px;font-size:13px;color:var(--muted);padding:6px 0;
  line-height:1.5}
.mini svg{width:16px;height:16px;color:var(--ok);flex:none;margin-top:2px}

/* evidence rows - facts a buyer can check, not badges */
.evi{margin:18px 0 0;padding:16px 0 0;border-top:1px solid var(--line)}
.evi .h{font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;
  color:var(--faint);margin:0 0 11px}
.evi dl{margin:0;display:grid;gap:8px}
.evi .row{display:flex;align-items:baseline;justify-content:space-between;gap:14px}
.evi dt{font-size:13.5px;color:var(--muted);margin:0}
.evi dd{margin:0;font-size:13.5px;font-weight:700;color:var(--ink2);text-align:right}
.evi dd .ok{color:var(--ok)}
.evi .foot{font-size:12.5px;color:var(--faint);line-height:1.55;margin:14px 0 0;
  padding-top:13px;border-top:1px solid var(--line)}

/* =====================================================================
   5. SECTIONS
   ================================================================== */
section{padding:56px 0;border-top:1px solid var(--line)}
section.tint{background:var(--tint)}
.head{max-width:58ch;margin:0 0 30px}
h2{font-size:clamp(23px,3.2vw,31px);font-weight:800;letter-spacing:-.03em;
  line-height:1.14;margin:0 0 9px;text-wrap:balance}
.head p{margin:0;color:var(--muted);font-size:16.5px}

/* =====================================================================
   6. CHECKOUT ROUTES
   ================================================================== */
.routes{display:grid;grid-template-columns:repeat(auto-fit,minmax(272px,1fr));gap:14px}
.route{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:22px;
  display:flex;flex-direction:column;text-decoration:none;color:inherit;
  transition:border-color .16s,transform .16s var(--ease),box-shadow .18s}
.route:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:var(--shadow-lift)}
.route.best{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-wash)}
.route .top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.route .nm{font-size:17px;font-weight:800;letter-spacing:-.024em}
.route .flag{font-size:10.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;
  background:var(--accent);color:#fff;padding:4px 9px;border-radius:100px;white-space:nowrap}
.route p{margin:0 0 14px;font-size:14px;color:var(--muted);line-height:1.55;flex:1}
.pays{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 16px;padding:0;list-style:none}
.pays li{font-size:10.5px;font-weight:700;letter-spacing:.04em;color:var(--muted);
  border:1px solid var(--line);border-radius:5px;padding:3px 8px;background:var(--tint)}
.route .go{display:flex;align-items:center;justify-content:space-between;
  font-size:14.5px;font-weight:800;color:var(--accent)}
.route .go svg{width:17px;height:17px;transition:transform .2s var(--ease)}
.route:hover .go svg{transform:translateX(4px)}

/* =====================================================================
   7. STEPS
   ================================================================== */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:26px}
.step .n{width:32px;height:32px;border-radius:var(--r-sm);background:var(--accent-wash);
  color:var(--accent);display:grid;place-items:center;font-weight:800;font-size:14px;
  margin-bottom:13px}
.step .when{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:var(--accent);margin-bottom:8px}
.step h3{font-size:16.5px;font-weight:800;letter-spacing:-.022em;margin:0 0 6px}
.step p{margin:0;font-size:14.5px;color:var(--muted);line-height:1.6}

/* =====================================================================
   8. VALUE CARDS
   ================================================================== */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.card{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:22px;
  transition:border-color .16s,transform .16s var(--ease)}
.card:hover{border-color:var(--line2);transform:translateY(-2px)}
.card .k{font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;
  color:var(--accent);margin-bottom:9px}
.card h3{font-size:16.5px;font-weight:800;letter-spacing:-.022em;margin:0 0 6px}
.card p{margin:0;font-size:14px;color:var(--muted);line-height:1.6}

/* =====================================================================
   9. OFFER FORM
   ================================================================== */
.form{background:var(--bg);border:1px solid var(--line);border-radius:16px;
  padding:clamp(22px,3.4vw,32px);max-width:660px;box-shadow:var(--shadow)}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:560px){.fields{grid-template-columns:1fr}}
.f{display:flex;flex-direction:column;gap:7px;min-width:0}
.f.full{grid-column:1/-1}
.f label{font-size:13px;font-weight:800;color:var(--ink2);display:flex;gap:8px;align-items:baseline}
.f label .opt{font-weight:500;color:var(--faint);font-size:12.5px}
.f input,.f textarea,.f select{width:100%;font-family:inherit;font-size:15px;color:var(--ink);
  background:var(--bg);border:1px solid var(--line2);border-radius:var(--r-sm);
  padding:12px 14px;transition:border-color .15s,box-shadow .15s}
.f textarea{min-height:100px;resize:vertical;line-height:1.6}
.f input:focus,.f textarea:focus,.f select:focus{outline:none;border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-wash)}
.f input::placeholder,.f textarea::placeholder{color:var(--faint)}
.f.amt{position:relative}
.f.amt input{padding-left:32px;font-weight:800;font-variant-numeric:tabular-nums}
.f.amt .cur{position:absolute;left:13px;bottom:12px;color:var(--muted);font-weight:800;
  pointer-events:none}
.f .err{font-size:12.5px;color:#b91c1c;font-weight:700}
.f input[aria-invalid="true"],.f textarea[aria-invalid="true"]{border-color:#b91c1c}

/* the honeypot: off-screen rather than display:none - some bots skip
   hidden fields but happily fill anything positioned away */
.hp{position:absolute!important;left:-9999px!important;top:auto!important;
  width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important}

.floor{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--ink2);
  padding:13px 15px;margin:18px 0;border-radius:var(--r-sm);
  border:1px solid var(--line);border-left:3px solid var(--accent);background:var(--accent-wash)}
.floor b{color:var(--accent);font-weight:800;font-variant-numeric:tabular-nums}
.floor svg{width:16px;height:16px;flex:none;margin-top:2px;color:var(--accent)}

.note{display:flex;gap:9px;font-size:13.5px;color:var(--muted);margin:18px 0 0;line-height:1.55}
.note svg{width:17px;height:17px;flex:none;margin-top:2px;color:var(--ok)}

.alert{display:flex;gap:11px;align-items:flex-start;padding:14px 16px;margin-bottom:20px;
  border-radius:var(--r-sm);border:1px solid #fca5a5;background:#fef2f2;color:#7f1d1d;font-size:14px}
.alert.ok{border-color:var(--ok);background:var(--ok-wash);color:#065f46}
.alert svg{width:17px;height:17px;flex:none;margin-top:2px}
.alert ul{margin:6px 0 0;padding-left:18px}

/* =====================================================================
   10. FAQ
   ================================================================== */
.faq{max-width:740px}
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:18px 0;display:flex;gap:20px;
  justify-content:space-between;align-items:center;font-size:16px;font-weight:800;
  letter-spacing:-.02em;transition:color .16s}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--accent)}
.faq .pm{width:18px;height:18px;flex:none;position:relative}
.faq .pm::before,.faq .pm::after{content:"";position:absolute;background:var(--muted);
  transition:transform .24s var(--ease),opacity .2s}
.faq .pm::before{left:0;top:8px;width:18px;height:2px}
.faq .pm::after{left:8px;top:0;width:2px;height:18px}
.faq details[open] .pm::after{transform:rotate(90deg);opacity:0}
.faq .a{padding:0 0 18px;color:var(--muted);font-size:15px;line-height:1.72;max-width:64ch}
.faq .a p{margin:0 0 11px}
.faq .a p:last-child{margin:0}

/* =====================================================================
   11. FOOTER
   ================================================================== */
footer{border-top:1px solid var(--line);background:var(--tint);
  padding:32px 0 44px;color:var(--muted);font-size:13.5px}
footer .row{display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;
  align-items:center;margin-bottom:14px}
footer .row .b{color:var(--ink);font-weight:800;font-size:15px;letter-spacing:-.02em}
footer .dn{font-weight:700;color:var(--ink2)}
footer p{margin:0;max-width:74ch;line-height:1.7;font-size:12.5px}
footer strong{color:var(--ink2);font-weight:800}

/* =====================================================================
   12. MOBILE STICKY BAR
   The buy panel scrolls away on a phone, so price + action are pinned.
   ================================================================== */
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:none;
  align-items:center;justify-content:space-between;gap:14px;
  padding:11px 18px calc(11px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.95);backdrop-filter:blur(14px);border-top:1px solid var(--line2)}
.mbar .p{font-size:20px;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mbar .p.words{font-size:15px;letter-spacing:-.02em}
.mbar .btn{width:auto;padding:12px 24px;font-size:15px}
@media(max-width:900px){.mbar{display:flex}body{padding-bottom:74px}}

/* =====================================================================
   13. CENTRED PAGES  (maintenance / not found / sold / thank you)
   ================================================================== */
.centre{min-height:100vh;min-height:100svh;display:grid;place-items:center;
  padding:40px var(--gut);text-align:center;background:var(--bg)}
.centre .inner{max-width:560px}
.centre .glyph{width:56px;height:56px;margin:0 auto 20px;display:grid;place-items:center;
  border-radius:50%;background:var(--accent-wash);color:var(--accent)}
.centre .glyph svg{width:24px;height:24px}
.centre h1{font-size:clamp(26px,4.6vw,36px);font-weight:800;letter-spacing:-.032em;
  line-height:1.12;margin:0 0 12px;text-wrap:balance}
.centre p{color:var(--muted);font-size:16px;margin:0 0 12px}
.centre .actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:24px}
.centre .actions .btn{width:auto;padding:13px 24px}
.centre .panel{border:1px solid var(--line);border-radius:var(--r);background:var(--tint);
  padding:20px 22px;margin-top:26px;text-align:left}
.centre .panel .k{font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;
  color:var(--muted);margin-bottom:9px}
.centre .panel p{font-size:14px;color:var(--ink2);margin:0;line-height:1.7}
.centre .meta{font-size:12.5px;color:var(--faint);margin-top:22px;font-variant-numeric:tabular-nums}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
}
@media print{
  .saleband,.hdr,.mbar,.btn{display:none!important}
  body{background:#fff;color:#000}
}