/*
Theme Name: AllCloudHost
Theme URI: https://allcloudhost.net
Author: AllCloudHost
Description: Custom, standalone theme for AllCloudHost — a clean, verifiable-reliability hosting design built for speed. Ships its own shortcode handlers, order-form scripting, and plugin-widget interactivity (ported from Easy Flow, GPL) so it works with the ResellersPanel plugin without depending on Easy Flow being installed.
Version: 1.3.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: allcloudhost
*/

:root{
  --paper:#F6F7F9;
  --paper-raised:#FFFFFF;
  --ink:#14171B;
  --ink-soft:#5B6472;
  --ink-faint:#8A93A3;
  --console-bg:#12151C;
  --console-line:#262B36;
  --console-text:#D8DDE5;
  --line:#E4E7EB;
  --line-strong:#D3D8DE;
  --signal:#0E9D5C;
  --signal-ink:#0B7C49;
  --signal-dim:rgba(14,157,92,0.09);
  --amber:#B8791C;
  --amber-dim:rgba(184,121,28,0.10);
  --font-body:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-display:var(--font-body);
  --font-mono:ui-monospace,"SF Mono","Cascadia Code","Roboto Mono",Menlo,Consolas,monospace;
  --radius:10px;
  --radius-sm:8px;
  --radius-pill:999px;
  --shadow-card:0 1px 2px rgba(20,23,27,0.04), 0 8px 24px -12px rgba(20,23,27,0.10);
  --shadow-raised:0 4px 12px -4px rgba(20,23,27,0.14), 0 16px 40px -16px rgba(20,23,27,0.18);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img{max-width:100%; height:auto;}
a{color:inherit;}
:focus-visible{outline:2px solid var(--signal); outline-offset:2px;}
.wrap{max-width:1152px; margin:0 auto; padding:0 24px;}
h1,h2,h3{font-family:var(--font-display); margin:0; letter-spacing:-0.02em; font-weight:700;}
.mono{font-family:var(--font-mono);}

.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;
}

/* ---- status strip ---- */
.status-strip{background:var(--console-bg); color:var(--console-text); font-family:var(--font-mono); font-size:12px;}
.status-strip .wrap{display:flex; align-items:center; gap:20px; padding:8px 24px; flex-wrap:wrap;}
.dot{width:6px; height:6px; border-radius:50%; background:var(--signal); display:inline-block; margin-right:7px;}
.status-strip .sep{color:var(--console-line);}

