/*
Theme Name: Hostify
Theme URI: https://hostify.com
Author: Hostify
Author URI: https://hostify.com
Description: A fast, secure, fully responsive WooCommerce theme for hosting providers, digital agencies and online stores. Built mobile-first, optimised for Core Web Vitals, and compatible with WooCommerce, WPBakery Page Builder, Elementor and Slider Revolution. Ships with a guided setup wizard and one-click demo import.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hostify
Tags: e-commerce, one-column, two-columns, right-sidebar, left-sidebar, custom-logo, custom-menu, editor-style, featured-images, full-width-template, sticky-post, threaded-comments, translation-ready, wide-blocks, block-patterns

Hostify is distributed under the terms of the GNU GPL v2 or later.
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.
*/

/* ==========================================================================
   HOSTIFY — Design System
   Palette: deep infra-navy + signal teal (uptime) + amber (action)
   Type: Space Grotesk (display) / Inter (body) / JetBrains Mono (data, terminal)
   ========================================================================== */

/* Fonts are loaded via wp_enqueue_style() with rel=preconnect in functions.php — not @import — for performance (@import blocks parallel download). */

:root{
  --navy-950:#080d18;
  --navy-900:#0a1120;
  --navy-800:#101b33;
  --navy-700:#16223f;
  --navy-600:#212f52;
  --line:rgba(234,240,250,.09);
  --line-strong:rgba(234,240,250,.16);
  --text:#eaf0fa;
  --text-muted:#93a0bc;
  --teal:#16e0bd;
  --teal-dim:#0ea893;
  --teal-glow:rgba(22,224,189,.35);
  --amber:#ff8a3d;
  --amber-dim:#e06f22;
  --red:#ff5c72;
  --light-bg:#f5f7fb;
  --light-panel:#ffffff;
  --light-line:#e4e8f1;
  --light-text:#101828;
  --light-muted:#5b6478;
  --radius-sm:8px;
  --radius:14px;
  --radius-lg:22px;
  --mono:'JetBrains Mono',monospace;
  --display:'Space Grotesk',sans-serif;
  --body:'Inter',sans-serif;
  --shadow-soft:0 20px 60px -20px rgba(8,13,24,.5);
  --container:1240px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--body);
  background:var(--light-bg);
  color:var(--light-text);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3,h4{font-family:var(--display);margin:0;line-height:1.1;letter-spacing:-.01em}
p{margin:0}
button{font-family:inherit;cursor:pointer}
.container{max-width:var(--container);margin:0 auto;padding:0 24px}
section{position:relative}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
@media (prefers-reduced-motion: reduce){*{animation-duration:.001ms !important;transition-duration:.001ms !important}}

/* ---------- Eyebrow / labels ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--teal-dim);margin-bottom:14px;
}
.eyebrow::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 4px var(--teal-glow)}
section.on-dark .eyebrow{color:var(--teal)}

/* ---------- Rack-unit tick divider (signature motif) ---------- */
.rack-divider{
  height:26px;width:100%;
  background-image:repeating-linear-gradient(90deg, var(--light-line) 0 1px, transparent 1px 34px);
  position:relative;
}
.rack-divider::after{
  content:'';position:absolute;left:0;right:0;top:12px;height:1px;background:var(--light-line);
}
.on-dark .rack-divider{background-image:repeating-linear-gradient(90deg, var(--line-strong) 0 1px, transparent 1px 34px)}
.on-dark .rack-divider::after{background:var(--line-strong)}

/* ================= TOP UTILITY / STATUS STRIP ================= */
.status-strip{
  background:var(--navy-950);color:var(--text-muted);
  font-family:var(--mono);font-size:12.5px;
  border-bottom:1px solid var(--line);
}
.status-strip .container{display:flex;align-items:center;justify-content:space-between;height:36px;gap:20px}
.status-strip .ticker{display:flex;align-items:center;gap:22px;overflow:hidden;white-space:nowrap}
.status-strip .ticker span{display:inline-flex;align-items:center;gap:7px}
.status-strip .dot{width:6px;height:6px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 3px var(--teal-glow);animation:blink 2.4s ease-in-out infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.35}}
.status-strip .util-links{display:flex;gap:16px}
.status-strip .util-links a:hover{color:var(--text)}
@media (max-width:860px){.status-strip .util-links{display:none}}

