/* ==== FLEET THEME STANDARD — sizing tokens (from WordPress Design & Development Core)
   docs/elementor-pro/13-global-layout-foundation.md · 15-global-content-spacing-policy.md ·
   docs/quy-chuan-layout-va-tuong-tac.md. Paste this block verbatim at the top of the theme CSS.
   Change only colours/fonts/radius below the block, never the sizing values. ==== */
:root{
  /* Content width = OUTER container max-width (padding sits inside it) */
  --container-max:1440px;
  --container-pad:clamp(48px,5vw,96px);
  /* Section Spacing (band padding-block) */
  --section-y:120px; --section-y-compact:80px;
  /* Content Spacing (gap of content stacks) — sm <= md <= lg */
  --content-gap-sm:12px; --content-gap-md:24px; --content-gap-lg:48px;
  /* Grid / card collection gap */
  --grid-gap:32px;
  /* Component padding (inside cards/surfaces) */
  --card-pad:32px;
  /* Interaction */
  --touch:44px;
}
/* Laptop 1025–1366 */
@media (max-width:1366px){:root{--container-max:1366px;--container-pad:clamp(40px,4.5vw,72px);--section-y:104px;--section-y-compact:72px;--content-gap-md:20px;--content-gap-lg:40px;--grid-gap:28px;--card-pad:28px}}
/* Tablet 769–1024 */
@media (max-width:1024px){:root{--container-max:1024px;--container-pad:clamp(24px,4vw,48px);--section-y:80px;--section-y-compact:64px;--content-gap-sm:10px;--content-gap-md:20px;--content-gap-lg:32px;--grid-gap:24px;--card-pad:24px}}
/* Mobile <=768 */
@media (max-width:768px){:root{--container-max:768px;--container-pad:clamp(16px,5vw,24px);--section-y:64px;--section-y-compact:48px;--content-gap-sm:8px;--content-gap-md:16px;--content-gap-lg:28px;--grid-gap:16px;--card-pad:20px}}