/* ---- header ---- */
header.site{background:rgba(246,247,249,0.92); backdrop-filter:saturate(180%) blur(10px); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:30;}
header.site .wrap{display:flex; align-items:center; justify-content:space-between; padding:14px 24px; gap:16px;}
.logo{font-family:var(--font-display); font-weight:800; font-size:19px; text-decoration:none; display:flex; align-items:center; gap:8px; color:var(--ink);}
.logo::before{content:""; width:8px; height:20px; border-radius:2px; background:var(--signal); display:inline-block;}
.logo img{max-height:34px; width:auto;}
nav.primary ul{display:flex; gap:26px; list-style:none; margin:0; padding:0;}
nav.primary a{text-decoration:none; color:var(--ink-soft); font-size:14.5px; font-weight:600;}
nav.primary a:hover, nav.primary .current-menu-item a{color:var(--ink);}
.header-actions{display:flex; align-items:center; gap:14px;}
.btn{font-family:var(--font-body); font-weight:700; font-size:14.5px; padding:11px 20px; border-radius:var(--radius-sm); text-decoration:none; display:inline-block; border:1px solid transparent; cursor:pointer; transition:transform .12s ease, box-shadow .12s ease, background-color .12s ease;}
.btn-primary{background:var(--signal); color:#fff;}
.btn-primary:hover{background:var(--signal-ink);}
.btn-ghost{color:var(--ink-soft); font-size:14.5px; font-weight:600; text-decoration:none;}
.btn-ghost:hover{color:var(--ink);}
.btn-outline{border:1px solid var(--line-strong); background:var(--paper-raised); color:var(--ink);}
.btn-outline:hover{border-color:var(--ink-faint);}

/* mobile nav toggle */
.menu-toggle{display:none; background:none; border:0; padding:8px; margin:-8px; cursor:pointer; align-items:center; justify-content:center;}
.menu-toggle span, .menu-toggle span::before, .menu-toggle span::after{
  content:""; display:block; width:22px; height:2px; background:var(--ink); border-radius:2px; position:relative; transition:transform .2s ease, opacity .2s ease;
}
.menu-toggle span::before{position:absolute; top:-7px;}
.menu-toggle span::after{position:absolute; top:7px;}
.nav-open .menu-toggle span{background:transparent;}
.nav-open .menu-toggle span::before{top:0; transform:rotate(45deg);}
.nav-open .menu-toggle span::after{top:0; transform:rotate(-45deg);}

/* ---- hero ---- */
.hero{padding:64px 0 56px;}
.hero .wrap{display:grid; grid-template-columns:1.05fr 0.95fr; gap:56px; align-items:center;}
.eyebrow{font-family:var(--font-mono); font-size:12px; color:var(--signal-ink); text-transform:uppercase; letter-spacing:.07em; margin-bottom:14px; display:block; font-weight:600;}
.hero h1{font-size:clamp(32px,4.4vw,54px); font-weight:800; line-height:1.05;}
.hero p.lead{font-size:18px; color:var(--ink-soft); max-width:46ch; margin:20px 0 30px;}
.hero-ctas{display:flex; gap:14px; margin-bottom:6px; flex-wrap:wrap;}
.hero-ctas .btn{padding:13px 24px; font-size:15.5px;}
@media (prefers-reduced-motion:reduce){*{animation-duration:.001s!important; animation-iteration-count:1!important; transition-duration:.001s!important;}}

/* ---- console ---- */
.console{background:var(--console-bg); color:var(--console-text); border-radius:14px; padding:0; overflow:hidden; font-family:var(--font-mono); font-size:13px; box-shadow:var(--shadow-raised);}
.console-bar{display:flex; align-items:center; gap:8px; padding:12px 18px; border-bottom:1px solid var(--console-line); color:#8892A4;}
.console-bar .dot{margin:0 2px 0 0; width:6px; height:6px;}
.console-body{padding:18px 20px 20px;}
.console-row{display:flex; justify-content:space-between; align-items:baseline; padding:9px 0; border-bottom:1px solid var(--console-line);}
.console-row:last-child{border-bottom:none;}
.console-label{color:#8892A4;}
.console-value{color:var(--console-text); font-weight:600;}
.console-value.good{color:#4ADE94;}

/* ---- section shell ---- */
section{padding:56px 0;}
.section-head{max-width:620px; margin-bottom:32px;}
.section-head .eyebrow{margin-bottom:10px;}
.section-head h2, .section-head h1{font-size:clamp(24px,3vw,32px); font-weight:800;}
.section-head p{color:var(--ink-soft); margin-top:10px; font-size:15.5px;}

/* ---- plans ---- */
.plans-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.plan-card{background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius); position:relative; box-shadow:var(--shadow-card); transition:transform .15s ease, box-shadow .15s ease;}
.plan-card:hover{transform:translateY(-2px); box-shadow:var(--shadow-raised);}
.plan-ticket-head{display:flex; justify-content:space-between; align-items:center; padding:16px 20px; border-bottom:1px solid var(--line);}
.plan-code{font-family:var(--font-mono); font-size:11px; color:var(--ink-faint); letter-spacing:.04em;}
.plan-card.featured .plan-code{color:var(--signal-ink);}
.plan-name{font-family:var(--font-display); font-weight:800; font-size:19px; padding:18px 20px 0;}
.plan-price{padding:6px 20px 18px; display:flex; align-items:baseline; gap:6px;}
.plan-price .num{font-family:var(--font-display); font-size:34px; font-weight:800;}
.plan-price .per{color:var(--ink-soft); font-size:13.5px;}
.plan-specs{list-style:none; margin:0; padding:0 20px 20px; font-size:14px;}
.plan-specs li{padding:9px 0; border-top:1px solid var(--line); display:flex; justify-content:space-between; color:var(--ink-soft);}
.plan-specs li span.v{color:var(--ink); font-weight:600; font-family:var(--font-mono); font-size:13px;}
.plan-cta{display:block; text-align:center; margin:0 20px 20px;}
.plan-card.featured{border-color:var(--signal); box-shadow:0 0 0 1.5px var(--signal), var(--shadow-raised);}
.featured-tag{position:absolute; top:-11px; left:20px; background:var(--signal); color:#fff; font-family:var(--font-mono); font-size:10.5px; padding:4px 10px; border-radius:var(--radius-pill); letter-spacing:.05em; font-weight:700;}
.more-hosting{margin-top:20px; padding-top:20px; border-top:1px solid var(--line); display:flex; gap:28px; flex-wrap:wrap; font-size:14px;}
.more-hosting a{text-decoration:none; color:var(--ink-soft); display:flex; gap:6px;}
.more-hosting a:hover{color:var(--ink);}
.more-hosting .v{font-family:var(--font-mono); color:var(--ink); font-weight:600;}

/* ---- migration ---- */
.migration{background:var(--paper-raised); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.mig-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin-top:8px;}
.mig-step{padding-top:18px; border-top:2px solid var(--signal);}
.mig-step .num{font-family:var(--font-mono); font-size:13px; color:var(--signal-ink); display:block; margin-bottom:10px; font-weight:700;}
.mig-step h3{font-size:16.5px; margin-bottom:8px; font-weight:700;}
.mig-step p{color:var(--ink-soft); font-size:14.5px; margin:0;}

/* ---- control panel ---- */
.cp-grid{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center;}
.cp-features{list-style:none; margin:22px 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:14px 20px;}
.cp-features li{font-size:14.5px; display:flex; gap:10px; align-items:flex-start;}
.cp-features li::before{content:"✓"; color:var(--signal); font-weight:700; font-family:var(--font-mono);}
.cp-panel{background:var(--console-bg); border-radius:var(--radius); padding:22px; font-family:var(--font-mono); font-size:12.5px; color:var(--console-text); box-shadow:var(--shadow-raised);}
.cp-panel .title{color:#8892A4; margin-bottom:12px;}
.cp-panel .tree div{padding:3px 0 3px 14px;}
.cp-panel .tree .d1{padding-left:0; color:#8892A4;}

/* ---- blog cards (teaser + archive) ---- */
.blog-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.post-card{background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius); padding:20px; text-decoration:none; color:var(--ink); display:block; box-shadow:var(--shadow-card); transition:transform .15s ease, box-shadow .15s ease;}
.post-card:hover{transform:translateY(-2px); box-shadow:var(--shadow-raised);}
.post-card .cat{font-family:var(--font-mono); font-size:11px; color:var(--amber); text-transform:uppercase; letter-spacing:.05em; font-weight:600;}
.post-card h3{font-size:17px; margin:10px 0 8px; line-height:1.3; font-weight:700;}
.post-card p{color:var(--ink-soft); font-size:14px; margin:0;}
.post-card .read{display:inline-block; margin-top:14px; font-size:13px; font-weight:700; color:var(--signal-ink);}

/* ---- faq ---- */
.faq-list{border-top:1px solid var(--line);}
.faq-item{border-bottom:1px solid var(--line); padding:6px 0;}
.faq-q{width:100%; text-align:left; background:none; border:none; cursor:pointer; padding:16px 0; font-size:16px; font-weight:700; font-family:var(--font-body); color:var(--ink); display:flex; justify-content:space-between; align-items:center; gap:16px;}
.faq-icon{font-family:var(--font-mono); color:var(--signal); font-size:18px; flex-shrink:0; transition:transform .2s ease;}
.faq-a{color:var(--ink-soft); font-size:14.5px; max-width:70ch; margin:0; max-height:0; overflow:hidden; transition:max-height .25s ease, margin .25s ease;}
.faq-item.is-open .faq-a{max-height:400px; margin:0 0 16px;}
.faq-item.is-open .faq-icon{transform:rotate(45deg);}

/* ---- generic page / post content (renders plugin shortcodes, WP core content) ---- */
.page-title, .post-title{font-size:clamp(26px,4vw,38px); font-weight:800; margin-bottom:24px;}
.page-body, .post-body{font-size:15.5px; line-height:1.7;}
.page-body table, .post-body table{width:100%; border-collapse:collapse; margin:20px 0; font-size:14px;}
.page-body th, .page-body td, .post-body th, .post-body td{border:1px solid var(--line); padding:10px 12px; text-align:left;}
.page-body iframe, .post-body iframe{max-width:100%;}
.page-body h2, .post-body h2{font-family:var(--font-display); font-size:24px; margin:32px 0 12px; font-weight:800;}
.page-body h3, .post-body h3{font-family:var(--font-display); font-size:19px; margin:24px 0 10px; font-weight:700;}
.page-body ul, .post-body ul{padding-left:20px;}
.post-meta{color:var(--ink-soft); font-size:13px; margin-bottom:24px;}
.post-thumb{margin-bottom:28px; border-radius:var(--radius); overflow:hidden;}
.post-thumb img{display:block; width:100%;}

/* ---- breadcrumbs ---- */
.breadcrumbs-wrap{padding:16px 24px 0;}
#crumbs{font-size:13px; color:var(--ink-soft);}
#crumbs a{color:var(--ink-soft); text-decoration:none;}
#crumbs a:hover{color:var(--ink);}
#crumbs .current{color:var(--ink); font-weight:600;}

/* ---- ported ResellersPanel/Easy Flow content shortcodes ----
   Used inside existing Page content ([button], [link], [order_btn],
   etc. — see inc/shortcodes.php). Styled to match .btn/.btn-outline
   above rather than Easy Flow's own look. */
.rpwp-button{font-family:var(--font-body); font-weight:700; font-size:14.5px; padding:11px 20px; border-radius:var(--radius-sm); text-decoration:none; display:inline-block; border:1px solid transparent; background:var(--signal); color:#fff;}
.rpwp-button:hover{background:var(--signal-ink);}
.rpwp-button.green{background:var(--signal); color:#fff;}
.rpwp-button.lightblue{background:var(--paper-raised); color:var(--ink); border-color:var(--line-strong);}
.rpwp_link{color:var(--signal-ink); text-decoration:underline;}
.rpwp_link:hover{color:var(--ink);}
.rpwp-orderbtn{display:inline-flex; align-items:center; gap:10px; background:var(--console-bg); color:var(--console-text); border-radius:var(--radius); padding:8px 8px 8px 16px; font-family:var(--font-mono); font-size:13px;}
.rpwp-orderbtn .rpwp-button{margin:0;}
.rpwp-sep{border-top:1px solid var(--line); margin:24px 0;}
.header_notice{background:var(--amber-dim); border:1px solid var(--amber); border-radius:var(--radius-sm); padding:12px 16px; font-size:14px;}
.rpwp_resizable_tab{border:1px solid var(--line); border-radius:var(--radius); padding:16px; margin:12px 0;}
.rpwp_resizable_tab.small{max-width:320px;}
.rpwp_resizable_tab.big{max-width:640px;}
.rpwp_category_header{font-family:var(--font-display); font-size:20px; margin:28px 0 12px; font-weight:800;}
.rpwp-right-column{float:right; width:48%;}
.rpwp-left-column{float:left; width:48%;}
.rpwp-column-clear{clear:both;}

/* ---- pagination ---- */
.nav-links{display:flex; gap:16px; font-family:var(--font-mono); font-size:14px;}
.nav-links a{text-decoration:none; color:var(--ink); border:1px solid var(--line); padding:8px 14px; border-radius:var(--radius-sm);}

/* ---- footer ---- */
footer.site{background:var(--ink); color:#B7C0CC; padding:48px 0 28px;}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px;}
footer.site h4{font-family:var(--font-mono); font-size:11.5px; color:#7C8798; text-transform:uppercase; letter-spacing:.06em; margin:0 0 14px;}
footer.site ul{list-style:none; margin:0; padding:0;}
footer.site li{margin-bottom:9px; font-size:14px;}
footer.site a{text-decoration:none; color:#B7C0CC;}
footer.site a:hover{color:#fff;}
.foot-bottom{margin-top:40px; padding-top:20px; border-top:1px solid #262E3F; display:flex; justify-content:space-between; font-size:12.5px; color:#6C7688; font-family:var(--font-mono); flex-wrap:wrap; gap:10px;}

/* ---- responsive ---- */
@media (max-width:860px){
  .hero .wrap{grid-template-columns:1fr;}
  .plans-grid, .blog-grid, .mig-grid{grid-template-columns:1fr;}
  .cp-grid{grid-template-columns:1fr;}
  .cp-features{grid-template-columns:1fr;}
  .foot-grid{grid-template-columns:1fr 1fr; gap:28px;}
}

@media (max-width:760px){
  .menu-toggle{display:flex;}
  nav.primary{
    position:fixed; top:0; right:0; height:100vh; width:min(320px,86vw);
    background:var(--paper-raised); box-shadow:-16px 0 40px rgba(20,23,27,0.16);
    transform:translateX(100%); transition:transform .25s ease;
    padding:88px 28px 28px; z-index:20; overflow-y:auto;
  }
  .nav-open nav.primary{transform:translateX(0);}
  nav.primary ul{flex-direction:column; gap:4px;}
  nav.primary a{display:block; padding:12px 0; font-size:16px; border-bottom:1px solid var(--line);}
  .nav-scrim{display:none; position:fixed; inset:0; background:rgba(20,23,27,0.4); z-index:15;}
  .nav-open .nav-scrim{display:block;}
  /* Hide only the compact header bar's Client Login (nav.primary carries
     its own copy inside the slide-out panel for mobile) — scoped to the
     direct child of .wrap so it doesn't also hide the one inside nav. */
  .wrap > .header-actions .btn-ghost{display:none;}
  nav.primary .header-actions{display:block; margin-top:24px; padding-top:16px; border-top:1px solid var(--line);}
  header.site .wrap{padding:12px 20px;}
  .status-strip .wrap{padding:7px 20px;}
  .status-strip .sep, .status-strip span:nth-child(3), .status-strip span:nth-child(5){display:none;}
  .hero{padding:40px 0 44px;}
  .hero-ctas{flex-direction:column; align-items:stretch;}
  .hero-ctas .btn{text-align:center;}
  section{padding:44px 0;}
  .foot-grid{grid-template-columns:1fr;}
  .foot-bottom{flex-direction:column; align-items:flex-start; gap:6px;}
}

@media (min-width:761px){
  nav.primary .header-actions{display:none;}
}