/* ================= HEADER / NAV ================= */
header.site-header{
  background:var(--navy-900);
  position:sticky;top:0;z-index:200;
  border-bottom:1px solid var(--line);
}
.nav-row{display:flex;align-items:center;justify-content:space-between;height:78px;gap:24px}
.logo{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:700;font-size:22px;color:var(--text)}
.logo .mark{
  width:34px;height:34px;border-radius:9px;
  background:linear-gradient(145deg,var(--teal),var(--teal-dim));
  display:flex;align-items:center;justify-content:center;color:var(--navy-950);font-weight:700;font-family:var(--mono);
  box-shadow:0 0 0 4px rgba(22,224,189,.12);
}
.logo .tld{color:var(--teal);font-weight:500}

nav.main-nav{display:flex;align-items:center;gap:2px}
nav.main-nav > ul{display:flex;align-items:center;gap:2px}
nav.main-nav > ul > li{position:relative}
nav.main-nav > ul > li > a{
  display:flex;align-items:center;gap:6px;padding:12px 14px;border-radius:8px;
  color:var(--text);font-size:14.5px;font-weight:500;
}
nav.main-nav > ul > li > a:hover, nav.main-nav > ul > li.open > a{background:var(--navy-800);color:var(--teal)}
nav.main-nav .caret{width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin-top:-3px;transition:transform .2s}
nav.main-nav > ul > li.open .caret{transform:rotate(-135deg);margin-top:3px}

