/* ═══ Web Hosting page (hosting.html; was the v2 mockup, made the main page by the owner, 2026-10-30: "based on homepage design and learning, do your best design job for
   hosting page"). Mockup for hosting-v2.html only; folds into site.css once approved. Homepage language: Stone hero,
   Even titles (ink line + grey line, no punctuation), left-aligned H2 headers with a white pill, white hairline cards,
   violet only on icons and buttons, charcoal for contrast. Flat colour, no blue. ═══ */

/* ── Hero: Stone, Even title, big buttons; a four-fact row closes it instead of a picture ── */
.hv2 .page-hero.stone > .frame{ padding-bottom:0; }
.hv2 .page-hero .crumb{ margin-bottom:22px; }
.hv2 .page-hero .crumb a{ color:var(--brand); text-decoration:none; }
.hv-facts{ list-style:none; margin:72px 0 0; padding:0; display:grid; grid-template-columns:repeat(4, 1fr); border-top:1px solid #E5E8EB; }
.hv-facts li{ padding:28px 24px 32px; display:flex; flex-direction:column; gap:4px; }
.hv-facts li + li{ border-left:1px solid #E5E8EB; }
.hv-facts b{ font-size:22px; font-weight:550; letter-spacing:-0.03em; color:#0A0A0A; }
.hv-facts span{ font:12px var(--mono); letter-spacing:.02em; color:#6E6E75; }

/* ── Even section header (H2 from the homepage): white pill, wide title one line each, line under it ── */
.eh{ position:relative; z-index:1; padding:0 24px; }
.eh .sc-pill{ margin:0; }
.eh-t{ margin:22px 0 0; font-weight:550; }
.eh-t span{ display:block; letter-spacing:-0.045em; white-space:nowrap; }
.eh-t .a{ color:#0A0A0A; font-size:clamp(28px, 3.4vw, 48px); line-height:1.06; }
.light .eh-t .b{ color:#9A9AA2; font-size:clamp(28px, 3.4vw, 48px); line-height:1.06; margin-top:.04em; }
.eh p{ margin:18px 0 0; max-width:36em; font-size:18px; line-height:1.55; color:#55555C; }
/* on black */
.eh.dk .sc-pill{ background:#141416; box-shadow:inset 0 0 0 1px rgba(255,255,255,.1); color:#A1A1A1; }
.eh.dk .sc-pill b{ color:#EDEDED; } .eh.dk .sc-pill i{ background:var(--brand-on-dark); }
.eh.dk .eh-t .a{ color:#EDEDED; }
.dark .eh.dk .eh-t .b{ color:#6E6E75; font-size:clamp(28px, 3.4vw, 48px); line-height:1.06; margin-top:.04em; }
.eh.dk p{ color:#A1A1A1; }

/* Showcase (black): header left, then the tabs and window as before */
.hv2 .ds{ padding-left:0; padding-right:0; }
.hv2 .ds > .eh{ padding-bottom:48px; }
.hv2 .ds-nav2, .hv2 .ds-win{ margin-left:24px; margin-right:24px; }

/* Included (Stone): white cards, the big one charcoal, violet icon tiles */
.hv2 #included{ background:#fff; }
.hv2 #included > .frame{ padding-top:128px; }
.hv2 #included .rails .in{ border-color:#E5E8EB; } .hv2 #included .rails i{ display:none; }
.hv2 .fxg{ padding-top:56px; }
.hv2 .fx{ background:#fff; border-radius:14px; box-shadow:0 0 0 1px #E5E8EB, 0 1px 2px rgba(16,16,20,.04); transition:box-shadow .2s; }
.hv2 .fx:hover{ transform:none; box-shadow:0 0 0 1px #CFCFCA, 0 1px 2px rgba(16,16,20,.06), 0 16px 32px -20px rgba(16,16,20,.28); }
.hv2 .fx-ic{ width:40px; height:40px; border-radius:10px; background:var(--brand-soft); color:var(--brand); box-shadow:inset 0 0 0 1px var(--brand-line); }
.hv2 .fx-ic svg{ width:18px; height:18px; }
.hv2 .fx h3{ font-weight:550; }
.hv2 .fx p{ color:#66666D; }
.hv2 .fx.big{ background:#0E0E10; color:#EDEDED; box-shadow:0 0 0 1px #1E1E22; }
.hv2 .fx.big:hover{ box-shadow:0 0 0 1px #34343A, 0 16px 32px -18px rgba(0,0,0,.5); }
.hv2 .fx.big .fx-ic{ width:52px; height:52px; border-radius:12px; background:rgba(110,93,242,.16); color:var(--brand-on-dark); box-shadow:inset 0 0 0 1px rgba(167,156,255,.25); }
.hv2 .fx.big .fx-ic svg{ width:24px; height:24px; }
.hv2 .fx.big h3{ color:#fff; } .hv2 .fx.big p{ color:#A1A1A1; }

/* Pricing (black): Even header left, billing switch right, level with the header's foot */
.hv2 .pr-head{ padding:112px 0 0; align-items:flex-end; }
.hv2 .pr-head > .eh{ flex:1 1 520px; }
.hv2 .pr-head .cycle.seg{ margin:0 24px 6px; }

/* WordPress (white): Even header; the figure box squared off like the cards */
.hv2 .wp-h{ padding-top:128px; }
.hv2 .wp-art{ border-radius:14px; box-shadow:0 0 0 1px #E5E8EB, 0 1px 2px rgba(16,16,20,.04); background:#FAFAF8; }
.hv2 .wp-r{ border-radius:12px; box-shadow:0 0 0 1px #E5E8EB, 0 1px 2px rgba(16,16,20,.04); }
.hv2 .wp-ic{ width:40px; height:40px; border-radius:10px; box-shadow:inset 0 0 0 1px var(--brand-line); }

/* Which size (Stone): Even header left, options as white hairline rows, the suggestion card stays charcoal */
.hv2 .tone:not(#included){ background:#F3F3F1; }
.hv2 .tone:not(#included) > .frame{ padding-top:128px; }
.hv2 .tone:not(#included) .rails .in{ border-color:#E5E8EB; } .hv2 .tone:not(#included) .rails i{ display:none; }
.hv2 .fit2{ max-width:none; margin:0; padding-top:56px; }
.hv2 .fo{ border-radius:12px; box-shadow:0 0 0 1px #E5E8EB, 0 1px 2px rgba(16,16,20,.04); }
.hv2 .fo[aria-checked="true"]{ background:#fff; box-shadow:0 0 0 1.5px var(--brand), 0 8px 20px -12px rgba(91,76,232,.45); }
.hv2 .fo-card{ border-radius:14px; background:#0E0E10; box-shadow:0 0 0 1px #1E1E22; }

@media (max-width:1023px){
  .hv-facts{ grid-template-columns:1fr 1fr; } .hv-facts li:nth-child(3){ border-left:0; } .hv-facts li:nth-child(n+3){ border-top:1px solid #E5E8EB; }
  .eh-t span{ white-space:normal; }
}
@media (max-width:719px){
  .eh{ padding:0 16px; }
  .hv-facts{ margin-top:48px; } .hv-facts li{ padding:20px 16px 22px; } .hv-facts b{ font-size:19px; }
  .hv2 .ds-nav2, .hv2 .ds-win{ margin-left:16px; margin-right:16px; }
  .hv2 #included > .frame, .hv2 .tone:not(#included) > .frame{ padding-top:88px; }
  .hv2 .pr-head{ padding-top:88px; } .hv2 .pr-head .cycle.seg{ margin:0 16px; }
  .hv2 .wp-h{ padding-top:88px; }
}

/* ── Owner round 1 on v2 (2026-10-30) ── */
/* Pricing: the size figure minimal ("50 GB" was too big) */
.hv2 .pz-fig b{ font-size:clamp(36px, 3.6vw, 48px); font-weight:550; letter-spacing:-0.04em; }
.hv2 .pz-fig p{ margin-top:8px; font-size:14px; }
.hv2 .pz-main{ padding-top:8px; }

/* WordPress: the right side as one panel, three numbered rows split by hairlines, a footer with the button;
   it stretches to the height of the picture box */
.hv2 .wp2{ align-items:stretch; }
.wp-panel{ display:flex; flex-direction:column; background:#fff; border-radius:14px; box-shadow:0 0 0 1px #E5E8EB, 0 1px 2px rgba(16,16,20,.04); overflow:hidden; }
.wp-k{ padding:18px 24px; border-bottom:1px solid #EEEEEA; font:500 11.5px var(--mono); letter-spacing:.09em; text-transform:uppercase; color:#8F8F96; }
.wp-list2{ list-style:none; margin:0; padding:0; flex:1; display:flex; flex-direction:column; }
.wp-list2 li{ flex:1; display:grid; grid-template-columns:28px 40px 1fr; align-items:center; gap:16px; padding:20px 24px; }
.wp-list2 li + li{ border-top:1px solid #EEEEEA; }
.wp-n{ font:500 12px var(--mono); color:#A1A1A8; }
.wp-list2 b{ display:block; font-size:17px; font-weight:550; letter-spacing:-0.015em; }
.wp-list2 div span{ display:block; margin-top:2px; font-size:14.5px; line-height:1.5; color:#66666D; }
.wp-foot{ display:flex; align-items:center; justify-content:space-between; gap:12px 16px; flex-wrap:wrap; padding:16px 24px; border-top:1px solid #EEEEEA; background:#FAFAF8; }
.wp-foot span{ font-size:14px; color:#55555C; }
.wp-foot .btn{ height:44px; font-size:15px; }

/* Which size: both sides the same height; the four options share it evenly */
.hv2 .fit2{ align-items:stretch; }
.hv2 .fo-list{ align-content:stretch; grid-auto-rows:1fr; }
@media (max-width:719px){
  .wp-list2 li{ grid-template-columns:40px 1fr; padding:18px 16px; } .wp-n{ display:none; }
  .wp-k, .wp-foot{ padding-left:16px; padding-right:16px; } .wp-foot .btn{ width:100%; }
  .hv2 .fo-list{ grid-auto-rows:auto; }
}

/* ── Hero v2b (owner, 2026-10-30: "don't want the same hero design, make it two columns like flynode wordpress page"):
   copy left on Stone, a charcoal half right that runs to the page edge with two FlyPanel cards (sample data). ── */
.hs{ background:#F3F3F1; overflow:hidden; }
.hs .rails{ display:none; }
.hs-dark{ position:absolute; top:0; bottom:0; left:50%; right:0; background:#0E0E10; }
.hs > .frame{ padding-top:0; padding-bottom:0; }
.hs-grid{ position:relative; z-index:1; display:grid; grid-template-columns:1fr 1fr; min-height:720px; }
.hs-copy{ padding:88px 56px 88px 24px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }
.hs-copy .crumb{ margin:0 0 20px; } .hs-copy .crumb a{ color:var(--brand); text-decoration:none; }
.hs-t{ margin:26px 0 0; font-weight:550; }
.hs-t span{ display:block; letter-spacing:-0.045em; }
.hs-t .l1{ color:#0A0A0A; font-size:clamp(34px, 4vw, 58px); line-height:1.03; }
.hs-t .l2{ color:#9A9AA2; font-size:clamp(34px, 4vw, 58px); line-height:1.03; margin-top:.04em; }
.hs-copy .lede{ margin:22px 0 0; max-width:30em; color:#55555C; text-align:left; }
.hs-copy .cta2{ justify-content:flex-start; }
.hs-feats{ list-style:none; margin:32px 0 0; padding:0; width:100%; display:grid; grid-template-columns:repeat(4, 1fr); gap:8px; }
.hs-feats li{ display:flex; flex-direction:column; gap:2px; padding:14px; border-radius:10px; background:#fff; box-shadow:inset 0 0 0 1px #E5E8EB; }
.hs-fi{ width:28px; height:28px; border-radius:8px; display:grid; place-items:center; background:var(--brand-soft); color:var(--brand); margin-bottom:8px; }
.hs-fi svg{ width:15px; height:15px; }
.hs-feats b{ font-size:14px; font-weight:550; color:#0A0A0A; } .hs-feats li > span:last-child{ font-size:12.5px; color:#6E6E75; }
.hs-copy .ht-trust{ justify-content:flex-start; margin-top:24px; }

.hs-art{ padding:88px 24px 88px 56px; display:flex; flex-direction:column; justify-content:center; gap:16px; }
.hs-win{ border-radius:14px; background:#fff; color:#0A0A0A; box-shadow:0 0 0 1px rgba(255,255,255,.12), 0 30px 60px -30px rgba(0,0,0,.6); overflow:hidden; }
.hs-win.dk{ background:#161618; color:#EDEDED; box-shadow:0 0 0 1px rgba(255,255,255,.1); margin-left:48px; }
.hs-bar{ height:44px; display:flex; align-items:center; gap:7px; padding:0 16px; border-bottom:1px solid #EEEEEA; font-size:13px; }
.hs-win.dk .hs-bar{ border-color:rgba(255,255,255,.08); font-weight:500; }
.hs-bar > i{ width:9px; height:9px; border-radius:50%; background:#E2E2E2; }
.hs-bar > span{ margin-left:10px; font:12px var(--mono); color:#8F8F96; } .hs-win.dk .hs-bar > span{ margin-left:0; font:500 13px var(--sans); color:#EDEDED; }
.hs-bar em{ margin-left:auto; font-style:normal; display:inline-flex; align-items:center; gap:6px; font-size:12px; color:#55555C; }
.hs-bar em i{ width:6px; height:6px; border-radius:50%; background:var(--green); }
.hs-bar em.mono{ font:11.5px var(--mono); color:#6E6E6E; }
.hs-body{ padding:20px; display:grid; gap:16px; }
.hs-plan{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.hs-plan .hs-k{ font:500 11px var(--mono); letter-spacing:.08em; text-transform:uppercase; color:#8F8F96; }
.hs-plan b{ font-size:16px; font-weight:550; letter-spacing:-0.01em; }
.hs-tag{ margin-left:auto; font:500 11.5px var(--mono); color:var(--brand); background:var(--brand-soft); padding:3px 8px; border-radius:6px; }
.hs-m{ display:grid; gap:6px; } .hs-m div{ display:flex; justify-content:space-between; font-size:12.5px; color:#66666D; }
.hs-m s{ display:block; height:6px; border-radius:3px; background:#EFEFEC; overflow:hidden; } .hs-m s i{ display:block; height:100%; width:var(--w); border-radius:3px; background:var(--brand); }
.hs-chips{ display:flex; flex-wrap:wrap; gap:6px; }
.hs-chips span{ font:11.5px var(--mono); color:#55555C; padding:4px 8px; border-radius:6px; box-shadow:inset 0 0 0 1px #E5E8EB; background:#FAFAF8; }
.hs-rows > div{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px 16px; font-size:13px; color:#A1A1A1; }
.hs-rows > div + div{ border-top:1px solid rgba(255,255,255,.07); }
.hs-rows b{ color:#EDEDED; font-weight:500; }
.hs-rows button{ all:unset; font-size:12px; padding:4px 10px; border-radius:6px; color:#EDEDED; box-shadow:inset 0 0 0 1px rgba(255,255,255,.18); }
.hs-cap{ font:11.5px var(--mono); color:#6E6E6E; margin-left:48px; }

@media (max-width:1023px){
  .hs-dark{ display:none; }
  .hs-grid{ grid-template-columns:1fr; min-height:0; }
  .hs-copy{ padding:72px 24px 56px; }
  .hs-art{ margin:0 -32px; padding:48px 32px 56px; background:#0E0E10; }
  .hs-feats{ grid-template-columns:1fr 1fr; }
}
@media (max-width:719px){
  .hs-copy{ padding:48px 16px 40px; }
  .hs-t .l1, .hs-t .l2{ font-size:clamp(30px, 8.6vw, 40px); }
  .hs-copy .cta2 .b2{ width:100%; }
  .hs-art{ margin:0 -16px; padding:40px 16px 48px; }
  .hs-win.dk, .hs-cap{ margin-left:0; }
}

/* ── Hero height like flynode.io/wordpress (owner: "reduce hero section height, same as flynode", theirs 834px at 1440) ── */
.hs-grid{ min-height:0; }
.hs-copy{ padding-top:64px; padding-bottom:64px; }
.hs-art{ padding-top:64px; padding-bottom:64px; }
.hs-t .l1, .hs-t .l2{ font-size:clamp(34px, 3.7vw, 54px); }
.hs-copy .lede{ margin-top:18px; }
.hs-copy .cta2{ margin-top:28px; }
.hs-feats{ margin-top:28px; }
.hs-copy .ht-trust{ margin-top:20px; }

/* ── Ratings with the Google and Trustpilot marks (owner, 2026-10-30) ── */
.rv-score.rs2{ gap:12px; flex-wrap:wrap; }
.rs2 > a{ display:flex; align-items:center; gap:14px; padding:14px 18px 14px 14px; border-radius:12px; background:#fff; box-shadow:0 0 0 1px #E5E8EB, 0 1px 2px rgba(16,16,20,.04); text-decoration:none; color:#0A0A0A; transition:box-shadow .2s; }
.rs2 > a:hover{ box-shadow:0 0 0 1px #CFCFCA, 0 8px 20px -12px rgba(16,16,20,.25); }
.rs-logo{ width:40px; height:40px; border-radius:10px; display:grid; place-items:center; background:#F8F9FC; flex:none; }
.rs-logo svg{ width:22px; height:22px; }
.rs2 .rs-v{ display:flex; flex-direction:column; gap:3px; }
.rs2 .rs-v b{ display:flex; align-items:baseline; gap:6px; font-size:22px; font-weight:550; letter-spacing:-0.03em; line-height:1; color:#0A0A0A; }
.rs2 .rs-v b small{ font-size:12.5px; font-weight:500; letter-spacing:0; color:#66666D; }
.rs-st{ display:flex; gap:2px; } .rs-st i{ width:13px; height:13px; display:block; }
.rs-st.g i{ background:#F5A524; -webkit-mask:var(--star) center/13px no-repeat; mask:var(--star) center/13px no-repeat; }
.rs-st.t i{ background:#00B67A url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M6 1.6l1.25 2.7 2.95.33-2.2 2 .62 2.9L6 8.05 3.38 9.53 4 6.63l-2.2-2 2.95-.33z' fill='%23fff'/%3E%3C/svg%3E") center/10px no-repeat; border-radius:1px; }
.rs-st.t i.h{ background-color:#DCDCE0; }
.rs2{ --star:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M6 .8l1.6 3.4 3.7.4-2.8 2.5.8 3.7L6 9 2.7 10.8l.8-3.7L.7 4.6l3.7-.4z'/%3E%3C/svg%3E"); }

@media (max-width:1023px){
}
@media (max-width:719px){
  }


/* ── Hero right v3 (owner: "very regular and AI looks, make it something best" + "use another color in bg"):
   light lilac half; the ten sizes as a ladder of bars growing with storage, a readout of the lit size above ── */
.hs-dark{ background:#ECE9FF; }
.hs-art{ justify-content:center; }
.lad{ display:flex; flex-direction:column; gap:28px; }
.lad-read{ display:flex; flex-direction:column; gap:6px; }
.lad-k{ font:500 11.5px var(--mono); letter-spacing:.09em; text-transform:uppercase; color:#6B5FD8; }
.lad-k b{ font-weight:500; color:var(--brand); }
.lad-name{ font-size:clamp(34px, 3.4vw, 48px); font-weight:550; letter-spacing:-0.045em; line-height:1.02; color:#0A0A0A; }
.lad-spec{ font-size:15px; color:#4B4670; }
.lad-price{ margin-top:4px; font-size:14px; color:#4B4670; } .lad-price b{ font-size:22px; font-weight:550; letter-spacing:-0.03em; color:#0A0A0A; } .lad-price small{ font-size:12.5px; color:#7D77A6; }
.lad-bars{ display:grid; grid-template-columns:repeat(10, 1fr); gap:8px; align-items:end; height:280px; padding-bottom:26px; position:relative; }
.lad-bars::after{ content:""; position:absolute; left:0; right:0; bottom:26px; height:1px; background:#CFC8FF; }
.lad-b{ all:unset; cursor:pointer; position:relative; height:100%; display:flex; flex-direction:column; justify-content:flex-end; }
.lad-b i{ display:block; height:var(--h); border-radius:6px 6px 2px 2px; background:#fff; box-shadow:inset 0 0 0 1px #D9D3FF; transition:background .35s, box-shadow .35s, transform .35s; transform-origin:bottom; }
.lad-b.lt i{ background:#DDD8FF; box-shadow:none; }
.lad-b.on i{ background:var(--brand); box-shadow:0 10px 24px -10px rgba(91,76,232,.7); }
.lad-b:hover i{ transform:scaleY(1.02); }
.lad-b span{ position:absolute; left:0; right:0; bottom:-24px; text-align:center; font:11px var(--mono); color:#7D77A6; }
.lad-b.on span{ color:var(--brand); font-weight:500; }
.lad-b:focus-visible i{ outline:2px solid var(--brand); outline-offset:3px; }
.lad-foot{ display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; font:11.5px var(--mono); color:#7D77A6; }
@media (prefers-reduced-motion:reduce){ .lad-b i{ transition:none; } }
@media (max-width:1023px){ .hs-art{ background:#ECE9FF; } }
@media (max-width:719px){ .lad-bars{ height:200px; gap:5px; } .lad-b span{ font-size:9.5px; } }



/* ── Hero right v4 (owner: "check flynode.io/wordpress"): a dark FlyPanel window telling one short story on the lilac
   half, a restore from our own backups, stepped like FlyNode's staging-to-live panel; a flat violet tour card under it ── */
.hs-art{ gap:14px; padding-right:24px; }
.rw{ position:relative; width:100%; max-width:470px; margin:0 auto; padding:0 14px 14px; border-radius:18px; background:#141416; box-shadow:0 0 0 1px rgba(0,0,0,.4), 0 40px 80px -36px rgba(40,30,120,.55); color:#EDEDED; }
.rw-bar{ height:40px; display:flex; align-items:center; gap:6px; margin:0 -14px 12px; padding:0 16px; border-bottom:1px solid rgba(255,255,255,.07); }
.rw-bar > i{ width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.16); }
.rw-bar > span{ margin:0 auto; font:11.5px var(--mono); color:#6E6E6E; }
.rw-bar em{ font-style:normal; display:inline-flex; align-items:center; gap:6px; font:11.5px var(--mono); color:#A1A1A1; }
.rw-bar em i{ width:6px; height:6px; border-radius:50%; background:var(--green); }
.rw-card{ border-radius:12px; padding:14px 16px; background:#fff; color:#0A0A0A; display:flex; flex-direction:column; gap:8px; transition:box-shadow .4s, opacity .4s; }
.rw-row{ display:flex; align-items:center; gap:10px; }
.rw-tag{ font:500 10.5px var(--mono); letter-spacing:.08em; text-transform:uppercase; padding:3px 7px; border-radius:5px; }
.rw-tag.v{ color:var(--brand); background:var(--brand-soft); } .rw-tag.g{ color:#0E8A57; background:#E2F5EA; }
.rw-mono{ font:12.5px var(--mono); color:#2A2A2E; }
.rw-card b{ font-size:15px; font-weight:550; letter-spacing:-0.01em; }
.rw-ok{ display:flex; align-items:center; gap:6px; font-size:13px; color:#0E8A57; } .rw-ok svg{ width:13px; height:13px; }
.rw-mid{ position:relative; display:flex; justify-content:center; padding:10px 0; }
.rw-mid::before{ content:""; position:absolute; left:50%; top:0; bottom:0; width:1px; background:rgba(255,255,255,.12); }
.rw-btn{ position:relative; display:inline-flex; align-items:center; gap:8px; height:34px; padding:0 14px; border-radius:9px; font-size:13px; font-weight:500; color:#D6D6D6; background:#1E1E21; box-shadow:inset 0 0 0 1px rgba(255,255,255,.14); transition:background .35s, color .35s, box-shadow .35s; }
.rw-btn svg{ width:14px; height:14px; }
.rw-st{ display:flex; align-items:center; gap:8px; font-size:13.5px; color:#55555C; }
.rw-st i{ width:8px; height:8px; border-radius:50%; background:#E5484D; box-shadow:0 0 0 3px #FDE8E8; transition:background .35s, box-shadow .35s; flex:none; }
.rw-chips{ display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.rw-chips span{ font:11.5px var(--mono); color:#A1A1A1; padding:5px 8px; border-radius:6px; background:#1A1A1D; box-shadow:inset 0 0 0 1px rgba(255,255,255,.07); }
.rw-chips span:first-child{ color:#C9C2FF; }
/* steps */
.rw.s1 .rw-pt, .rw.s2 .rw-pt{ box-shadow:0 0 0 2px var(--brand), 0 0 0 6px rgba(91,76,232,.25); }
.rw.s2 .rw-btn, .rw.s3 .rw-btn{ background:var(--brand); color:#fff; box-shadow:0 8px 20px -8px rgba(91,76,232,.8); }
.rw.s2 .rw-spin{ animation:rwspin 1s linear infinite; }
@keyframes rwspin{ to{ transform:rotate(-360deg); } }
.rw.s2 .rw-st i{ background:#F5A524; box-shadow:0 0 0 3px #FDF1DC; }
.rw.s3 .rw-st i{ background:var(--green); box-shadow:0 0 0 3px #E2F5EA; }
.rw.s3 .rw-st{ color:#0E8A57; font-weight:500; }
.rw.s3 .rw-live{ box-shadow:0 0 0 2px var(--green), 0 0 0 6px rgba(47,180,99,.2); }

.tour{ position:relative; width:100%; max-width:470px; margin:0 auto; display:flex; flex-direction:column; gap:6px; padding:20px 22px; border-radius:16px; background:var(--brand); color:#fff; text-decoration:none; overflow:hidden; box-shadow:0 30px 60px -36px rgba(40,30,120,.7); transition:background .2s; }
.tour:hover{ background:var(--brand-hover); }
.tour-k{ display:inline-flex; align-items:center; gap:8px; font:500 10.5px var(--mono); letter-spacing:.08em; text-transform:uppercase; color:#DCD7FF; }
.tour-k i{ width:6px; height:6px; border-radius:2px; background:#fff; }
.tour b{ font-size:22px; font-weight:550; letter-spacing:-0.03em; }
.tour-d{ font-size:13.5px; color:#E4E0FF; max-width:15em; }
.tour-go{ display:inline-flex; align-items:center; gap:6px; margin-top:6px; font-size:13.5px; font-weight:550; }
.tour-go svg{ width:13px; height:13px; transition:transform .2s; } .tour:hover .tour-go svg{ transform:translateY(2px); }
.tour-win{ position:absolute; right:-18px; bottom:-22px; width:190px; height:128px; border-radius:10px; background:#fff; box-shadow:0 20px 40px -16px rgba(0,0,0,.35); display:grid; grid-template-columns:40px 1fr; grid-template-rows:20px 1fr; overflow:hidden; transform:rotate(-4deg); }
.tw-b{ grid-column:1 / -1; display:flex; gap:4px; align-items:center; padding:0 8px; border-bottom:1px solid #EEE; } .tw-b i{ width:5px; height:5px; border-radius:50%; background:#DDD; }
.tw-l{ display:grid; gap:5px; align-content:start; padding:8px 6px; border-right:1px solid #EEE; } .tw-l i{ height:5px; border-radius:2px; background:#EEE; } .tw-l i.on{ background:var(--brand); }
.tw-m{ display:grid; gap:6px; align-content:start; padding:10px; } .tw-m s{ display:block; height:16px; border-radius:4px; background:#F2F2F2; } .tw-m s.v{ background:var(--brand-soft); height:28px; }
.hs-cap{ margin:0 auto; width:100%; max-width:470px; }

@media (prefers-reduced-motion:reduce){ .rw-spin{ animation:none !important; } .rw-card, .rw-btn, .rw-st i{ transition:none; } }
@media (max-width:719px){ .tour-win{ width:140px; height:100px; right:-24px; } .tour-d{ max-width:12em; } }

.rw-tick{ display:none; } .rw.s3 .rw-tick{ display:block; } .rw.s3 .rw-spin{ display:none; }

/* ── Pricing v3, like flynode.io/wordpress (owner: "price table hoynai ektu o"): light Stone section, centred header with a
   dot eyebrow, Even title, one line, and two centred switches (size group, billing + "2 months free"); the table runs the
   full frame width with square edges on a lighter band, columns split by hairlines, the popular column white with a
   violet top line; an "every size includes" band under it ── */
.pq-sec{ background:#F3F3F1; }
.pq-sec .rails .in{ border-color:#E5E8EB; } .pq-sec .rails i{ display:none; }
.pq-head{ position:relative; z-index:1; padding:128px 24px 48px; display:flex; flex-direction:column; align-items:center; text-align:center; }
.pq-eb{ display:inline-flex; align-items:center; gap:8px; font:500 11.5px var(--mono); letter-spacing:.1em; text-transform:uppercase; color:var(--brand); }
.pq-eb i{ width:6px; height:6px; border-radius:2px; background:var(--brand); }
.pq-t{ margin:16px 0 0; font-weight:550; }
.pq-t span{ display:block; letter-spacing:-0.045em; font-size:clamp(30px, 3.4vw, 48px); line-height:1.06; }
.pq-t .a{ color:#0A0A0A; } .light .pq-t .b{ color:#9A9AA2; margin-top:.04em; }
.pq-head p{ margin:16px 0 0; max-width:34em; font-size:17px; line-height:1.55; color:#55555C; }
.pq-ctl{ margin-top:28px; display:flex; align-items:center; justify-content:center; gap:12px 16px; flex-wrap:wrap; }
.pq-seg{ display:inline-flex; gap:2px; padding:4px; border-radius:12px; background:#fff; box-shadow:inset 0 0 0 1px #E5E8EB, 0 1px 2px rgba(16,16,20,.04); }
.pq-seg button{ all:unset; cursor:pointer; height:36px; padding:0 16px; border-radius:8px; display:inline-flex; align-items:center; font-size:14px; font-weight:500; color:#55555C; transition:background .15s, color .15s; }
.pq-seg button:hover{ color:#0A0A0A; }
.pq-seg button[aria-selected="true"], .pq-seg button[aria-pressed="true"]{ background:var(--brand); color:#fff; box-shadow:0 1px 2px rgba(40,30,120,.25); }
.pq-seg button:focus-visible{ outline:2px solid var(--brand); outline-offset:2px; }
.pq-bill{ display:inline-flex; align-items:center; gap:10px; }
.pq-free{ font:500 12px var(--mono); color:#0E8A57; background:#E2F5EA; padding:5px 9px; border-radius:7px; }

.pq-band{ position:relative; z-index:1; border-top:1px solid #E5E8EB; border-bottom:1px solid #E5E8EB; background:#FAFAF8; }
.pq{ display:grid; grid-template-columns:repeat(var(--n, 4), minmax(0, 1fr)); border-left:1px solid #E5E8EB; border-right:1px solid #E5E8EB; }
.pq-col{ position:relative; display:flex; flex-direction:column; padding:32px; transition:background .3s; }
.pq-col + .pq-col{ border-left:1px solid #E5E8EB; }
.pq-col.pop{ background:#fff; }
.pq-col.pop::before{ content:""; position:absolute; left:-1px; right:-1px; top:-1px; height:3px; background:var(--brand); }
.pq-col.flash{ background:#F3F1FF; }
.pq-h{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.pq-h b{ font-size:17px; font-weight:550; letter-spacing:-0.015em; color:#0A0A0A; }
.pq-badge{ font-size:11.5px; font-weight:500; color:#fff; background:var(--brand); padding:3px 8px; border-radius:6px; white-space:nowrap; }
.pq-use{ margin:6px 0 0; font-size:14px; line-height:1.45; color:#66666D; min-height:2.9em; }
.pq-price{ display:flex; align-items:baseline; gap:4px; margin-top:24px; }
.pq-price b{ font-size:44px; font-weight:550; letter-spacing:-0.045em; line-height:1; color:#0A0A0A; }
.pq-price span{ font-size:14px; color:#8F8F96; }
.pq-note{ margin:10px 0 0; font-size:13px; color:#8F8F96; }
.pq-key{ margin-top:22px; padding:12px 14px; border-radius:10px; background:var(--brand-soft); display:flex; flex-direction:column; gap:2px; }
.pq-key b{ font-size:20px; font-weight:550; letter-spacing:-0.02em; color:var(--brand); } .pq-key span{ font-size:12.5px; color:#6B5FD8; }
.pq-col ul{ list-style:none; margin:22px 0 28px; padding:0; display:grid; gap:11px; font-size:14px; color:#2A2A2E; }
.pq-col li{ display:flex; align-items:center; gap:10px; }
.pq-col li svg{ width:14px; height:14px; flex:none; color:var(--green); }
.pq-col .btn{ margin-top:auto; width:100%; height:46px; font-size:15px; }
.pq-col .btn-ghost{ background:#fff; color:#0A0A0A; box-shadow:inset 0 0 0 1px #E5E8EB, 0 1px 2px rgba(16,16,20,.06); }
.pq-col .btn-ghost:hover{ box-shadow:inset 0 0 0 1px #BDBDC4, 0 1px 2px rgba(16,16,20,.08); }

.pq-incb{ position:relative; z-index:1; background:#EDEDEA; border-bottom:1px solid #E5E8EB; }
.pq-inc{ display:flex; align-items:center; gap:14px 28px; padding:24px 32px; border-left:1px solid #E5E8EB; border-right:1px solid #E5E8EB; }
.pq-k{ font:500 11.5px var(--mono); letter-spacing:.09em; text-transform:uppercase; color:#6E6E75; flex:none; }
.pq-inc ul{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.pq-inc li{ display:inline-flex; align-items:center; gap:6px; height:30px; padding:0 10px; border-radius:8px; font-size:13px; color:#2A2A2E; background:#fff; box-shadow:inset 0 0 0 1px #E5E8EB; }
.pq-inc li::before{ content:""; width:12px; height:12px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M3 7.5l2.5 2.5L11 4.5' fill='none' stroke='%232FB463' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat; }
.pq-foot{ position:relative; z-index:1; margin:0; padding:24px 24px 120px; text-align:center; font-size:13px; color:#8F8F96; }

@media (max-width:1023px){
  .pq{ grid-template-columns:1fr 1fr; } .pq-col:nth-child(odd){ border-left:0; } .pq-col:nth-child(n+3){ border-top:1px solid #E5E8EB; }
  .pq-inc{ flex-direction:column; align-items:flex-start; }
}
@media (max-width:719px){
  .pq-head{ padding:88px 16px 36px; }
  .pq-ctl{ flex-direction:column; width:100%; } .pq-seg.pq-tabs{ width:100%; } .pq-tabs button{ flex:1; justify-content:center; padding:0 6px; font-size:13px; }
  .pq{ grid-template-columns:1fr; border-left:0; border-right:0; } .pq-col{ padding:24px 16px; border-left:0 !important; } .pq-col + .pq-col{ border-top:1px solid #E5E8EB; }
  .pq-use{ min-height:0; }
  .pq-inc{ padding:20px 16px; border-left:0; border-right:0; }
  .pq-foot{ padding:20px 16px 88px; }
}
.pq-seg button{ white-space:nowrap; }
@media (max-width:719px){ .pq-tabs button{ font-size:12.5px; padding:0 4px; } }

/* ── Pricing as a slider (owner: "make it a slider, not tab based"): all ten sizes in one row, four in view on desktop,
   two on tablets, one and a peek on phones; arrows, swipe (scroll-snap) or the size picker move it; a rail shows where you are ── */
.pq-nav{ display:inline-flex; align-items:center; gap:10px; }
.pq-arrow{ all:unset; cursor:pointer; width:40px; height:40px; border-radius:50%; display:grid; place-items:center; background:#fff; color:#0A0A0A; box-shadow:inset 0 0 0 1px #E5E8EB, 0 1px 2px rgba(16,16,20,.06); transition:background .15s, color .15s, box-shadow .15s, opacity .15s; }
.pq-arrow svg{ width:15px; height:15px; }
.pq-arrow:hover:not(:disabled){ background:var(--brand); color:#fff; box-shadow:0 6px 14px -6px rgba(91,76,232,.6); }
.pq-arrow:disabled{ opacity:.35; cursor:default; }
.pq-arrow:focus-visible{ outline:2px solid var(--brand); outline-offset:2px; }
.pq-pos{ min-width:118px; text-align:center; font:500 12.5px var(--mono); color:#55555C; }
.pq-vp{ overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; border-left:1px solid #E5E8EB; border-right:1px solid #E5E8EB; overscroll-behavior-x:contain; }
.pq-vp::-webkit-scrollbar{ display:none; }
.pq-vp .pq{ display:flex; border:0; }
.pq-vp .pq-col{ flex:0 0 25%; scroll-snap-align:start; }
.pq-vp .pq-col:first-child{ border-left:0; }
.pq-no{ font:12px var(--mono); color:#A1A1A8; }
.pq-rail{ position:relative; height:3px; background:#E5E8EB; }
.pq-rail i{ position:absolute; top:0; bottom:0; left:30%; width:40%; background:var(--brand); transition:left .3s, width .3s; }
@media (max-width:1023px){ .pq-vp .pq-col{ flex-basis:50%; } .pq-vp .pq-col:nth-child(n+3){ border-top:0; } .pq-vp .pq-col:nth-child(odd){ border-left:1px solid #E5E8EB; } .pq-vp .pq-col:first-child{ border-left:0; } }
@media (max-width:719px){ .pq-vp{ border:0; } .pq-vp .pq-col{ flex-basis:86%; border-top:0 !important; border-left:1px solid #E5E8EB !important; } .pq-vp .pq-col:first-child{ border-left:0 !important; } .pq-nav{ width:100%; justify-content:space-between; } }
@media (prefers-reduced-motion:reduce){ .pq-rail i{ transition:none; } }

/* ═══ Pricing · step 11b C (owner pick, 2026-10-30): minimal header, range slider with a label on the thumb, a plan card
   with a billing receipt, a "what you get" panel, "every size" on one line. Classes px-* so nothing collides. ═══ */
.px-in{ position:relative; z-index:1; padding:120px 24px 120px; }
.px-ph{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px 24px; flex-wrap:wrap; }
.px-k{ font:500 11.5px var(--mono); letter-spacing:.1em; text-transform:uppercase; color:var(--brand); display:inline-flex; align-items:center; gap:8px; }
.px-k i{ width:6px; height:6px; border-radius:2px; background:var(--brand); }
.px-t{ margin:8px 0 0; font-size:clamp(28px, 3vw, 42px); font-weight:550; letter-spacing:-0.045em; line-height:1.08; color:#0A0A0A; }
.px-t span{ color:#9A9AA2; }
.px-bill{ display:inline-flex; align-items:center; gap:10px; }
.px-seg{ display:inline-flex; gap:2px; padding:4px; border-radius:12px; background:#fff; box-shadow:inset 0 0 0 1px #E5E8EB, 0 1px 2px rgba(16,16,20,.04); }
.px-seg button{ all:unset; cursor:pointer; height:34px; padding:0 14px; border-radius:8px; display:inline-flex; align-items:center; font-size:14px; font-weight:500; color:#55555C; white-space:nowrap; }
.px-seg button[aria-pressed="true"]{ background:var(--brand); color:#fff; box-shadow:0 1px 2px rgba(40,30,120,.25); }
.px-seg button:focus-visible{ outline:2px solid var(--brand); outline-offset:2px; }
.px-free{ white-space:nowrap; font:500 12px var(--mono); color:#0E8A57; background:#E2F5EA; padding:5px 9px; border-radius:7px; }

.px-sl{ margin-top:40px; }
.px-track{ position:relative; height:44px; }
.px-track input{ position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:pointer; z-index:3; }
.px-rail{ position:absolute; left:0; right:0; top:28px; height:6px; border-radius:3px; background:#DDDDD8; }
.px-fill{ position:absolute; left:0; top:28px; height:6px; border-radius:3px; background:var(--brand); width:var(--p); transition:width .25s cubic-bezier(.2,.8,.2,1); }
.px-stop{ position:absolute; top:29px; width:4px; height:4px; margin-left:-2px; border-radius:50%; background:#B9B9B2; }
.px-stop.lt{ background:rgba(255,255,255,.55); }
.px-thumb{ position:absolute; top:20px; left:var(--p); width:22px; height:22px; margin-left:-11px; border-radius:50%; background:#fff; box-shadow:0 0 0 1px rgba(16,16,20,.08), 0 0 0 5px var(--brand), 0 8px 16px -4px rgba(91,76,232,.55); transition:left .25s cubic-bezier(.2,.8,.2,1); pointer-events:none; }
.px-tip{ position:absolute; top:-8px; left:var(--p); transform:translateX(-50%); font:500 11.5px var(--mono); color:#fff; background:#0A0A0A; padding:3px 7px; border-radius:6px; white-space:nowrap; transition:left .25s cubic-bezier(.2,.8,.2,1); pointer-events:none; }
.px-tip::after{ content:""; position:absolute; left:50%; bottom:-4px; width:8px; height:8px; margin-left:-4px; background:#0A0A0A; transform:rotate(45deg); border-radius:1px; z-index:-1; }
.px-track input:focus-visible ~ .px-thumb{ box-shadow:0 0 0 5px var(--brand), 0 0 0 10px rgba(91,76,232,.22); }
.px-lab{ position:relative; height:20px; margin-top:8px; }
.px-lab button{ all:unset; cursor:pointer; position:absolute; transform:translateX(-50%); font:11.5px var(--mono); color:#8F8F96; white-space:nowrap; }
.px-lab button.on{ color:var(--brand); font-weight:500; }
.px-lab button:first-child{ transform:none; } .px-lab button:last-child{ transform:translateX(-100%); }

.px-two{ margin-top:28px; display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1.2fr); gap:16px; align-items:stretch; }
.px-cd{ background:#fff; border-radius:18px; box-shadow:0 0 0 2px var(--brand), 0 30px 60px -36px rgba(91,76,232,.5); padding:30px; display:flex; flex-direction:column; }
.px-hd{ display:flex; flex-direction:column; gap:6px; }
.px-ck{ font:500 11px var(--mono); letter-spacing:.09em; text-transform:uppercase; color:var(--brand); }
.px-nm{ display:flex; align-items:center; gap:10px; font-size:26px; font-weight:550; letter-spacing:-0.035em; color:#0A0A0A; }
.px-pop{ letter-spacing:0; font-size:11px; font-weight:500; color:#fff; background:var(--brand); padding:3px 8px; border-radius:6px; white-space:nowrap; }
.px-use{ font-size:14px; color:#66666D; }
.px-pr{ margin-top:22px; display:flex; align-items:baseline; gap:4px; } .px-pr b{ font-size:56px; font-weight:550; letter-spacing:-0.05em; line-height:1; color:#0A0A0A; transition:opacity .18s, transform .18s; } .px-pr b.out{ opacity:0; transform:translateY(4px); } .px-pr span{ font-size:14px; color:#8F8F96; }
.px-nt{ margin-top:8px; font-size:13px; color:#8F8F96; }
.px-rc{ margin:22px 0 0; padding:4px 16px; border-radius:12px; background:#FAFAF8; box-shadow:inset 0 0 0 1px #EEEEEA; }
.px-rc div{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:11px 0; font-size:13.5px; }
.px-rc div + div{ border-top:1px dashed #E5E8EB; }
.px-rc dt{ color:#66666D; } .px-rc dd{ margin:0; font-weight:550; color:#0A0A0A; } .px-rc s{ color:#A1A1A8; font-weight:500; }
.px-rc .px-sv dt, .px-rc .px-sv dd{ color:#0E8A57; }
.px-ft{ margin-top:auto; padding-top:22px; } .px-ft .btn{ width:100%; }
.px-tr{ list-style:none; margin:14px 0 0; padding:0; display:flex; justify-content:center; flex-wrap:wrap; gap:6px 14px; font-size:12.5px; color:#8F8F96; }
.px-tr li, .px-gt ul li{ display:inline-flex; align-items:center; gap:6px; }
.px-tr li::before, .px-gt ul li::before, .px-inc span:not(.k)::before{ content:""; width:11px; height:11px; flex:none; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M3 7.5l2.5 2.5L11 4.5' fill='none' stroke='%232FB463' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/11px no-repeat; }
.px-gt{ background:#fff; border-radius:18px; box-shadow:0 0 0 1px #E5E8EB, 0 1px 2px rgba(16,16,20,.04); padding:26px 28px; }
.px-gk{ font:500 11px var(--mono); letter-spacing:.09em; text-transform:uppercase; color:#8F8F96; }
.px-gt dl{ margin:14px 0 0; display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.px-gt dl div{ display:flex; align-items:center; gap:12px; padding:12px; border-radius:12px; background:#FAFAF8; box-shadow:inset 0 0 0 1px #EEEEEA; }
.px-ic{ width:30px; height:30px; flex:none; border-radius:8px; display:grid; place-items:center; background:var(--brand-soft); color:var(--brand); } .px-ic svg{ width:15px; height:15px; }
.px-gt dt{ font-size:12.5px; color:#8F8F96; } .px-gt dd{ margin:2px 0 0; font-size:17px; font-weight:550; letter-spacing:-0.02em; color:#0A0A0A; }
.px-gt ul{ list-style:none; margin:18px 0 0; padding:16px 0 0; border-top:1px solid #EEEEEA; display:grid; grid-template-columns:1fr 1fr; gap:10px 16px; font-size:13.5px; color:#2A2A2E; }
.px-inc{ margin-top:16px; display:flex; align-items:center; gap:6px; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; }
.px-inc::-webkit-scrollbar{ display:none; }
.px-inc .k{ flex:none; margin-right:4px; font:500 11px var(--mono); letter-spacing:.09em; text-transform:uppercase; color:#8F8F96; }
.px-inc span:not(.k){ flex:none; display:inline-flex; align-items:center; gap:6px; height:26px; padding:0 8px; border-radius:7px; background:#fff; box-shadow:inset 0 0 0 1px #E5E8EB; font-size:12px; color:#2A2A2E; white-space:nowrap; }
.px-sample{ margin:14px 0 0; font-size:12.5px; color:#8F8F96; }
@media (max-width:1023px){ .px-two{ grid-template-columns:1fr; } .px-inc{ margin:16px -24px 0; padding:0 24px; } }
@media (max-width:719px){
  .px-in{ padding:88px 16px; }
  .px-lab button:nth-child(even){ visibility:hidden; } .px-lab button{ font-size:10.5px; }
  .px-cd, .px-gt{ padding:22px 18px; } .px-gt dl, .px-gt ul{ grid-template-columns:1fr; }
  .px-inc{ margin:16px -16px 0; padding:0 16px; }
}
@media (prefers-reduced-motion:reduce){ .px-fill, .px-thumb, .px-tip, .px-pr b{ transition:none; } }

/* ── Hero tweaks (owner, 2026-10-30): content 16px higher (the bigger title was undone); feature boxes shorter (icon beside text) ── */
.hs-copy{ padding-top:48px; padding-bottom:80px; }
.hs-feats li{ display:grid; grid-template-columns:28px 1fr; grid-template-rows:auto auto; column-gap:10px; row-gap:0; align-items:center; padding:10px 12px; }
.hs-feats .hs-fi{ grid-row:span 2; margin:0; }
.hs-feats b{ font-size:13.5px; line-height:1.25; } .hs-feats li > span:last-child{ font-size:12px; line-height:1.3; }
@media (max-width:719px){ .hs-copy{ padding-top:36px; padding-bottom:48px; } }
.hs-feats li{ grid-template-columns:22px 1fr; column-gap:8px; row-gap:3px; padding:10px 12px 11px; }
.hs-feats .hs-fi{ grid-row:auto; width:22px; height:22px; border-radius:6px; } .hs-feats .hs-fi svg{ width:12px; height:12px; }
.hs-feats li > span:last-child{ grid-column:1 / -1; white-space:nowrap; }

/* WordPress Hosting hero title: always four lines (owner, 2026-10-31) */
.hs-t.four .ln{ display:block; white-space:nowrap; }
@media (max-width:719px){ .hs-t.four .l1, .hs-t.four .l2{ font-size:clamp(26px, 7.8vw, 40px); } }