/* Serallo v2 — compact, header-free purchase and licence flows.
   Foundation/components remain in styles.css. These scoped rules replace the v1 layouts. */
:root {
    --canvas:#f8faff;
    --ink:#14213d;
    --muted:#6b7690;
    --line:#e2e8f2;
    --radius:22px;
    --shadow:0 16px 48px -24px rgba(38,61,117,.20);
}
body { font-size:14px; }
.wrap { width:min(1160px,calc(100% - 64px)); }
button,input,select,textarea { font-family:inherit; }
.button { min-height:48px; border-radius:12px; font-size:13px; font-weight:650; gap:10px; transition:background .18s,box-shadow .18s,transform .18s,border-color .18s; }
.button:hover { transform:translateY(-1px); }
.button:active { transform:translateY(0) scale(.985); }
.button .icon { width:18px;height:18px;transition:transform .2s; }
.button:hover .icon:last-child { transform:translateX(2px); }
.button-small { min-height:38px; font-size:12px; }
.button-primary { box-shadow:0 4px 9px rgba(36,88,237,.12); }
.button-lease { color:white;background:#203765;border:1px solid #203765;box-shadow:0 4px 9px rgba(32,55,101,.1); }
.button-lease:hover { background:#172b53;border-color:#172b53; }
.text-link { font-size:12px;gap:6px; }
.pill { font-size:10px;font-weight:650;padding:5px 8px;line-height:1.2;letter-spacing:0;white-space:nowrap;border-radius:6px; }
.pill-neutral { color:#69758d;background:#f1f4f9; }
.card-heading { align-items:center;gap:12px;margin:0; }
.card-heading h2 { font-size:19px;line-height:1.18;letter-spacing:-.025em; }
.home-hero { display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:64px;padding:50px 0 48px;align-items:start; }
.hero-copy { padding-top:8px;min-width:0; }
.availability { font-size:12px;gap:8px;margin-bottom:22px; }
.domain-heading { margin:0 0 23px;font-size:clamp(42px,5.2vw,72px);line-height:1.03;letter-spacing:-.065em;overflow-wrap:anywhere; }
.domain-heading.long-domain { font-size:clamp(32px,4.2vw,58px); }
.hero-line { font-size:29px;line-height:1.21;max-width:430px;margin-bottom:15px;letter-spacing:-.04em; }
.hero-description { font-size:14px;line-height:1.8;max-width:405px;margin:0; }
.hero-assurances { display:flex;flex-wrap:wrap;gap:14px;margin-top:21px;font-size:10px; }
.hero-assurances .icon { width:15px;height:15px; }
.domain-preview { width:100%;max-width:415px;margin-top:38px;transform:rotate(-1deg);border-radius:16px;box-shadow:0 18px 40px -32px rgba(32,55,101,.45);transition:transform .35s; }
.domain-preview:hover { transform:rotate(0deg) translateY(-2px); }
.preview-content { padding:26px 24px;min-height:157px; }
.preview-content p { font-size:23px;line-height:1.5; }
.preview-mark { width:43px;height:43px;right:24px;top:29px; }
.preview-address { margin-top:24px;font-size:10px; }
.hero-contact { margin-top:28px;font-size:11px;color:var(--muted); }
.hero-contact .text-link { margin-left:3px; }
.purchase-stack { gap:15px;min-width:0; }
.purchase-panel { overflow:hidden;background:white;border:1px solid #dce3f4;border-radius:24px;box-shadow:0 14px 40px -25px rgba(42,67,127,.3); }
.buy-option { padding:23px 25px 17px; }
.cash-price { margin:12px 0 1px;font-size:46px;font-weight:700;line-height:1.08;letter-spacing:-.06em; }
.cash-price span { font-size:10px;font-weight:600;margin-left:9px;letter-spacing:0; }
.card-caption { font-size:12px;margin:0 0 17px; }
.buy-option .payment-logos { justify-content:center;gap:6px;margin-top:13px;flex-wrap:wrap; }
.pay-logo { height:23px;min-width:35px;padding:2px 5px;border-radius:4px; }
.pay-logo.visa { font-size:12px; }
.pay-logo.wallet { font-size:9px; }
.pay-logo.amex { font-size:5px; }
.pay-logo.paypal,.pay-logo.klarna { font-size:9px; }
.pay-logo svg { max-height:18px; }
.payment-divider { position:relative;height:0;border-top:1px solid #e5e9f2;margin:0 25px;text-align:center;z-index:1; }
.payment-divider span { display:inline-block;position:relative;top:-10px;padding:1px 12px;color:#7c86a0;background:white;font-size:10px;line-height:17px; }
.instalment-option { padding:24px 25px 19px;background:linear-gradient(120deg,#f7f9ff 0%,#faf9ff 63%,#fff8fc 100%); }
.instalment-option .card-heading h2 { font-size:18px; }
.lease-title-break { display:none; }
.lease-price { display:flex;align-items:baseline;gap:7px;font-size:37px;font-weight:700;line-height:1.1;letter-spacing:-.05em;margin:14px 0 13px; }
.lease-price span { font-size:12px;font-weight:450;letter-spacing:0;margin:0; }
.lease-price .from-label { font-size:11px;margin-right:1px; }
.use-now { display:flex;gap:10px;align-items:center;margin:0 0 17px; }
.use-now > .icon { width:28px;height:28px;color:var(--blue);padding:4px;box-sizing:content-box;background:#eaf0ff;border-radius:11px; }
.use-now strong { display:block;font-size:13px;line-height:1.5;letter-spacing:-.01em; }
.use-now span { display:block;font-size:10px;color:var(--muted);margin-top:1px; }
.plan-disclosure { margin:12px 0 0;font-size:10px;line-height:1.65;color:#69758e; }
.purchase-panel-foot { display:flex;align-items:center;justify-content:center;gap:6px;min-height:34px;font-size:9px;color:#7b849a;border-top:1px solid #edf0f7;background:#fff; }
.purchase-panel-foot .icon { width:11px;height:11px; }
.offer-card { padding:17px 20px;background:white;border:1px solid var(--line);border-radius:17px; }
.offer-card h2 { font-size:14px; }
.offer-card p { margin:4px 0 10px;font-size:11px; }
.quick-offer { margin:0;gap:9px; }
.quick-offer .button { min-height:42px;font-size:10px;padding:0 12px;border-radius:10px; }
.money-field { height:42px;border-radius:10px; }
.money-field input { font-size:11px; }
.how-section { padding:43px 0 47px;margin:0;border-top:1px solid var(--line); }
.how-section h2,.faq-intro h2 { font-size:29px; }
.section-intro { margin-bottom:28px; }
.how-grid { gap:32px; }
.how-grid h3 { font-size:16px;margin-bottom:10px; }
.how-grid p { font-size:12px;line-height:1.8; }
.step-number { margin-bottom:17px;font-size:11px; }
.faq-section { padding:46px 0; }
.contact-band { padding:26px 28px;margin:25px 0 0;border-radius:18px; }
.contact-band h2 { font-size:23px; }
.site-footer { padding:28px 0 23px;margin-top:46px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line); }
.seller-footer { display:flex;align-items:center;gap:13px; }
.sold-by { color:var(--muted);font-size:10px; }
.footer-brand { font-size:22px;gap:7px; }
.footer-brand .brand-mark { width:26px;height:26px; }
.footer-brand > .icon { width:12px;height:12px;margin-left:2px;color:var(--muted); }
.footer-links { gap:18px;font-size:10px; }
.footer-right p { margin:9px 0 0;font-size:10px; }
.site-footer .footer-disclosure { flex-basis:100%;font-size:9px;color:#77829a;line-height:1.6;margin:0;text-align:center; }
/* All transaction screens start with content, not a site header or oversized hero. */
.flow-main { padding-top:22px;padding-bottom:6px; }
.flow-topline { display:flex;align-items:center;gap:20px;min-height:30px;margin-bottom:18px; }
.flow-topline .back-link { margin:0;font-size:11px;gap:4px; }
.flow-domain { font-size:12px;font-weight:650;letter-spacing:-.02em;color:#58657e;overflow-wrap:anywhere; }
.steps { margin:0 0 0 auto;display:flex;gap:18px;width:auto;justify-content:flex-end;padding:0; }
.steps li { gap:6px;flex:none;font-size:10px; }
.steps li::after,.steps li::before { display:none; }
.steps li span { width:19px;height:19px;font-size:9px; }
.steps li .icon { width:11px;height:11px; }
.steps li b { font-size:10px;font-weight:500; }
.compact-heading { margin:0 0 23px; }
.compact-heading h1 { font-size:33px;line-height:1.14;letter-spacing:-.045em;margin:0; }
.compact-heading p { font-size:13px;color:var(--muted);margin-top:6px; }
.flow-grid { display:grid;gap:24px;align-items:start; }
.lease-grid { grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); }
.checkout-grid,.verification-grid { grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); }
.panel { border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);background:white; }
.panel-top { display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px; }
.panel-top h2 { font-size:20px; }
.sticky-panel { position:sticky;top:20px; }
.plan-picker { padding:26px; }
.eyebrow-small { font-size:9px;font-weight:650;letter-spacing:.09em;color:#7b88a1;line-height:1.5;margin:0 0 6px; }
.plan-picker .panel-top { margin-bottom:28px; }
.plan-picker h2 { font-size:22px; }
.plan-number-row { display:flex;align-items:center;justify-content:space-between;gap:12px; }
.plan-price { display:flex;align-items:baseline;justify-content:flex-start;gap:7px;margin:0;line-height:1; }
.plan-price strong { font-size:64px;letter-spacing:-.065em;font-weight:700;line-height:1; }
.plan-price > span { font-size:13px;letter-spacing:0;margin:0;color:var(--muted); }
.plan-price-note { text-align:left;font-size:11px;margin-top:11px; }
.compact-arrows { display:flex;gap:8px; }
.circle-button { width:37px;height:37px;border-radius:50%; }
.compact-arrows .circle-button { color:var(--blue);border:1px solid #dde5fa;background:#fff; }
.compact-arrows .circle-button:hover:not(:disabled) { background:#edf2ff; }
.slider-meta { display:flex;align-items:center;justify-content:space-between;margin-top:27px;font-size:11px; }
.slider-meta label { color:var(--muted); }
.slider-meta strong { font-size:12px;color:var(--blue); }
.slider-wrap { display:flex;align-items:center;height:41px;padding:0 5px; }
.term-slider { --range-progress:50%;appearance:none;-webkit-appearance:none;width:100%;height:5px;border:0;border-radius:9px;background:linear-gradient(to right,var(--blue) 0%,var(--blue) var(--range-progress),#e5eafa var(--range-progress),#e5eafa 100%);padding:0;cursor:pointer; }
.term-slider::-webkit-slider-thumb { appearance:none;-webkit-appearance:none;width:23px;height:23px;border-radius:50%;background:white;border:6px solid var(--blue);box-shadow:0 0 0 4px #edf2ff;transition:box-shadow .15s; }
.term-slider::-moz-range-thumb { width:12px;height:12px;border-radius:50%;background:white;border:6px solid var(--blue);box-shadow:0 0 0 4px #edf2ff; }
.term-slider:hover::-webkit-slider-thumb { box-shadow:0 0 0 7px #edf2ff; }
.term-tabs { display:flex;gap:8px;padding:0;margin:2px 0 0;border:0;background:none;overflow:visible; }
.term-tab { position:relative;flex:1;min-width:0;border:1px solid var(--line);border-radius:11px;background:white;padding:12px 4px 11px;text-align:center;transition:background .2s,border-color .2s,box-shadow .2s,transform .2s; }
.term-tab > strong { display:block;font-size:18px;line-height:1.1;letter-spacing:-.035em; }
.term-tab strong small { font-size:10px;font-weight:400;color:var(--muted);margin-left:3px;display:inline; }
.term-tab > span { display:block;font-size:10px;line-height:1.5;margin-top:6px;font-weight:500;color:var(--muted); }
.term-tab em { display:none; }
.term-tab.selected { border-color:var(--blue);background:var(--blue);box-shadow:0 4px 10px #2458ed25;color:white; }
.term-tab.selected > span,.term-tab.selected strong small { color:#e2eaff; }
.term-tab:hover:not(.selected) { border-color:#a8bbf6;background:#f4f7ff;transform:translateY(-2px); }
.slider-captions { display:flex;justify-content:space-between;font-size:9px;color:#8690a5;margin:10px 1px 0; }
.plan-metrics { display:grid;grid-template-columns:1fr 1fr 1fr;margin:23px 0 0;padding:18px 0 0;border-top:1px solid var(--line);gap:13px;background:transparent;border-radius:0; }
.plan-metrics > div { border:0;padding:0;text-align:left; }
.plan-metrics span { display:block;font-size:10px;line-height:1.45; }
.plan-metrics strong { display:block;font-size:21px;line-height:1.3;margin-top:5px;letter-spacing:-.045em; }
.plan-metrics small { display:block;font-size:9px;line-height:1.5;margin-top:4px;color:#8b94a7; }
.order-summary { padding:23px; }
.summary-domain { display:flex;align-items:center;gap:11px;margin:0 0 20px;padding:0 0 17px;border-bottom:1px solid var(--line); }
.summary-domain > .icon { padding:9px;width:37px;height:37px;background:#edf2ff;border-radius:11px;color:var(--blue); }
.summary-domain span { display:block;font-size:8px;letter-spacing:.11em; }
.summary-domain strong { display:block;font-size:18px;letter-spacing:-.045em;line-height:1.3;overflow-wrap:anywhere; }
.plan-summary { background:linear-gradient(150deg,#fff 45%,#f5f8ff 100%); }
.plan-summary .panel-top { margin-bottom:9px; }
.price-breakdown { margin:0; }
.price-breakdown > div { padding:9px 0;gap:14px;align-items:baseline; }
.price-breakdown dt { font-size:11px;color:var(--muted); }
.price-breakdown dd { font-size:12px;font-weight:650;margin:0; }
.price-breakdown .breakdown-total { padding-top:14px;margin-top:6px; }
.price-breakdown .breakdown-total dt { font-size:12px;font-weight:650;color:var(--ink); }
.price-breakdown .breakdown-total dd { font-size:24px;letter-spacing:-.045em;white-space:nowrap; }
.charge-explanation { margin-top:5px;color:#7b859a;font-size:10px;line-height:1.6; }
.due-today { display:flex;justify-content:space-between;margin:18px 0 15px;padding:15px 16px;background:#edf2ff;border-radius:12px;border:1px solid #e0e8ff; }
.due-today > span { font-size:10px;color:#677798; }
.due-today > span strong { display:block;font-size:23px;line-height:1.3;margin-top:4px;color:var(--blue);letter-spacing:-.04em; }
.due-today > span:last-child { text-align:right; }
.summary-small { font-size:10px;line-height:1.7;margin:11px 0 0; }
.option-note { display:flex;gap:8px;margin-top:16px;font-size:10px;line-height:1.6;color:var(--muted); }
.option-note > .icon { width:15px;height:15px;color:var(--green);margin-top:1px; }
.option-note strong { display:block;color:var(--ink);font-size:11px;margin-bottom:3px; }
.plan-summary > .text-link { margin-top:14px;font-size:10px; }
.cash-alternative { font-size:11px;margin-top:17px;padding:14px 0 0; }
.reset-plan { display:block;font-size:9px;color:var(--muted);margin:12px auto 0;text-decoration:underline;text-underline-offset:3px; }
.schedule-panel { padding:21px 24px;margin-top:18px; }
.schedule-panel .panel-top { margin-bottom:20px; }
.schedule-panel h2 { font-size:17px; }
.schedule-timeline { margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px; }
.schedule-timeline li { position:relative;min-width:0;padding-top:17px; }
.schedule-timeline li:not(:last-child)::before { content:'';position:absolute;left:4px;right:-13px;top:4px;height:1px;background:#dce4f7; }
.timeline-dot { position:absolute;left:0;top:0;width:9px;height:9px;border-radius:50%;background:#9fb7ff;border:2px solid white;box-shadow:0 0 0 1px #dce4f7; }
.option-milestone .timeline-dot { background:var(--pink);box-shadow:0 0 0 1px #fbd4e6; }
.schedule-timeline small { font-size:9px;color:var(--muted);display:block; }
.schedule-timeline strong { font-size:18px;letter-spacing:-.04em;display:block;margin:3px 0; }
.schedule-timeline p { font-size:9px;line-height:1.4;color:var(--muted); }
.schedule-caption { font-size:10px;color:var(--muted);line-height:1.7;margin-top:17px; }
.exact-schedule { margin-top:14px;border-top:1px solid var(--line); }
.exact-schedule summary { display:flex;align-items:center;justify-content:space-between;padding-top:12px;cursor:pointer;font-size:11px;list-style:none; }
.exact-schedule summary .icon { width:14px;height:14px;color:var(--muted); }
.exact-schedule[open] summary .icon { transform:rotate(45deg); }
.exact-schedule table { width:100%;border-collapse:collapse;font-size:10px; }
.exact-schedule caption { text-align:left;font-size:10px;margin:15px 0 5px;color:var(--muted); }
.exact-schedule th,.exact-schedule td { text-align:left;border-bottom:1px solid var(--line);padding:8px 4px; }
.exact-schedule td:last-child { text-align:right;white-space:nowrap; }
.lease-benefits { display:grid;grid-template-columns:1fr 1fr;gap:21px;margin:25px 0 0;padding:0 4px; }
.lease-benefits > div { gap:9px; }
.lease-benefits .icon { width:19px;height:19px; }
.lease-benefits h3 { font-size:12px;line-height:1.4; }
.lease-benefits p { font-size:10px;line-height:1.7;margin-top:6px; }
.compare-details { margin-top:23px;border-top:1px solid var(--line);padding-top:15px; }
.compare-details summary { font-size:12px; }
.mobile-plan-action { display:none; }
/* Checkout: shorter panels and company/consent states. */
.compact-demo { margin:0 0 18px;padding:10px 13px;border-radius:11px; }
.compact-demo p { font-size:11px; }
.compact-demo > div > .icon { width:17px;height:17px; }
.compact-demo .button { min-height:34px;padding:5px 11px;font-size:10px; }
.form-panel { padding:23px;margin-bottom:17px; }
.form-section-heading { margin-bottom:18px;gap:10px; }
.form-section-heading h2 { font-size:19px; }
.form-section-heading p { font-size:11px;margin-top:4px; }
.section-counter { width:27px;height:27px;font-size:10px; }
.form-grid { gap:14px; }
.field { font-size:11px;gap:6px; }
.field input,.field select,.field textarea { min-height:43px;padding:10px 12px;border-radius:9px;font-size:12px;line-height:1.5; }
.field .field-helper { font-size:9px;line-height:1.5;color:#77839b; }
.company-authority { margin-top:14px; }
.check-field { gap:9px;font-size:11px;line-height:1.7; }
.check-field input[type=checkbox] { width:16px;height:16px;min-width:16px;margin-top:3px; }
.check-field em { font-size:10px; }
.purchase-option-choice { padding:16px;margin-top:19px;border:1px solid #dfe7fb;background:#f7f9ff;border-radius:12px; }
.purchase-option-choice h3 { font-size:15px;margin:10px 0 7px; }
.purchase-option-choice > p { font-size:11px;line-height:1.7;color:var(--muted); }
.purchase-option-choice .check-field { margin:12px 0; }
.purchase-option-choice .microcopy { font-size:10px; }
.section-description,.form-panel .microcopy { font-size:10px; }
.checkout-agreement { padding:4px 2px; }
.next-step-note { margin:17px 0;padding:15px 17px;border:1px solid #dee7ff;border-radius:12px;background:#edf3ff;font-size:11px;gap:11px; }
.next-step-note strong { display:block;color:var(--ink);font-size:12px;margin-bottom:2px; }
.next-step-note .icon { color:var(--blue);width:23px;height:23px; }
.submission-note { font-size:9px;margin:10px 0 0; }
.order-type { display:flex;flex-direction:column;gap:7px;font-size:11px;margin-bottom:12px; }
.order-type .text-link { font-size:10px; }
.checkout-schedule { border-top:1px solid var(--line);padding-top:14px;margin-top:10px; }
.checkout-schedule h3 { font-size:12px;margin-bottom:7px; }
.checkout-schedule dl { margin:0; }
.checkout-schedule dl > div { display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:10px; }
.checkout-schedule dt { color:var(--muted); }
.checkout-schedule dd { margin:0;white-space:nowrap;font-weight:600; }
.checkout-schedule p { font-size:9px;color:var(--muted);line-height:1.6;margin-top:6px; }
.checkout-due { padding:17px;margin:17px 0 0;border-radius:12px; }
.checkout-due strong { font-size:31px;letter-spacing:-.05em; }
.checkout-due small { font-size:10px; }
.ownership-note { font-size:10px;line-height:1.65;margin:14px 0 0;padding:0;background:none;gap:8px; }
.ownership-note .icon { width:15px;height:15px; }
.summary-support { margin-top:18px;padding-top:17px;gap:9px; }
.summary-support strong { font-size:11px; }
.summary-support .text-link { font-size:10px; }
/* A provider-hosted ID demonstration: never a local upload. */
.paid-confirmation { margin:0 0 18px;border-radius:10px;padding:10px 14px;font-size:11px; }
.hosted-verification { text-align:center;padding:27px 44px; }
.verification-visual { height:122px;position:relative;display:flex;align-items:center;justify-content:center;margin-bottom:15px; }
.verification-orbit { width:112px;height:112px;border-radius:50%;background:#eef3ff;position:absolute;z-index:0; }
.verification-document { z-index:1;width:139px;height:86px;display:flex;align-items:center;gap:13px;position:relative;transform:rotate(-6deg);border:1px solid #d8e2fb;background:linear-gradient(150deg,#fff,#f4f7ff);border-radius:13px;box-shadow:0 12px 25px #2458ed12;padding:15px; }
.verification-document > .icon { width:42px;height:42px;stroke-width:1.2;color:var(--blue); }
.verification-document > div { flex:1;display:flex;flex-direction:column;gap:7px; }
.verification-document i { display:block;width:100%;height:4px;background:#d9e3fc;border-radius:3px; }
.verification-document i:last-child { width:70%; }
.verification-document > span { position:absolute;right:-12px;bottom:-9px;background:#e6f8ef;border:4px solid white;border-radius:50%;padding:7px;transform:rotate(6deg);color:#188467; }
.verification-document > span .icon { width:19px;height:19px; }
.hosted-verification h2 { font-size:29px;line-height:1.16;margin:15px 0 13px; }
.hosted-verification > p { font-size:12px;color:var(--muted);line-height:1.8;margin:0 auto 21px;max-width:365px; }
.hosted-verification .microcopy { font-size:9px;margin:11px 0 20px; }
.verification-safe { display:flex;justify-content:center;align-items:center;gap:7px;padding-top:17px;border-top:1px solid var(--line);color:var(--muted);font-size:10px; }
.verification-safe .icon { width:13px;height:13px; }
.activation-summary h2 { font-size:23px; }
.activation-description { font-size:12px;line-height:1.75;margin-top:10px; }
.review-time { padding:14px;margin-top:17px;border-radius:12px; }
.review-time span { font-size:10px; }
.review-time strong { font-size:19px; }
.activation-timeline { margin:22px 0 0; }
.activation-timeline strong { font-size:12px; }
.activation-timeline p { font-size:10px; }
.hosted-id-modal { max-width:570px; }
.hosted-id-modal h2 { font-size:27px; }
.hosted-id-modal > .modal-content > p { font-size:12px; }
.hosted-id-modal .id-options { margin-top:20px;margin-bottom:16px; }
.hosted-id-modal .id-option { padding:14px; }
.hosted-id-modal .id-option strong { font-size:12px; }
.hosted-id-modal .id-option small { font-size:9px; }
.hosted-document-slots { display:grid;gap:10px;margin-bottom:15px; }
.hosted-doc { display:flex;gap:11px;align-items:center;padding:13px;border:1px dashed #d4ddef;border-radius:10px;background:#fafbff; }
.hosted-doc .icon { width:23px;height:23px;color:#8fa1c4; }
.hosted-doc strong { display:block;font-size:12px; }
.hosted-doc span { display:block;font-size:10px;color:var(--muted);margin-top:3px; }
.hosted-doc.supplied { border:1px solid #bfe7d9;background:#f1faf6; }
.hosted-doc.supplied .icon { color:var(--green); }
.hosted-id-modal .check-field { margin:17px 0; }
/* Compact completion and deliberate demo-only lifecycle controls. */
.completion-main { padding-top:22px; }
.completion-card { max-width:780px;margin:20px auto 0;padding:30px 38px; }
.completion-card h1 { font-size:33px;line-height:1.2;margin-top:10px; }
.completion-card .state-icon { margin:0 auto 16px;width:56px;height:56px; }
.completion-card .state-icon .icon { width:26px;height:26px; }
.completion-description { font-size:12px;line-height:1.8;max-width:580px;margin:13px auto 18px; }
.completion-domain { margin:0 auto 17px;padding:13px;font-size:19px; }
.completion-details { max-width:none;margin:17px 0 0; }
.completion-details > div { padding:8px 0;gap:15px; }
.completion-details dt { font-size:11px;text-align:left; }
.completion-details dd { font-size:11px;text-align:right;overflow-wrap:anywhere; }
.completion-actions { margin-top:22px;gap:9px; }
.completion-disclaimer { font-size:9px;margin-top:16px; }
.demo-controls,.demo-plan-controls { max-width:780px;margin:17px auto 0;padding:20px 23px; }
.demo-controls h2,.demo-plan-controls h2 { font-size:18px;margin-bottom:8px; }
.demo-controls p,.demo-plan-controls p { font-size:11px;line-height:1.75;margin:9px 0 14px;color:var(--muted); }
.demo-chip { margin-left:auto;font-size:10px;background:#eff2f9;padding:3px 8px;border-radius:5px;color:var(--muted); }
.modal-content { padding:30px; }
.modal-content h2 { font-size:29px; }
.modal-content > p { font-size:12px; }
.modal-form { margin-top:20px;gap:15px; }
.legal-modal h3 { font-size:17px; }
.legal-modal p { font-size:12px;line-height:1.9; }
/* Tablet */
@media (max-width:1050px) {
    .wrap { width:calc(100% - 48px); }
    .home-hero { gap:33px;grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
    .domain-heading { font-size:55px; }
    .hero-line { font-size:27px; }
    .instalment-option .card-heading { gap:7px; }
    .instalment-option .card-heading h2 { font-size:17px; }
    .lease-title-break { display:block; }
    .lease-grid,.checkout-grid,.verification-grid { grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:18px; }
    .plan-picker { padding:21px; }
    .plan-price strong { font-size:54px; }
    .compact-arrows { gap:5px; }
    .compact-arrows .circle-button { width:31px;height:31px; }
    .plan-metrics { gap:9px; }
    .plan-metrics span { font-size:9px; }
    .plan-metrics strong { font-size:18px; }
    .order-summary { padding:20px; }
    .steps { gap:10px; }
    .hosted-verification { padding:24px; }
}
/* Narrow layouts prioritise the purchase options and actual forms over decorative content. */
@media (max-width:760px) {
    .wrap { width:calc(100% - 32px); }
    .home-hero { display:flex;flex-direction:column;gap:22px;padding:25px 0 32px; }
    .hero-copy { padding:0;width:100%; }
    .availability { margin-bottom:14px;font-size:10px; }
    .domain-heading { font-size:clamp(37px,9vw,63px);margin-bottom:13px; }
    .domain-heading.long-domain { font-size:clamp(30px,7.4vw,48px); }
    .hero-line { font-size:22px;margin-bottom:0;max-width:none; }
    .hero-description,.hero-assurances,.domain-preview,.hero-contact { display:none; }
    .purchase-stack { width:100%;gap:13px; }
    .purchase-panel { border-radius:20px; }
    .buy-option { padding:19px 20px 16px; }
    .card-heading h2 { font-size:18px; }
    .cash-price { font-size:40px;margin-top:10px; }
    .card-caption { font-size:11px;margin-bottom:13px; }
    .button { min-height:47px;font-size:12px; }
    .buy-option .payment-logos { margin-top:12px;gap:5px; }
    .pay-logo { height:21px;min-width:30px;padding:2px 4px; }
    .payment-divider { margin:0 20px; }
    .instalment-option { padding:21px 20px 15px; }
    .instalment-option .card-heading h2 { font-size:17px; }
    .lease-title-break { display:none; }
    .lease-price { font-size:35px;margin:13px 0 11px; }
    .use-now { margin-bottom:14px;gap:9px; }
    .use-now > .icon { width:22px;height:22px;padding:5px;border-radius:9px; }
    .use-now strong { font-size:12px; }
    .use-now span { font-size:9px; }
    .plan-disclosure { font-size:9px;line-height:1.7;margin-top:11px; }
    .purchase-panel-foot { min-height:29px;font-size:8px; }
    .offer-card { padding:16px 18px; }
    .how-section { padding:31px 0; }
    .section-intro { margin-bottom:22px;gap:12px; }
    .section-intro > p { font-size:11px; }
    .how-section h2,.faq-intro h2 { font-size:25px; }
    .how-grid { gap:21px;grid-template-columns:1fr; }
    .step-number { margin-bottom:10px; }
    .how-grid h3 { font-size:15px; }
    .how-grid p { font-size:11px; }
    .faq-section { padding:30px 0;gap:24px; }
    .contact-band { margin:10px 0 0;padding:22px;gap:20px; }
    .contact-band h2 { font-size:21px; }
    .site-footer { margin-top:30px;padding-top:23px;gap:21px; }
    .seller-footer { width:100%;justify-content:center; }
    .footer-right { width:100%;text-align:center; }
    .footer-links { flex-wrap:wrap;justify-content:center;gap:12px; }
    .site-footer .footer-disclosure { text-align:center; }
    .flow-main { padding-top:15px; }
    .flow-topline { flex-wrap:wrap;gap:7px 12px;margin-bottom:16px; }
    .flow-topline .flow-domain { margin-left:auto;font-size:10px;max-width:62%; }
    .steps { margin-left:0;width:100%;justify-content:flex-start;gap:16px;margin-top:4px; }
    .steps li b { font-size:9px; }
    .steps li span { width:16px;height:16px;font-size:8px; }
    .compact-heading { margin-bottom:18px; }
    .compact-heading h1 { font-size:27px; }
    .compact-heading p { font-size:11px; }
    .flow-grid { display:flex;flex-direction:column;gap:17px; }
    .flow-grid > * { width:100%;min-width:0; }
    .sticky-panel { position:static; }
    .plan-main-column { display:contents; }
    .plan-picker { order:1;padding:20px; }
    .plan-summary { order:2; }
    .schedule-panel { order:3;margin-top:0; }
    .lease-benefits { order:4;margin-top:5px; }
    .compare-details { order:5;margin-top:2px; }
    .plan-picker .panel-top { margin-bottom:23px; }
    .plan-picker h2 { font-size:21px; }
    .plan-price strong { font-size:56px; }
    .plan-price > span { font-size:11px; }
    .plan-price-note { font-size:10px;margin-top:9px; }
    .compact-arrows .circle-button { width:32px;height:32px; }
    .slider-meta { margin-top:23px; }
    .term-tabs { gap:6px; }
    .term-tab { padding:12px 2px; }
    .term-tab > strong { font-size:18px; }
    .term-tab > span { font-size:9px; }
    .plan-metrics { margin-top:20px;padding-top:15px;gap:12px; }
    .plan-metrics strong { font-size:19px; }
    .plan-metrics span { font-size:9px;min-height:27px; }
    .plan-metrics small { font-size:8px; }
    .order-summary { padding:21px; }
    .plan-summary .summary-domain { margin-bottom:15px;padding-bottom:13px; }
    .plan-summary .price-breakdown > div { padding:8px 0; }
    .schedule-panel { padding:20px; }
    .schedule-panel .panel-top { gap:7px; }
    .schedule-panel h2 { font-size:16px; }
    .schedule-panel .pill { font-size:8px; }
    .schedule-timeline { gap:8px; }
    .schedule-timeline strong { font-size:16px; }
    .schedule-timeline small,.schedule-timeline p { font-size:8px; }
    .page-lease { padding-bottom:85px; }
    .mobile-plan-action { display:flex;position:fixed;bottom:0;left:0;right:0;z-index:15;align-items:center;justify-content:space-between;gap:17px;background:rgba(255,255,255,.97);border-top:1px solid #e0e7f5;box-shadow:0 -6px 24px #243e7610;backdrop-filter:blur(12px);padding:12px 16px max(12px,env(safe-area-inset-bottom)); }
    .mobile-plan-action > span { font-size:9px;color:var(--muted); }
    .mobile-plan-action strong { display:block;color:var(--ink);font-size:20px;letter-spacing:-.04em;line-height:1.2;margin-top:3px; }
    .mobile-plan-action .button { min-height:43px;padding:0 17px;font-size:12px;flex:0 1 auto; }
    .compact-demo { flex-direction:row;align-items:center;gap:9px;padding:11px; }
    .compact-demo > div { gap:7px; }
    .compact-demo p { font-size:9px;line-height:1.5; }
    .compact-demo .button { font-size:9px;min-height:35px;flex-shrink:0;padding:5px 9px; }
    .compact-demo .button .icon { display:none; }
    .form-panel { padding:19px; }
    .checkout-grid { gap:20px; }
    .checkout-summary { order:-1; }
    .checkout-summary .summary-domain { margin-bottom:12px;padding-bottom:12px; }
    .checkout-summary .order-type,.checkout-summary .checkout-schedule,.checkout-summary .ownership-note,.checkout-summary .summary-support,.checkout-summary > .summary-small { display:none; }
    .checkout-summary .price-breakdown > div:not(.breakdown-total) { display:none; }
    .checkout-summary .price-breakdown .breakdown-total { padding-top:0;margin-top:0;border-top:0; }
    .checkout-summary .price-breakdown .breakdown-total dd { font-size:22px; }
    .checkout-summary .panel-top { margin-bottom:7px; }
    .checkout-summary .checkout-due { display:flex;align-items:center;gap:10px;margin-top:10px;padding:11px 13px;flex-wrap:wrap; }
    .checkout-summary .checkout-due > span { font-size:11px; }
    .checkout-summary .checkout-due strong { margin-left:auto;font-size:25px; }
    .checkout-summary .checkout-due small { flex-basis:100%;margin-top:-5px;font-size:9px; }
    .form-section-heading h2 { font-size:18px; }
    .form-section-heading p { font-size:10px; }
    .form-grid { gap:12px; }
    .field { font-size:10px; }
    .field input,.field select,.field textarea { font-size:12px;min-height:44px; }
    .check-field { font-size:10px; }
    .next-step-note { font-size:10px; }
    .next-step-note strong { font-size:12px; }
    .checkout-submit { font-size:11px; }
    .hosted-verification { padding:21px 23px; }
    .verification-visual { height:109px;margin-bottom:12px; }
    .hosted-verification h2 { font-size:26px; }
    .hosted-verification > p { font-size:11px; }
    .paid-confirmation { font-size:10px;gap:8px;padding:11px; }
    .hosted-id-modal .id-options { gap:8px; }
    .hosted-id-modal .id-option { padding:11px 9px; }
    .hosted-id-modal .id-option > .icon { width:22px;height:22px; }
    .completion-main .flow-topline { margin-bottom:13px; }
    .completion-card { margin-top:0;padding:25px 21px; }
    .completion-card h1 { font-size:28px; }
    .completion-description { font-size:11px; }
    .completion-details dt,.completion-details dd { font-size:10px; }
    .completion-details dd { max-width:62%; }
    .completion-actions { display:flex;flex-direction:column; }
    .demo-controls,.demo-plan-controls { padding:19px; }
    .modal-content { padding:26px 22px; }
    .modal-content h2 { font-size:26px; }
}
@media (max-width:380px) {
    .wrap { width:calc(100% - 24px); }
    .home-hero { gap:19px; }
    .hero-line { font-size:20px; }
    .buy-option,.instalment-option { padding-left:17px;padding-right:17px; }
    .instalment-option .card-heading h2 { font-size:16px; }
    .lease-title-break { display:block; }
    .pill { font-size:9px;padding:4px 6px; }
    .plan-picker { padding:17px; }
    .plan-price strong { font-size:47px; }
    .plan-price > span { font-size:10px; }
    .compact-arrows { gap:4px; }
    .compact-arrows .circle-button { width:29px;height:29px; }
    .plan-picker .panel-top { gap:8px; }
    .plan-picker h2 { font-size:19px; }
    .plan-metrics strong { font-size:17px; }
    .term-tab > strong { font-size:16px; }
    .term-tab > span { font-size:8px; }
    .term-tab strong small { font-size:8px; }
    .form-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
    .compact-demo .icon { display:none; }
    .checkout-submit { padding-inline:11px;font-size:10px; }
}
@media (prefers-reduced-motion:reduce) {
    *,*::before,*::after { scroll-behavior:auto!important;animation:none!important;transition:none!important; }
    .button:hover,.domain-preview:hover,.term-tab:hover { transform:none; }
}
/* Refinements from device-sized browser checks. */
.plan-price > span { white-space:nowrap; }
.period-choice { display:flex;align-items:center;gap:12px; }
.period-choice .compact-arrows { display:flex; }
.period-choice strong { min-width:60px;text-align:right; }
.slider-meta { margin-top:21px; }
.price-breakdown { row-gap:0; }
.mobile-quote-details { display:none; }
@media(max-width:760px) {
    .period-choice { gap:10px; }
    .compact-arrows .circle-button { width:34px;height:34px; }
    .plan-price strong { font-size:58px; }
    .plan-disclosure { font-size:10px; }
    .mobile-quote-details { display:block;border-top:1px solid var(--line);margin-top:14px;padding-top:12px; }
    .mobile-quote-details summary { display:flex;align-items:center;justify-content:space-between;font-size:11px;cursor:pointer;list-style:none; }
    .mobile-quote-details summary .icon { width:15px;height:15px;color:var(--muted); }
    .mobile-quote-details dl { margin:10px 0; }
    .mobile-quote-details dl > div { display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:10px; }
    .mobile-quote-details dt { color:var(--muted); }
    .mobile-quote-details dd { margin:0;white-space:nowrap;font-weight:600; }
    .mobile-quote-details p { font-size:10px;color:var(--muted);line-height:1.7; }
}
@media(max-width:380px) {
    .plan-price strong { font-size:54px; }
    .compact-arrows .circle-button { width:32px;height:32px; }
}
@media(max-width:760px) {
    .field input,.field select,.field textarea,.money-field input { font-size:16px; }
    .footer-links button { min-height:30px; }
}
/* Long names and higher-value quotes must not widen the mobile page. */
.flow-grid .panel { min-width:0; }
.plan-metrics { grid-template-columns:repeat(3,minmax(0,1fr)); }
.plan-metrics strong { overflow-wrap:anywhere; }
.summary-domain > div { min-width:0; }
.plan-price { flex-wrap:wrap; }
@media(max-width:760px) {
    .flow-grid { align-items:stretch; }
    .plan-picker,.schedule-panel { width:100%; }
    .plan-metrics strong { font-size:clamp(14px,4.4vw,19px); }
    .schedule-timeline { grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px; }
    .schedule-timeline li:nth-child(2)::before { display:none; }
    .schedule-timeline strong { font-size:18px; }
    .schedule-timeline small,.schedule-timeline p { font-size:10px; }
}