.header-actions{display:flex;align-items:center;gap:10px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 20px;border-radius:9px;font-weight:600;font-size:14px;border:1px solid transparent;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
  white-space:nowrap;
}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--amber);color:#231202}
.btn-primary:hover{background:var(--amber-dim);box-shadow:0 8px 22px -8px rgba(255,138,61,.6)}
.btn-ghost-dark{color:var(--text);border-color:var(--line-strong)}
.btn-ghost-dark:hover{border-color:var(--teal);color:var(--teal)}
.btn-teal{background:var(--teal);color:#062723}
.btn-teal:hover{background:var(--teal-dim)}
.btn-outline{border-color:var(--light-line);color:var(--light-text)}
.btn-outline:hover{border-color:var(--navy-700)}
.btn-sm{padding:8px 14px;font-size:13px}
.btn-block{width:100%}

.mobile-toggle{display:none;background:none;border:0;color:var(--text);padding:6px}
@media (max-width:1080px){
  nav.main-nav{display:none}
  .header-actions .btn-ghost-dark{display:none}
  .mobile-toggle{display:block}
}

/* Mega dropdown panels */
.mega{
  position:absolute;top:100%;left:0;margin-top:8px;
  background:var(--navy-800);border:1px solid var(--line-strong);border-radius:var(--radius);
  box-shadow:var(--shadow-soft);padding:22px;display:none;z-index:50;
}
li.open > .mega{display:grid}
.mega.mega-services, .mega.mega-products{grid-template-columns:repeat(3,220px);gap:6px 22px;width:max-content}
.mega.mega-hosting{grid-template-columns:repeat(2,240px);gap:6px 22px;width:max-content}
.mega a.mega-item{
  display:flex;gap:12px;align-items:flex-start;padding:10px;border-radius:10px;color:var(--text);
}
.mega a.mega-item:hover{background:var(--navy-700)}
.mega-item .ic{
  width:34px;height:34px;flex:none;border-radius:8px;background:var(--navy-700);
  display:flex;align-items:center;justify-content:center;color:var(--teal);
}
.mega-item .lbl{font-size:13.5px;font-weight:600;color:var(--text)}
.mega-item .sub{font-size:12px;color:var(--text-muted);margin-top:2px;line-height:1.4}
.mega-foot{grid-column:1/-1;border-top:1px solid var(--line);margin-top:8px;padding-top:14px;display:flex;justify-content:space-between;align-items:center}
.mega-foot a{color:var(--teal);font-size:13px;font-weight:600}

/* ================= HERO ================= */
.hero{
  background:
    radial-gradient(900px 500px at 85% -10%, rgba(22,224,189,.14), transparent 60%),
    radial-gradient(700px 400px at 5% 110%, rgba(255,138,61,.12), transparent 60%),
    var(--navy-900);
  color:var(--text);
  padding:76px 0 0;
  overflow:hidden;
}
.hero .container{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;padding-bottom:56px}
.hero h1{font-size:clamp(34px,4.4vw,56px);font-weight:700;color:var(--text)}
.hero h1 .hl{color:var(--teal)}
.hero p.lead{margin-top:20px;font-size:17.5px;color:var(--text-muted);max-width:560px;line-height:1.6}
.hero .hero-ctas{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}
.hero .trust-row{margin-top:34px;display:flex;gap:26px;flex-wrap:wrap}
.hero .trust-row .t-item{font-size:13px;color:var(--text-muted)}
.hero .trust-row .t-item b{display:block;font-family:var(--display);font-size:22px;color:var(--text)}

/* Terminal domain search — signature element */
.term-card{
  background:var(--navy-950);border:1px solid var(--line-strong);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-soft);overflow:hidden;
}
.term-bar{display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--navy-800);border-bottom:1px solid var(--line)}
.term-bar .dotr{width:10px;height:10px;border-radius:50%}
.term-bar .r1{background:#ff5f56}.term-bar .r2{background:#ffbd2e}.term-bar .r3{background:#27c93f}
.term-bar .path{margin-left:10px;font-family:var(--mono);font-size:12px;color:var(--text-muted)}
.term-body{padding:22px}
.term-body label{font-family:var(--mono);font-size:12.5px;color:var(--teal);letter-spacing:.03em}
.domain-search-form{display:flex;gap:8px;margin-top:10px}
.domain-search-form .prompt-wrap{
  flex:1;display:flex;align-items:center;gap:8px;background:var(--navy-800);
  border:1px solid var(--line-strong);border-radius:9px;padding:0 14px;
}
.domain-search-form .prompt-wrap:focus-within{border-color:var(--teal)}
.domain-search-form .sym{color:var(--teal);font-family:var(--mono)}
.domain-search-form input{
  flex:1;background:none;border:0;color:var(--text);font-family:var(--mono);font-size:15px;padding:13px 0;
}
.domain-search-form input:focus{outline:none}
.domain-search-form input::placeholder{color:var(--text-muted)}
.tld-row{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.tld-chip{
  font-family:var(--mono);font-size:12.5px;color:var(--text-muted);
  border:1px solid var(--line-strong);padding:5px 11px;border-radius:20px;cursor:pointer;background:none;
}
.tld-chip.active,.tld-chip:hover{border-color:var(--teal);color:var(--teal)}
.term-results{margin-top:16px;border-top:1px dashed var(--line-strong);padding-top:16px;display:none}
.term-results.show{display:block}
.result-row{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 14px;border-radius:9px;background:var(--navy-800);margin-bottom:8px;font-family:var(--mono);font-size:14px;
}
.result-row .domain-name{color:var(--text);font-weight:600}
.result-row.available{border-left:3px solid var(--teal)}
.result-row.taken{border-left:3px solid var(--text-muted)}
.result-row .tag{font-size:11px;padding:3px 8px;border-radius:5px;text-transform:uppercase;letter-spacing:.04em}
.result-row.available .tag{background:rgba(22,224,189,.15);color:var(--teal)}
.result-row.taken .tag{background:rgba(147,160,188,.15);color:var(--text-muted)}
.result-row .price{color:var(--amber);font-weight:600;margin-right:6px}
.result-row .actions{display:flex;align-items:center;gap:10px}
.result-row .whois-link{color:var(--text-muted);font-size:12.5px;text-decoration:underline;text-underline-offset:2px}
.term-note{font-family:var(--mono);font-size:11px;color:var(--text-muted);margin-top:10px;line-height:1.6;opacity:.8}
.search-loading{font-family:var(--mono);font-size:13px;color:var(--text-muted);display:none;align-items:center;gap:8px;margin-top:14px}
.search-loading.show{display:flex}
.spin{width:12px;height:12px;border-radius:50%;border:2px solid var(--line-strong);border-top-color:var(--teal);animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* WHOIS modal-in-page (opens as new lightbox "window") */
.whois-modal{position:fixed;inset:0;background:rgba(6,10,20,.7);backdrop-filter:blur(3px);display:none;align-items:center;justify-content:center;z-index:1000;padding:20px}
.whois-modal.show{display:flex}
.whois-window{width:min(560px,100%);background:var(--navy-950);border:1px solid var(--line-strong);border-radius:var(--radius);box-shadow:var(--shadow-soft);overflow:hidden}
.whois-window .term-bar .path{color:var(--text)}
.whois-window pre{
  margin:0;padding:22px;color:var(--text-muted);font-family:var(--mono);font-size:12.5px;line-height:1.8;
  max-height:50vh;overflow:auto;white-space:pre-wrap;
}
.whois-window pre b{color:var(--teal)}
.whois-close{margin-left:auto;background:none;border:0;color:var(--text-muted);font-size:18px;padding:4px 8px}
.whois-close:hover{color:var(--text)}

/* ================= GLOBAL MAP (hero visual) ================= */
.globe-wrap{position:relative}
.globe-card{
  background:var(--navy-950);border:1px solid var(--line-strong);border-radius:var(--radius-lg);
  padding:26px;box-shadow:var(--shadow-soft);
}
.globe-card h4{color:var(--text);font-size:14px;font-weight:600}
.globe-card .cap{color:var(--text-muted);font-size:12.5px;margin-top:4px}
.globe-svg{width:100%;height:auto;margin-top:14px}
.node{fill:var(--teal)}
.node-pulse{fill:none;stroke:var(--teal);stroke-width:1.4;opacity:0}
.pulse-anim{animation:pulse 2.6s ease-out infinite}
@keyframes pulse{0%{r:3;opacity:.9}100%{r:16;opacity:0}}
.region-list{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.region-list li{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--text-muted);font-family:var(--mono)}
.region-list li .dot{width:6px;height:6px;border-radius:50%;background:var(--teal)}

/* ================= SECTION SHELLS ================= */
.section{padding:88px 0}
.section.tight{padding:64px 0}
.section.on-dark{background:var(--navy-900);color:var(--text)}
.section.on-dark p, .section.on-dark .muted{color:var(--text-muted)}
.section.alt{background:var(--light-panel)}
.section-head{max-width:680px;margin-bottom:48px}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center}
.section-head h2{font-size:clamp(26px,3vw,38px)}
.section-head p{margin-top:14px;color:var(--light-muted);font-size:16px;line-height:1.65}
.on-dark .section-head p{color:var(--text-muted)}

/* ================= FEATURE / SERVICE GRID CARDS ================= */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:24px}
@media (max-width:980px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.grid-3,.grid-4,.grid-2{grid-template-columns:1fr}}

.card{
  background:var(--light-panel);border:1px solid var(--light-line);border-radius:var(--radius);
  padding:26px;transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.card:hover{transform:translateY(-4px);box-shadow:0 24px 50px -24px rgba(16,24,40,.25);border-color:transparent}
.on-dark .card{background:var(--navy-800);border-color:var(--line)}
.on-dark .card:hover{box-shadow:0 24px 50px -24px rgba(0,0,0,.5)}
.card .ic{
  width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(150deg,var(--teal),var(--teal-dim));color:#062723;margin-bottom:16px;
}
.card h3{font-size:17.5px;margin-bottom:8px}
.card p{color:var(--light-muted);font-size:14.5px;line-height:1.6}
.on-dark .card p{color:var(--text-muted)}
.card .more{display:inline-flex;align-items:center;gap:6px;margin-top:16px;font-size:13.5px;font-weight:600;color:var(--teal-dim)}
.on-dark .card .more{color:var(--teal)}
.card .more .arrow{transition:transform .15s}
.card:hover .more .arrow{transform:translateX(3px)}

/* Split panel section (image + text) used for the six offering sections */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.split.rev .media{order:2}
.split .media{border-radius:var(--radius-lg);overflow:hidden;position:relative;box-shadow:var(--shadow-soft)}
.split .media img{width:100%;height:100%;object-fit:cover;aspect-ratio:6/5}
.split .badge-float{
  position:absolute;bottom:16px;left:16px;background:rgba(8,13,24,.82);backdrop-filter:blur(6px);
  color:var(--text);padding:10px 14px;border-radius:10px;font-size:12.5px;font-family:var(--mono);
  border:1px solid var(--line-strong);
}
.split .tag-list{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 26px}
.split .tag-list span{
  font-size:13px;padding:7px 13px;border-radius:20px;border:1px solid var(--light-line);color:var(--light-muted);
}
.on-dark .split .tag-list span{border-color:var(--line-strong);color:var(--text-muted)}
@media (max-width:900px){
  .split, .split.rev{grid-template-columns:1fr}
  .split.rev .media{order:0}
}

/* ================= PRICING ================= */
.pricing-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:36px;justify-content:center}
.ptab{
  padding:11px 20px;border-radius:24px;border:1px solid var(--light-line);font-weight:600;font-size:13.5px;color:var(--light-muted);background:var(--light-panel);
}
.ptab.active{background:var(--navy-900);color:var(--text);border-color:var(--navy-900)}
.price-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
@media (max-width:1080px){.price-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.price-grid{grid-template-columns:1fr}}
.price-set{display:none}
.price-set.active{display:grid}
.plan{
  background:var(--light-panel);border:1px solid var(--light-line);border-radius:var(--radius);
  padding:28px 24px;display:flex;flex-direction:column;position:relative;
}
.plan.featured{border-color:var(--navy-900);box-shadow:0 24px 50px -24px rgba(16,24,40,.3)}
.plan .ribbon{
  position:absolute;top:-12px;left:24px;background:var(--amber);color:#231202;font-size:11.5px;font-weight:700;
  padding:5px 12px;border-radius:20px;letter-spacing:.03em;text-transform:uppercase;
}
.plan .pname{font-family:var(--mono);font-size:13px;color:var(--teal-dim);text-transform:uppercase;letter-spacing:.05em}
.plan .pprice{font-family:var(--display);font-size:38px;font-weight:700;margin-top:10px}
.plan .pprice span{font-size:15px;font-weight:500;color:var(--light-muted)}
.plan .pdesc{font-size:13.5px;color:var(--light-muted);margin-top:6px;min-height:36px}
.plan .pfeat{margin:20px 0;flex:1}
.plan .pfeat li{display:flex;gap:9px;align-items:flex-start;font-size:13.5px;color:var(--light-text);padding:6px 0}
.plan .pfeat li::before{content:'✓';color:var(--teal-dim);font-weight:700}

/* ================= TESTIMONIALS ================= */
.test-card{background:var(--light-panel);border:1px solid var(--light-line);border-radius:var(--radius);padding:26px}
.test-card .stars{color:var(--amber);font-size:14px;letter-spacing:2px}
.test-card p{margin:16px 0;font-size:14.5px;line-height:1.7;color:var(--light-text)}
.test-card .who{display:flex;align-items:center;gap:10px}
.test-card .avatar{width:38px;height:38px;border-radius:50%;background:var(--navy-800);color:var(--teal);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:700;font-size:13px}
.test-card .who b{display:block;font-size:13.5px}
.test-card .who span{font-size:12px;color:var(--light-muted)}

/* ================= LOGO STRIP ================= */
.logo-strip{display:flex;flex-wrap:wrap;gap:36px;align-items:center;justify-content:space-between;opacity:.7}
.logo-strip .lg{font-family:var(--display);font-weight:700;font-size:18px;color:var(--light-muted)}

/* ================= FAQ ================= */
.faq-item{border-bottom:1px solid var(--light-line);padding:20px 0}
.faq-q{display:flex;justify-content:space-between;align-items:center;gap:16px;font-weight:600;font-size:15.5px}
.faq-q .plus{width:20px;height:20px;flex:none;position:relative}
.faq-q .plus::before,.faq-q .plus::after{content:'';position:absolute;background:var(--light-text);top:50%;left:0;width:100%;height:2px;transform:translateY(-50%)}
.faq-q .plus::after{transform:translateY(-50%) rotate(90deg);transition:transform .2s}
.faq-item.open .plus::after{transform:translateY(-50%) rotate(0)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .25s ease}
.faq-a p{padding-top:14px;color:var(--light-muted);font-size:14.5px;line-height:1.7}
.faq-item.open .faq-a{max-height:240px}

/* ================= CTA BANNER ================= */
.cta-banner{
  background:linear-gradient(120deg,var(--navy-950),var(--navy-800));
  border-radius:var(--radius-lg);padding:56px;display:flex;align-items:center;justify-content:space-between;gap:30px;
  color:var(--text);position:relative;overflow:hidden;
}
.cta-banner::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(234,240,250,.05) 0 1px,transparent 1px 34px);pointer-events:none}
.cta-banner h3{font-size:clamp(22px,2.6vw,30px)}
.cta-banner p{color:var(--text-muted);margin-top:10px;max-width:420px}
@media (max-width:760px){.cta-banner{flex-direction:column;text-align:center;padding:36px 24px}}