/* Band -> Inner. Header, main and footer inners all use .container */
.container{width:100%;max-width:var(--container-max);margin-inline:auto;padding-inline:var(--container-pad);box-sizing:border-box}
.band{padding-block:var(--section-y)}
.band.compact{padding-block:var(--section-y-compact)}
/* Content stacks: sibling spacing ONLY via parent gap */
.stack{display:flex;flex-direction:column;gap:var(--content-gap-md)}
.stack-sm{display:flex;flex-direction:column;gap:var(--content-gap-sm)}
.stack-lg{display:flex;flex-direction:column;gap:var(--content-gap-lg)}
.row{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
/* Reset default UA margins so nothing spaces siblings by accident */
h1,h2,h3,h4,h5,h6,p,ul,ol,figure,blockquote,dl,dd{margin:0}
/* Prose exception (rich text inside ONE article body) */
.prose p,.prose ul,.prose ol,.prose blockquote,.prose figure{margin-block:0 1em}
.prose h2,.prose h3{margin-block:1.6em .5em}
[hidden]{display:none!important}
/* Accessibility baseline */
:focus-visible{outline:3px solid currentColor;outline-offset:3px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
/* ==== END FLEET THEME STANDARD ==== */

/* ==== SOLARIS theme ==== */
:root{
  --sun:#FFC233; --sun-2:#FFE08A; --sun-soft:#FFF6D9; --sky:#2E9BEA; --sky-2:#BFE3FF; --sky-soft:#EEF7FF;
  --ink:#0C2D48; --ink-2:#3C5A73; --line:#D7E6F2; --white:#fff; --cream:#FFFBEF;
  --r:22px; --r-sm:12px; --shadow:0 18px 40px -18px rgba(12,45,72,.28);
  --fd:'Bricolage Grotesque',system-ui,sans-serif; --fb:'Figtree',system-ui,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--fb);font-size:17px;line-height:1.6;color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased}
main{overflow-x:clip}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--fd);line-height:1.08;letter-spacing:-.02em;font-weight:800}
h1{font-size:clamp(42px,6vw,84px)}
h2{font-size:clamp(32px,3.6vw,52px)}
h3{font-size:clamp(20px,1.7vw,24px);font-weight:700;letter-spacing:-.01em}
.lead{font-size:clamp(18px,1.4vw,21px);color:var(--ink-2);max-width:60ch}
.muted{color:var(--ink-2)} .small{font-size:14px}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--sky)}
.center{text-align:center;align-items:center}
.center .lead{margin-inline:auto}
.center-row{justify-content:center}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ink);color:#fff;padding:12px 18px;border-radius:10px}
.skip:focus{top:12px}
.bg-sky{background:var(--sky-2)} .bg-sky-soft{background:var(--sky-soft)} .bg-cream{background:var(--cream)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--touch);padding:12px 26px;border-radius:999px;background:var(--sun);color:var(--ink);font-weight:600;text-decoration:none;border:2px solid var(--sun);font-family:var(--fb);font-size:16px;cursor:pointer;transition:background-color .2s,border-color .2s,transform .2s,box-shadow .2s}
.btn:hover{background:#FFB300;border-color:#FFB300;transform:translateY(-2px);box-shadow:0 10px 22px -10px rgba(255,170,0,.8)}
.btn.ghost{background:transparent;border-color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:#fff;box-shadow:none}
.btn.dark{background:var(--ink);border-color:var(--ink);color:#fff}
.btn.dark:hover{background:#163f63}
.link{font-weight:600;color:var(--sky)}
.chip{display:inline-flex;padding:3px 12px;border-radius:999px;background:var(--sun-soft);color:#7A5600;font-size:13px;font-weight:600}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.site-header .container{display:flex;align-items:center;gap:24px;min-height:76px}
.logo{display:inline-flex;align-items:center;gap:10px;font-family:var(--fd);font-weight:800;font-size:26px;letter-spacing:-.03em;text-decoration:none;white-space:nowrap;min-height:var(--touch)}
.logo svg{width:34px;height:34px}
.nav{display:flex;gap:4px}
.nav a{display:inline-flex;align-items:center;min-height:var(--touch);padding:0 14px;border-radius:999px;text-decoration:none;font-weight:500;transition:background-color .2s,color .2s}
.nav a:hover{background:var(--sky-soft)}
.nav a[aria-current=page]{background:var(--sun-soft);color:#6B4A00}
.burger{display:none;width:var(--touch);height:var(--touch);border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);cursor:pointer;align-items:center;justify-content:center}
.burger svg{width:24px;height:24px}

/* hero */
.hero{position:relative;background:linear-gradient(180deg,var(--sky-soft) 0%,#fff 85%)}
.sun-disc{position:absolute;right:-120px;top:-160px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,var(--sun) 0 38%,rgba(255,194,51,.35) 39% 55%,rgba(255,194,51,.12) 56% 70%,transparent 71%);pointer-events:none;animation:glow 8s ease-in-out infinite alternate}
@keyframes glow{to{transform:scale(1.06) rotate(8deg)}}
.hero .container,.phero .container{position:relative}
.hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:var(--content-gap-lg);align-items:center}
.hl{background:linear-gradient(transparent 62%,var(--sun) 62% 92%,transparent 92%)}
.trust{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:12px 24px}
.trust li{display:flex;align-items:center;gap:8px;font-weight:500}
.trust svg,.ticks svg{width:22px;height:22px;flex:none;color:var(--sky)}
.hero-media{position:relative}
.ph{overflow:hidden;border-radius:var(--r);background:var(--sky-soft)}
.ph img{width:100%;height:100%;object-fit:cover}
.ph.big{aspect-ratio:4/4.3;border-radius:200px 200px var(--r) var(--r)}
.ph.tall{aspect-ratio:4/5}
.ph.wide{aspect-ratio:21/9}
.live-card{position:absolute;left:-28px;bottom:36px;display:flex;align-items:center;gap:14px;padding:16px 22px;background:#fff;border-radius:18px;box-shadow:var(--shadow)}
.live-card b{display:block;font-family:var(--fd);font-size:26px}
.live-card span{font-size:14px;color:var(--ink-2)}
.live-card .dot{width:14px;height:14px;border-radius:50%;background:#2DBE6C;box-shadow:0 0 0 6px rgba(45,190,108,.2);animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{box-shadow:0 0 0 11px rgba(45,190,108,.05)}}

/* page hero */
.phero{position:relative;background:linear-gradient(180deg,var(--sky-soft),#fff)}
.phero .sun-disc{width:380px;height:380px;top:-140px;right:-90px}
.phero-grid{display:grid;gap:var(--content-gap-lg);align-items:center}
.phero-grid.has-img{grid-template-columns:1.2fr 1fr}
.phero-img{aspect-ratio:16/10}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:14px;color:var(--ink-2)}
.crumbs{align-items:center}
.crumbs a{text-decoration:none;font-weight:600;min-height:var(--touch);display:inline-flex;align-items:center}
.crumbs a:hover{color:var(--sky)}

/* section heads + grids */
.shead{display:flex;flex-direction:column;gap:var(--content-gap-sm);max-width:720px}
.shead.center{margin-inline:auto}
.shead-row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--content-gap-md)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap)}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--grid-gap)}
.grid-team{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap)}
.grid-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap);align-items:stretch}
.split{display:grid;grid-template-columns:1fr 1fr;gap:var(--content-gap-lg);align-items:center}
.split.top{align-items:start}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--grid-gap)}
.stat{display:flex;flex-direction:column;gap:4px;padding:var(--card-pad);background:#fff;border-radius:var(--r)}
.stat b{font-family:var(--fd);font-size:clamp(30px,3vw,44px);line-height:1}
.stat span{color:var(--ink-2)}
.stats.mini{grid-template-columns:repeat(2,1fr)}
.stats.mini .stat{background:var(--sky-soft)}

/* cards */
.scard,.post,.feature,.member{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;transition:transform .25s,box-shadow .25s,border-color .25s}
.scard:hover,.post:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--sky-2)}
.scard .ph,.post .ph,.feature .ph{border-radius:0;aspect-ratio:16/10}
.bd{display:flex;flex-direction:column;gap:var(--content-gap-sm);padding:var(--card-pad);flex:1;background:#fff}
.scard .bd p,.post .bd p{flex:1}
.ico{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:16px;background:var(--sun-soft);color:#9A6A00}
.ico svg{width:28px;height:28px}
.vcard{display:flex;flex-direction:column;gap:var(--content-gap-sm);padding:var(--card-pad);background:#fff;border-radius:var(--r);border:1px solid var(--line)}
.meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:14px;color:var(--ink-2)}
.member .portrait{border-radius:0;aspect-ratio:4/4.2}
.role{color:var(--sky);font-weight:600;font-size:15px}
.quote{display:flex;flex-direction:column;gap:var(--content-gap-md);padding:var(--card-pad);background:#fff;border-radius:var(--r);box-shadow:0 6px 24px -14px rgba(12,45,72,.25)}
.stars{color:#F5A700;letter-spacing:3px}
.quote blockquote{font-size:18px;line-height:1.55}
.quote blockquote{flex:1}
.quote figcaption{display:flex;flex-direction:column;font-size:15px}
.quote figcaption span{color:var(--ink-2)}

/* steps */
.steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:var(--grid-gap)}
.step{display:flex;flex-direction:column;gap:var(--content-gap-sm);padding:var(--card-pad);border-radius:var(--r);background:var(--sky-soft)}
.num{font-family:var(--fd);font-weight:800;font-size:15px;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--sun)}

/* calculator — signature */
.calc-wrap{align-items:stretch}
.calc{display:grid;grid-template-columns:1fr 1.15fr;gap:var(--grid-gap);padding:var(--card-pad);background:#fff;border-radius:28px;box-shadow:var(--shadow);border:1px solid var(--line)}
.calc-in{justify-content:center}
.lbl{display:flex;justify-content:space-between;gap:12px;font-weight:600}
.lbl output{font-family:var(--fd);font-weight:800;font-size:20px;color:var(--sky)}
input[type=range]{width:100%;height:var(--touch);accent-color:var(--sun);cursor:pointer;margin:0}
.seg{display:flex;flex-wrap:wrap;gap:10px;border:0;padding:0;margin:0}
.seg legend{padding:0;width:100%;float:left}
.seg label{position:relative;display:inline-flex}
.seg input{position:absolute;inset:0;margin:0;width:100%;height:100%;clip-path:inset(50%);opacity:.01}
.seg span{display:inline-flex;align-items:center;min-height:var(--touch);padding:0 20px;border-radius:999px;border:2px solid var(--line);font-weight:600;cursor:pointer;transition:background-color .2s,border-color .2s}
.seg label:hover span{border-color:var(--sky)}
.seg input:checked+span{background:var(--sun);border-color:var(--sun)}
.seg input:focus-visible+span{outline:3px solid var(--ink);outline-offset:2px}
.calc-out{display:flex;flex-direction:column;gap:var(--content-gap-md);padding:var(--card-pad);border-radius:20px;background:linear-gradient(180deg,var(--sky-2),var(--sky-soft))}
.roof{padding:22px 22px 26px;background:#55606b;border-radius:16px;clip-path:polygon(6% 0,94% 0,100% 100%,0 100%)}
.tiles{display:grid;grid-template-columns:repeat(10,1fr);gap:5px}
.tile{aspect-ratio:1/1.5;border-radius:3px;background:#6d7883;transition:background-color .35s,box-shadow .35s,opacity .35s}
.tile.on{background:linear-gradient(135deg,#1d4f86,#0c2d48);box-shadow:inset 0 0 0 1px #5d8fc4}
.tile.off{opacity:.35}
.res{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0}
.res div{display:flex;flex-direction:column;gap:2px;padding:14px;background:#fff;border-radius:14px}
.res dt{font-size:13px;color:var(--ink-2)}
.res dd{margin:0;font-family:var(--fd);font-weight:800;font-size:clamp(20px,1.8vw,26px)}

/* plans */
.plan{position:relative;display:flex;flex-direction:column;gap:var(--content-gap-md);padding:var(--card-pad);border-radius:var(--r);border:1px solid var(--line);background:#fff}
.plan.feat{background:var(--ink);color:#fff;border-color:var(--ink)}
.plan.feat .muted,.plan.feat .eyebrow{color:var(--sky-2)}
.plan.feat .ticks svg{color:var(--sun)}
.plan .ticks{flex:1}
.plan.feat .btn{background:var(--sun)}
.badge{position:absolute;top:18px;right:18px;padding:4px 12px;border-radius:999px;background:var(--sun);color:var(--ink);font-size:13px;font-weight:700}
.price{font-family:var(--fd);font-weight:800;font-size:40px;line-height:1}
.ticks{list-style:none;padding:0;display:flex;flex-direction:column;gap:10px}
.ticks li{display:flex;gap:10px;align-items:flex-start}
.ticks.lg li{font-size:18px}
.tablewrap{overflow-x:auto;border-radius:var(--r);border:1px solid var(--line)}
.cmp{width:100%;border-collapse:collapse;min-width:640px}
.cmp th,.cmp td{text-align:left;padding:16px 20px;border-bottom:1px solid var(--line)}
.cmp thead th{background:var(--sky-soft);font-size:14px}
.cmp tbody tr:last-child>*{border-bottom:0}

/* detail */
.detail{display:grid;grid-template-columns:1fr 360px;gap:var(--content-gap-lg);align-items:start}
.side{position:sticky;top:100px}
.sidebox{padding:var(--card-pad);border-radius:var(--r);background:var(--sun-soft);border:1px solid var(--sun-2)}
.kv{display:flex;flex-direction:column;gap:8px;margin:0}
.kv div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed var(--sun-2);padding-block-end:8px}
.kv dd{margin:0;font-weight:700}
.gallery-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap)}
.gallery-3 .ph{aspect-ratio:1}

/* blog/article */
.feat-post{display:grid;grid-template-columns:1.3fr 1fr}
.feat-post .ph{aspect-ratio:auto;min-height:340px}
.feat-post h3{font-size:clamp(24px,2.4vw,34px)}
.art-head{max-width:900px}
.art-head h1{font-size:clamp(36px,4.6vw,64px)}
.prose{max-width:72ch;font-size:18px}
.prose blockquote{padding:20px 24px;border-left:5px solid var(--sun);background:var(--sun-soft);border-radius:0 14px 14px 0;font-weight:500}
.prose a{color:var(--sky);font-weight:600}
.author{display:flex;align-items:center;gap:18px;max-width:72ch;padding:var(--card-pad);border-radius:var(--r);background:var(--sky-soft)}
.author img{width:72px;height:72px;border-radius:50%;object-fit:cover}

/* contact */
.formbox{padding:var(--card-pad);border-radius:var(--r);border:1px solid var(--line);background:#fff;box-shadow:var(--shadow)}
.fgrid2{display:grid;grid-template-columns:1fr 1fr;gap:var(--content-gap-md)}
.field{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:15px}
.field input,.field select,.field textarea{font:inherit;font-weight:400;min-height:var(--touch);padding:10px 14px;border:1.5px solid var(--line);border-radius:12px;background:#fff;color:var(--ink)}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{outline:3px solid var(--sky);outline-offset:1px}
.faqs{display:flex;flex-direction:column;gap:10px}
.faq{border:1px solid var(--line);border-radius:14px;background:#fff}
.faq summary{display:flex;align-items:center;min-height:var(--touch);padding:12px 18px;font-weight:600;cursor:pointer}
.faq summary:hover{color:var(--sky)}
.faq p{padding:0 18px 16px;color:var(--ink-2)}

/* CTA */
.cta-box{display:grid;grid-template-columns:1.4fr auto;gap:var(--content-gap-lg);align-items:center;padding:clamp(28px,5vw,72px);border-radius:32px;background:radial-gradient(circle at 92% 10%,var(--sun) 0 90px,rgba(255,194,51,.25) 91px 170px,transparent 171px),var(--sky);color:#fff}
.cta-box .eyebrow{color:var(--sun-2)}
.cta-box .lead{color:#E9F5FF}
.cta-box h2{color:#fff}
.cta-box .btn.ghost{border-color:#fff;color:#fff}
.cta-box .btn.ghost:hover{background:#fff;color:var(--ink)}


/* 404 */
.nf{min-height:60vh;display:flex;align-items:center}

/* footer */
.site-footer{background:var(--ink);color:#D4E4F1;padding-block:var(--section-y-compact)}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.4fr;gap:var(--grid-gap)}
.fcol{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.fcol h4{color:#fff;font-size:17px}
.fcol a{text-decoration:none;min-height:var(--touch);display:inline-flex;align-items:center}
.fcol a:hover{color:var(--sun)}
.site-footer .logo{color:#fff}
.news{display:flex;gap:8px;width:100%}
.news input{flex:1;min-width:0;min-height:var(--touch);padding:0 14px;border-radius:999px;border:1px solid #3C5A73;background:#123A5A;color:#fff;font:inherit}
.news button{min-height:var(--touch);padding:0 20px;border-radius:999px;border:0;background:var(--sun);color:var(--ink);font-weight:700;cursor:pointer;font:inherit}
.fbot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;border-top:1px solid #23506F;padding-block-start:24px;font-size:14px}

/* Laptop */
@media (max-width:1366px){
  .detail{grid-template-columns:1fr 320px}
  .nav a{padding:0 11px}
}
/* Tablet */
@media (max-width:1024px){
  .burger{display:inline-flex}
  .hbtn{display:none}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:4px;padding:16px var(--container-pad) 24px;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}
  .nav.open{display:flex}
  .site-header .container{position:relative}
  .hero-grid,.split,.phero-grid.has-img,.detail,.calc,.cta-box{grid-template-columns:1fr}
  .hero-media{max-width:620px}
  .live-card{left:16px}
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .grid-plans{grid-template-columns:1fr;max-width:560px}
  .stats{grid-template-columns:repeat(2,1fr)}
  .side{position:static}
  .fgrid{grid-template-columns:1fr 1fr}
  .feat-post{grid-template-columns:1fr}
  .feat-post .ph{min-height:0;aspect-ratio:16/9}
  .ph.tall{aspect-ratio:16/11}
}
/* Mobile */
@media (max-width:768px){
  body{font-size:16px}
  .sun-disc,.phero .sun-disc{width:220px;height:220px;right:-120px;top:-120px}
  .grid-3,.grid-2,.steps{grid-template-columns:1fr}
  .grid-team{grid-template-columns:repeat(2,1fr)}
  .res{grid-template-columns:repeat(2,1fr)}
  .gallery-3{grid-template-columns:repeat(2,1fr)}
  .gallery-3 .ph:last-child{grid-column:1/-1;aspect-ratio:2/1}
  .fgrid2{grid-template-columns:1fr}
  .ph.big{border-radius:140px 140px var(--r) var(--r)}
  .live-card{bottom:16px;padding:12px 16px}
  .live-card b{font-size:21px}
  .price{font-size:34px}
  .cta-box{background:radial-gradient(circle at 100% 100%,var(--sun) 0 56px,rgba(255,194,51,.3) 57px 96px,transparent 97px),var(--sky)}
}
@media (max-width:480px){
  .fgrid{grid-template-columns:1fr}
  .grid-team .bd p{display:none}
  .roof{padding:14px 14px 18px}
  .tiles{gap:3px}
  .stat{padding:18px}
}