/* Experimental domain-page X2 presentation. */
.x2-status { display: inline-flex; padding: 3px 8px; border-radius: 999px; font-size: .65rem; font-weight: 700; }
.x2-status-available { color: var(--green-dark); background: var(--green-soft); }

.domain-bulk-route-section { padding: 32px 0 0; background: #fff; }
.domain-bulk-route-card { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 22px; padding: 23px 27px; border: 1px solid #b9dcee; border-radius: 21px; background: linear-gradient(110deg,#edf8ff 0%,#f4fbf8 100%); box-shadow: var(--shadow-sm); }
.domain-bulk-route-icon { display: grid; width: 58px; height: 58px; place-items: center; border-radius: 16px; color: var(--blue); background: #fff; box-shadow: 0 9px 24px rgba(7,94,174,.12); }
.domain-bulk-route-card > div { min-width: 0; }
.domain-bulk-route-card .eyebrow { margin-bottom: 6px; padding: 0; border: 0; background: none; color: var(--green-dark); }
.domain-bulk-route-card h2 { margin: 0 0 5px; font-size: clamp(1.15rem,2vw,1.42rem); }
.domain-bulk-route-card p:last-child { margin: 0; color: var(--muted); font-size: .88rem; }
.domain-bulk-route-card > a { display: inline-flex; align-items: center; gap: 9px; color: var(--blue); font-weight: var(--context-link-weight); text-underline-offset: 4px; white-space: nowrap; }
.domain-bulk-route-card > a span { font-size: 1.15rem; }

/* X2 hero illustration: one focal domain, three outcomes and one growth cue. */
.possibility-visual { min-height: 610px; isolation: isolate; }
.possibility-glow { position: absolute; inset: 8% 3% 5%; z-index: -2; border-radius: 50%; background: radial-gradient(circle, rgba(75,207,171,.18), rgba(66,158,232,.12) 48%, transparent 72%); filter: blur(8px); }
.domain-layer { position: absolute; top: 56px; left: 50%; width: min(82%,460px); height: 140px; padding: 21px 24px; border: 1px solid rgba(255,255,255,.36); border-radius: 22px; color: rgba(255,255,255,.7); background: rgba(7,67,119,.58); box-shadow: 0 22px 50px rgba(3,40,73,.16); }
.domain-layer span { font-size: .78rem; font-weight: 600; }
.domain-layer-one { transform: translateX(-54%) rotate(-4deg); }
.domain-layer-two { transform: translateX(-46%) rotate(4deg); }
.domain-search .button { border-color: var(--gold)!important; background: var(--gold)!important; color: var(--ink)!important; box-shadow: 0 8px 20px rgba(255,194,46,.22); }
.domain-search .button:hover { border-color: #ffd45c!important; background: #ffd45c!important; color: var(--ink)!important; }
.domain-hub { position: absolute; top: 75px; left: 50%; z-index: 2; width: min(82%,460px); padding: 25px 27px 23px; border: 1px solid rgba(255,255,255,.82); border-radius: 22px; color: var(--ink); background: linear-gradient(145deg,rgba(255,255,255,.98),rgba(241,250,255,.96)); box-shadow: 0 28px 65px rgba(3,38,70,.28); transform: translateX(-50%); }
.domain-hub-label { display: flex; align-items: center; gap: 8px; margin-bottom: 11px; color: var(--green-dark); font-size: .68rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.domain-pulse { width: 9px; height: 9px; border-radius: 50%; background: var(--yellow); box-shadow: 0 0 0 6px rgba(255,194,46,.15); }
.domain-hub-name { margin-bottom: 17px; font-size: clamp(1.35rem,2.4vw,1.72rem); font-weight: 650; letter-spacing: -.035em; overflow-wrap: anywhere; }
.domain-hub-name span { color: var(--blue); }
.domain-hub-meta { display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.domain-hub-meta strong { color: var(--green-dark); font-size: 1.18rem; text-align: right; }
.domain-hub-meta strong small { display: block; margin-top: 2px; color: var(--muted); font-size: .62rem; font-weight: 600; }
.possibility-message { position: absolute; top: 263px; left: 50%; z-index: 2; width: 100%; text-align: center; transform: translateX(-50%); }
.possibility-message strong { display: block; font-size: 1.16rem; font-weight: 650; }
.possibility-message span { color: rgba(255,255,255,.72); font-size: .8rem; }
.possibility-connector { position: absolute; top: 319px; left: 50%; width: 70%; height: 45px; border-top: 1px solid rgba(255,255,255,.3); transform: translateX(-50%); }
.possibility-connector::before { content: ""; position: absolute; top: -25px; left: 50%; height: 25px; border-left: 1px solid rgba(255,255,255,.3); }
.possibility-routes { position: absolute; top: 344px; left: 0; right: 0; z-index: 2; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.possibility-card { position: relative; min-width: 0; padding: 18px 13px 17px; border: 1px solid rgba(255,255,255,.7); border-radius: 18px; color: var(--ink); text-align: center; background: rgba(255,255,255,.94); box-shadow: 0 18px 38px rgba(3,38,70,.17); }
.possibility-card::before { content: ""; position: absolute; bottom: 100%; left: 50%; height: 26px; border-left: 1px solid rgba(255,255,255,.3); }
.possibility-icon { display: grid; width: 48px; height: 48px; margin: 0 auto 11px; place-items: center; border-radius: 15px; color: var(--blue); background: var(--blue-pale); }
.possibility-card strong { display: block; margin-bottom: 3px; font-size: .82rem; font-weight: 650; line-height: 1.25; }
.possibility-card small { display: block; color: var(--muted); font-size: .67rem; line-height: 1.35; }
.portfolio-cue { position: absolute; top: 500px; left: 50%; z-index: 2; display: flex; align-items: center; gap: 10px; padding: 10px 15px 10px 10px; border: 1px solid rgba(255,255,255,.32); border-radius: 999px; color: rgba(255,255,255,.92); background: rgba(4,66,111,.38); transform: translateX(-50%); white-space: nowrap; }
.portfolio-cue span { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; color: var(--green-dark); background: #fff; font-size: 1.1rem; font-weight: 600; }
.portfolio-cue strong { font-size: .7rem; font-weight: 600; }
@media (max-width: 1060px) and (min-width: 901px) {
  .possibility-visual { min-height: 560px; }
  .domain-hub, .domain-layer { width: 88%; }
  .domain-hub { padding-inline: 21px; }
  .possibility-message { top: 258px; }
  .possibility-connector { top: 314px; }
  .possibility-routes { top: 339px; gap: 8px; }
  .possibility-card { padding-inline: 9px; }
  .possibility-card strong { font-size: .75rem; }
  .possibility-card small { font-size: .61rem; }
  .portfolio-cue { top: 487px; }
}

/* X2 border and spacing rhythm */
.domain-status.review {
  width: auto;
  padding: 5px 9px;
  border: 0;
  border-radius: 999px;
}

.portfolio-actions { display:flex; flex-wrap:wrap; gap:12px 18px; align-items:center; margin-top:28px; }
.portfolio-actions .button { min-height:50px; padding-inline:20px; }
.portfolio-support { color:#fff; font-weight:var(--context-link-weight); text-decoration-color:rgba(255,255,255,.6); text-underline-offset:4px; }
.portfolio-support:hover { color:#b9f3df; }
.portfolio-transfer-note { max-width:650px; margin:15px 0 0!important; color:rgba(255,255,255,.72)!important; font-size:.82rem; line-height:1.55; }
.domain-search-repeat { width:min(760px,100%); margin:28px auto 0; text-align:left; }
.final-domain-benefits { display:flex; justify-content:center; flex-wrap:wrap; gap:10px 24px; margin-top:20px; color:rgba(255,255,255,.84); font-size:.85rem; font-weight:650; }
.final-domain-benefits span { position:relative; padding-left:18px; }
.final-domain-benefits span::before { content:"✓"; position:absolute; left:0; color:#7ff0cc; font-weight:850; }

@media (max-width: 480px) {
  .domain-bulk-route-section { padding-top: 22px; }
  .domain-bulk-route-card { grid-template-columns: 1fr; gap: 15px; padding: 22px; }
  .domain-bulk-route-card > a { justify-self: start; white-space: normal; }
  .tools-grid { grid-template-columns: minmax(0, 1fr); }
  .tool-card { width: 100%; min-width: 0; }
  .intent-card,
  .tool-card,
  .trust-card,
  .reviews .review { padding: 24px; }
  .price-card { padding: 27px 24px; }
  .offer-band { padding: 20px 22px; }
  .domain-row { padding: 15px 17px; }
  .portfolio-actions { align-items:stretch; }
  .portfolio-actions > * { width:100%; justify-content:center; text-align:center; }
  .domain-search-repeat { grid-template-columns:1fr; }
  .domain-search-repeat .button { width:100%; }
  .final-domain-benefits { display:grid; justify-content:start; text-align:left; }
}

@media (max-width: 300px) {
  .hero { padding-top: 54px; padding-bottom: 62px; }
  .section { padding-top: 56px; padding-bottom: 56px; }
  .eyebrow { max-width: 100%; white-space: normal; }
  .hero .eyebrow { padding: 7px 10px; }
  .domain-search { padding: 6px; border-radius: 15px; }
  .intent-card,
  .price-card,
  .tool-card,
  .trust-card,
  .reviews .review { padding: 19px; border-radius: 16px; }
  .offer-band { padding: 18px; border-radius: 16px; }
  .portfolio-board { padding: 7px; border-radius: 20px; }
  .portfolio-head,
  .domain-row { padding: 14px; }
  .tool-card-top { gap: 11px; }
  .tool-card .tool-icon { width: 44px; height: 44px; }
}

/* Colourful domain workspace: one valuable name, three uses and quiet portfolio growth. */
.domain-x2-colour-workspace { min-height: 620px; isolation: isolate; }
.domain-x2-workspace-glow { position: absolute; inset: 3% -3% 2%; z-index: -2; border-radius: 44%; background: radial-gradient(circle at 18% 25%,rgba(52,173,255,.3),transparent 31%),radial-gradient(circle at 86% 34%,rgba(255,202,58,.24),transparent 27%),radial-gradient(circle at 55% 78%,rgba(31,213,159,.19),transparent 42%); filter: blur(11px); }
.domain-x2-portfolio-stack { position: absolute; top: 4px; right: 3%; left: 8%; height: 112px; z-index: -1; }
.domain-x2-portfolio-stack span { position: absolute; inset: 0 6% auto 3%; height: 90px; padding: 18px 22px; border: 1px solid rgba(255,255,255,.32); border-radius: 22px; color: rgba(255,255,255,.68); background: rgba(7,67,119,.56); box-shadow: 0 18px 42px rgba(3,38,70,.16); font-size: 10px; font-weight: 700; transform: rotate(-3deg); }
.domain-x2-portfolio-stack span:last-child { inset: 7px 2% auto 7%; border-color: rgba(255,202,58,.35); transform: rotate(3deg); }
.domain-x2-workspace { position: absolute; inset: 25px 0 45px; padding: 15px; border: 1px solid rgba(255,255,255,.72); border-radius: 28px; background: rgba(247,251,254,.97); box-shadow: 0 34px 80px rgba(3,34,67,.28); transform: rotate(.6deg); }
.domain-x2-focus-card { position: relative; z-index: 2; padding: 17px 18px 15px; border: 1px solid rgba(7,94,174,.19); border-radius: 18px; background: radial-gradient(circle at 91% 13%,rgba(80,183,255,.16),transparent 27%),linear-gradient(145deg,#fff,#edf7ff); box-shadow: 0 16px 34px rgba(7,94,174,.14); }
.domain-x2-focus-top,.domain-x2-focus-meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.domain-x2-focus-top > span { display: flex; align-items: center; gap: 7px; color: var(--blue); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.domain-x2-focus-top > span i { width: 8px; height: 8px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 5px rgba(255,202,58,.18); }
.domain-x2-focus-top > small { display: flex; align-items: center; gap: 5px; padding: 5px 8px; border-radius: 999px; color: var(--green-dark); background: var(--green-soft); font-size: 8px; font-weight: 800; }
.domain-x2-focus-name { margin: 13px 0 14px; color: var(--ink); font-size: clamp(23px,2.7vw,32px); font-weight: 750; letter-spacing: -.045em; overflow-wrap: anywhere; }
.domain-x2-focus-name span { color: var(--blue); }
.domain-x2-ready { display: inline-flex; align-items: center; gap: 5px; color: var(--green-dark); font-size: 9px; font-weight: 750; }
.domain-x2-focus-meta > strong { color: #9b7000; font-size: 18px; text-align: right; }
.domain-x2-focus-meta > strong small { display: block; margin-top: 2px; color: var(--muted); font-size: 8px; font-weight: 650; }
.domain-x2-route-line { position: relative; display: grid; height: 42px; place-items: center; color: var(--ink); font-size: 11px; }
.domain-x2-route-line::before { content: ""; position: absolute; top: 0; bottom: 13px; left: 50%; border-left: 1px solid rgba(7,94,174,.25); }
.domain-x2-route-line strong { position: relative; align-self: end; padding: 0 9px; background: #f7fbfe; }
.domain-x2-colour-routes { position: relative; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.domain-x2-colour-routes::before { content: ""; position: absolute; top: -9px; right: 12%; left: 12%; border-top: 1px solid rgba(7,94,174,.25); }
.domain-x2-colour-route { min-width: 0; overflow: hidden; border: 1px solid rgba(16,36,59,.1); border-radius: 15px; background: var(--white); box-shadow: 0 10px 23px rgba(16,36,59,.1); }
.domain-x2-route-preview { overflow: hidden; }
.domain-x2-preview-bar { display: flex; height: 17px; align-items: center; gap: 3px; padding: 0 7px; background: rgba(255,255,255,.85); }
.domain-x2-preview-bar i { width: 4px; height: 4px; border-radius: 50%; background: #ff8d78; }
.domain-x2-preview-bar i:nth-child(2) { background: var(--gold); }
.domain-x2-preview-bar i:last-child { background: #4fd4ad; }
.domain-x2-page-preview,.domain-x2-email-preview,.domain-x2-forward-preview { height: 59px; }
.domain-x2-page-preview { display: grid; grid-template-columns: auto 1fr; gap: 8px; align-items: center; padding: 10px; color: var(--white); background: linear-gradient(135deg,#075eae,#4ab5f4); }
.domain-x2-page-preview > span { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 10px; background: rgba(255,255,255,.18); }
.domain-x2-page-preview > div { display: grid; gap: 4px; }
.domain-x2-page-preview i { width: 86%; height: 4px; border-radius: 4px; background: rgba(255,255,255,.76); }
.domain-x2-page-preview i:nth-child(2) { width: 58%; background: rgba(255,255,255,.44); }
.domain-x2-page-preview i:last-child { width: 40%; height: 9px; background: var(--gold); }
.domain-x2-email-preview,.domain-x2-forward-preview { display: flex; align-items: center; justify-content: center; gap: 7px; padding: 8px; }
.domain-x2-email-preview { color: var(--white); background: linear-gradient(135deg,#079682,#55d8bd); }
.domain-x2-forward-preview { color: #663812; background: linear-gradient(135deg,#ff9a6f,#ffd165); }
.domain-x2-email-preview span,.domain-x2-email-preview strong,.domain-x2-forward-preview span,.domain-x2-forward-preview strong { overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.domain-x2-email-preview i,.domain-x2-forward-preview i { display: grid; flex: 0 0 auto; place-items: center; font-style: normal; }
.domain-x2-route-meta { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 7px; align-items: center; padding: 9px; }
.domain-x2-route-meta > span { display: grid; width: 29px; height: 29px; place-items: center; border-radius: 9px; color: var(--blue); background: var(--blue-soft); }
.is-email .domain-x2-route-meta > span { color: var(--green); background: var(--green-soft); }
.is-forward .domain-x2-route-meta > span { color: #a9511c; background: #fff0e7; }
.domain-x2-route-meta div { display: grid; min-width: 0; gap: 1px; }
.domain-x2-route-meta strong,.domain-x2-route-meta small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.domain-x2-route-meta strong { color: var(--ink); font-size: 9px; }
.domain-x2-route-meta small { color: var(--muted); font-size: 7.5px; }
.domain-x2-control-layer { display: grid; gap: 7px; margin-top: 12px; }
.domain-x2-control-layer > small { justify-self: center; color: var(--muted); font-size: 8px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.domain-x2-control-layer > div { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; }
.domain-x2-control-layer span { display: flex; min-width: 0; align-items: center; justify-content: center; gap: 4px; padding: 8px 5px; border: 1px solid rgba(8,122,85,.14); border-radius: 10px; color: var(--green); background: rgba(233,248,241,.78); }
.domain-x2-control-layer strong { overflow: hidden; color: var(--green-dark); font-size: 7.5px; text-overflow: ellipsis; white-space: nowrap; }
.domain-x2-growth-cue { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 10px; }
.domain-x2-growth-cue > span { display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid rgba(189,144,16,.3); border-radius: 50%; color: #856200; background: var(--gold-soft); font-weight: 800; }
.domain-x2-growth-cue > div { display: grid; gap: 1px; }
.domain-x2-growth-cue strong { color: var(--ink); font-size: 9px; }
.domain-x2-growth-cue small { color: var(--muted); font-size: 7.5px; }
@media (max-width: 1060px) and (min-width: 901px) {
  .domain-x2-colour-workspace { min-height: 590px; }
  .domain-x2-workspace { inset-inline: 0; padding: 12px; }
  .domain-x2-focus-card { padding: 15px; }
  .domain-x2-control-layer strong { display: none; }
  .domain-x2-control-layer span { min-height: 32px; }
  .domain-x2-growth-cue { margin-top: 8px; }
}