/* ================= FOOTER ================= */
footer.site-footer{background:var(--navy-950);color:var(--text-muted);padding-top:70px}
.footer-top{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:32px;padding-bottom:50px;border-bottom:1px solid var(--line)}
.footer-top h5{color:var(--text);font-size:13.5px;letter-spacing:.04em;text-transform:uppercase;margin-bottom:16px;font-family:var(--mono)}
.footer-top li{margin-bottom:10px;font-size:14px}
.footer-top li a:hover{color:var(--teal)}
.footer-brand p{font-size:13.5px;line-height:1.7;margin-top:14px;max-width:280px}
.footer-social{display:flex;gap:10px;margin-top:20px}
.footer-social a{width:34px;height:34px;border-radius:8px;border:1px solid var(--line-strong);display:flex;align-items:center;justify-content:center}
.footer-social a:hover{border-color:var(--teal);color:var(--teal)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding:24px 0;font-size:12.5px;flex-wrap:wrap;gap:12px}
.footer-bottom .legal-links{display:flex;gap:18px;flex-wrap:wrap}
.footer-bottom .legal-links a:hover{color:var(--teal)}
.payment-icons{display:flex;gap:8px;flex-wrap:wrap}
.payment-icons span{border:1px solid var(--line-strong);border-radius:6px;padding:4px 9px;font-family:var(--mono);font-size:11px}
@media (max-width:980px){.footer-top{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.footer-top{grid-template-columns:1fr}}

/* ================= COOKIE / GDPR CONSENT ================= */
.cookie-bar{
  position:fixed;left:20px;right:20px;bottom:20px;max-width:640px;margin:0 auto;
  background:var(--navy-950);color:var(--text);border:1px solid var(--line-strong);border-radius:var(--radius);
  padding:20px 22px;box-shadow:var(--shadow-soft);z-index:500;display:none;gap:16px;align-items:center;
}
.cookie-bar.show{display:flex}
.cookie-bar p{font-size:13px;color:var(--text-muted);line-height:1.6}
.cookie-bar .actions{display:flex;gap:8px;flex:none}
@media (max-width:640px){.cookie-bar{flex-direction:column;align-items:stretch}}

/* ================= BREADCRUMB / PAGE HERO (inner pages) ================= */
.page-hero{background:var(--navy-900);color:var(--text);padding:52px 0 64px}
.page-hero .crumbs{font-family:var(--mono);font-size:12.5px;color:var(--text-muted);margin-bottom:16px}
.page-hero .crumbs a:hover{color:var(--teal)}
.page-hero h1{font-size:clamp(28px,4vw,42px)}
.page-hero p{margin-top:14px;color:var(--text-muted);max-width:600px;font-size:16px;line-height:1.6}

/* ================= MISC UTILITIES ================= */
.muted{color:var(--light-muted)}
.mt-8{margin-top:8px}.mt-16{margin-top:16px}.mt-24{margin-top:24px}.mt-32{margin-top:32px}.mt-48{margin-top:48px}
.flex{display:flex}.items-center{align-items:center}.gap-8{gap:8px}.gap-12{gap:12px}.gap-16{gap:16px}
.text-center{text-align:center}
.small{font-size:13px}
.badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:5px 11px;border-radius:20px;background:rgba(22,224,189,.12);color:var(--teal-dim)}
.on-dark .badge{background:rgba(22,224,189,.14);color:var(--teal)}
.two-col-list{columns:2;gap:24px}
@media (max-width:640px){.two-col-list{columns:1}}
.two-col-list li{break-inside:avoid;display:flex;gap:9px;padding:7px 0;font-size:14.5px}
.two-col-list li::before{content:'✓';color:var(--teal-dim);font-weight:700}

/* Compare table (used on Web Hosting overview + pricing) */
.compare-table{width:100%;border-collapse:collapse;background:var(--light-panel);border-radius:var(--radius);overflow:hidden;box-shadow:0 1px 0 var(--light-line)}
.compare-table th,.compare-table td{padding:16px 18px;text-align:left;border-bottom:1px solid var(--light-line);font-size:14px}
.compare-table th{font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--light-muted);background:#fafbfd}
.compare-table td.check{color:var(--teal-dim);font-weight:700;text-align:center}
.compare-table tr:last-child td{border-bottom:none}
.table-scroll{overflow-x:auto;border-radius:var(--radius)}

/* Account / auth pages */
.auth-wrap{min-height:70vh;display:flex;align-items:center;justify-content:center;background:var(--light-bg);padding:60px 20px}
.auth-card{width:100%;max-width:440px;background:var(--light-panel);border:1px solid var(--light-line);border-radius:var(--radius-lg);padding:38px;box-shadow:var(--shadow-soft)}
.auth-tabs{display:flex;background:var(--light-bg);border-radius:10px;padding:4px;margin-bottom:26px}
.auth-tabs button{flex:1;padding:10px;border:0;background:none;border-radius:8px;font-weight:600;font-size:13.5px;color:var(--light-muted)}
.auth-tabs button.active{background:var(--navy-900);color:#fff}
.field{margin-bottom:16px}
.field label{display:block;font-size:13px;font-weight:600;margin-bottom:7px}
.field input,.field select{
  width:100%;padding:12px 14px;border:1px solid var(--light-line);border-radius:9px;font-size:14px;font-family:inherit;background:#fff;
}
.field input:focus,.field select:focus{outline:none;border-color:var(--navy-800)}
.field-check{display:flex;align-items:flex-start;gap:9px;font-size:13px;color:var(--light-muted)}
.pane{display:none}
.pane.active{display:block}

/* Cart / checkout */
.cart-line{display:flex;gap:16px;align-items:center;padding:18px 0;border-bottom:1px solid var(--light-line)}
.cart-line img{width:64px;height:64px;border-radius:10px;object-fit:cover}
.cart-line .info{flex:1}
.cart-line .info b{font-size:14.5px}
.cart-line .info span{font-size:12.5px;color:var(--light-muted);display:block;margin-top:3px}
.cart-summary{background:var(--light-panel);border:1px solid var(--light-line);border-radius:var(--radius);padding:24px}
.cart-summary .row{display:flex;justify-content:space-between;font-size:14px;padding:8px 0}
.cart-summary .row.total{border-top:1px solid var(--light-line);margin-top:8px;padding-top:14px;font-weight:700;font-size:16px}
.step-track{display:flex;justify-content:space-between;max-width:520px;margin:0 auto 40px}
.step-track .step{flex:1;text-align:center;font-size:12.5px;color:var(--light-muted);position:relative;font-family:var(--mono)}
.step-track .step::before{content:'';position:absolute;top:-18px;left:50%;transform:translateX(-50%);width:10px;height:10px;border-radius:50%;background:var(--light-line)}
.step-track .step.active::before{background:var(--teal)}
.step-track .step.active{color:var(--light-text);font-weight:700}

/* ==========================================================================
   BLOG / SINGLE POST / ARCHIVE / SEARCH / COMMENTS / SIDEBAR / 404
   Added for full WordPress template coverage (not present in the original
   marketing-page prototype, which only covered landing pages).
   ========================================================================== */

.content-layout{display:grid;grid-template-columns:1fr 320px;gap:48px;align-items:start}
.content-layout:has(.content-main:only-child){grid-template-columns:1fr}
@media (max-width:900px){.content-layout{grid-template-columns:1fr}}
.no-sidebar .content-layout{grid-template-columns:1fr}

.page-header{margin-bottom:32px}
.page-header .page-title{font-size:32px;margin-top:8px}
.archive-description{color:var(--light-muted);margin-top:10px;max-width:640px}

.post-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
@media (max-width:700px){.post-grid{grid-template-columns:1fr}}

.post-card{background:var(--light-panel);border:1px solid var(--light-line);border-radius:var(--radius);overflow:hidden;transition:transform .15s,box-shadow .15s}
.post-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-soft)}
.post-card-thumb{display:block;aspect-ratio:3/2;overflow:hidden;background:var(--light-line)}
.post-card-thumb img{width:100%;height:100%;object-fit:cover}
.post-card-body{padding:20px}
.post-card-meta{font-family:var(--mono);font-size:12px;color:var(--light-muted);margin-bottom:8px}
.post-card-title{font-size:19px;margin-bottom:8px}
.post-card-title a:hover{color:var(--teal-dim)}
.post-card-excerpt{color:var(--light-muted);font-size:14.5px;line-height:1.6;margin-bottom:12px}
.more{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:14px;color:var(--teal-dim)}
.more .arrow{transition:transform .15s}
.more:hover .arrow{transform:translateX(3px)}

.entry-header{margin-bottom:24px}
.entry-title{font-size:34px;margin-top:8px;line-height:1.15}
.entry-meta{font-family:var(--mono);font-size:13px;color:var(--light-muted);margin-top:10px}
.entry-thumbnail{border-radius:var(--radius);overflow:hidden;margin-bottom:28px}
.entry-thumbnail img{width:100%}
.entry-content{font-size:16.5px;line-height:1.75;color:var(--light-text)}
.entry-content h2{font-size:26px;margin:36px 0 14px}
.entry-content h3{font-size:21px;margin:28px 0 12px}
.entry-content p{margin:0 0 18px}
.entry-content ul,.entry-content ol{margin:0 0 18px;padding-left:22px}
.entry-content img{border-radius:var(--radius-sm);margin:18px 0}
.entry-content a{color:var(--teal-dim);text-decoration:underline}
.entry-content blockquote{border-left:3px solid var(--teal);margin:20px 0;padding:4px 20px;color:var(--light-muted);font-style:italic}
.entry-tags{margin-top:28px;font-size:13.5px}
.entry-tags a{color:var(--light-muted);margin-right:8px}
.page-links{margin-top:24px;font-size:14px}

.content-sidebar .widget{margin-bottom:32px;padding-bottom:32px;border-bottom:1px solid var(--light-line)}
.content-sidebar .widget:last-child{border-bottom:0}
.content-sidebar .widget-title{font-size:15px;text-transform:uppercase;letter-spacing:.04em;margin-bottom:14px}
.content-sidebar ul{margin:0;padding:0}
.content-sidebar li{padding:6px 0;font-size:14.5px}

.hostify-pagination{display:flex;gap:8px;margin-top:36px;flex-wrap:wrap}
.hostify-pagination .page-numbers{
	display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 10px;
	border-radius:8px;border:1px solid var(--light-line);color:var(--light-text);font-size:14px;font-weight:600;
}
.hostify-pagination .page-numbers.current{background:var(--teal);border-color:var(--teal);color:#062723}
.hostify-pagination .page-numbers:hover:not(.current){border-color:var(--teal)}

.none-found{text-align:center;padding:60px 0}

/* ---- Comments ---- */
.comments-area{margin-top:48px;padding-top:40px;border-top:1px solid var(--light-line)}
.comments-title{font-size:22px;margin-bottom:24px}
.comment-list{list-style:none;margin:0;padding:0}
.comment-list .children{list-style:none;margin:0 0 0 44px;padding:0}
.comment-body{display:flex;gap:14px;padding:20px 0;border-bottom:1px solid var(--light-line)}
.comment-body .avatar{border-radius:50%;flex-shrink:0}
.comment-author{font-weight:700;font-size:14.5px}
.comment-metadata{font-family:var(--mono);font-size:12px;color:var(--light-muted);margin-bottom:8px}
.comment-content p{margin:0 0 8px;font-size:14.5px;line-height:1.6}
.comment-reply-link{font-size:12.5px;font-weight:600;color:var(--teal-dim)}
.comment-form label{display:block;font-size:13.5px;font-weight:600;margin:14px 0 6px}
.comment-form input[type=text],.comment-form input[type=email],.comment-form input[type=url],.comment-form textarea{
	width:100%;padding:11px 14px;border-radius:9px;border:1px solid var(--light-line);font-family:var(--body);font-size:14.5px;
}
.comment-form textarea{min-height:120px}
.no-comments{color:var(--light-muted)}

/* ---- Search form ---- */
.hostify-search-form{display:flex;gap:8px;width:100%}
.hostify-search-form .prompt-wrap{flex:1;display:flex;align-items:center;gap:6px;border:1px solid var(--light-line);border-radius:9px;padding:0 12px}
.hostify-search-form .search-field{flex:1;border:0;background:transparent;padding:11px 4px;font-family:var(--body);font-size:14.5px}
.hostify-search-form .search-field:focus{outline:none}

/* ---- Mobile nav (JS toggles .mobile-open on .main-nav; see hostify-frontend.js) ---- */
@media (max-width:1080px){
	nav.main-nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--navy-900);border-bottom:1px solid var(--line);padding:8px 16px 16px}
	nav.main-nav.mobile-open{display:block}
	nav.main-nav > ul{flex-direction:column;align-items:stretch;gap:0}
	nav.main-nav > ul > li > a{padding:14px 4px}
	nav.main-nav .mega{position:static;display:none;box-shadow:none;border:0;padding:6px 0 10px 14px;grid-template-columns:1fr;background:transparent}
	nav.main-nav > ul > li.open .mega{display:grid}
}

/* ---- Full-width / landing templates ---- */
.site-main-full-width,.site-main-builder{width:100%}
.hostify-landing-page{margin:0}

/* ---- WooCommerce cart count badge in header ---- */
.hostify-cart-link{position:relative}
.hostify-cart-link .cart-count{
	display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;
	border-radius:50%;background:var(--navy-950);color:var(--amber);font-size:11px;font-weight:700;margin-left:4px;
}

/* ---- Slider Revolution graceful placeholder ---- */
.hostify-slider-placeholder{padding:40px;text-align:center;background:var(--light-panel);border:1px dashed var(--light-line);border-radius:var(--radius);color:var(--light-muted)}

/* Skip link (accessibility) */
.skip-link.screen-reader-text{position:absolute;left:-9999px;top:auto;z-index:100000}
.skip-link.screen-reader-text:focus{
	left:16px;top:16px;background:var(--navy-950);color:#fff;padding:12px 18px;border-radius:8px;
}
.screen-reader-text{
	border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;
	padding:0;position:absolute;width:1px;word-wrap:normal!important;
}