/* ==========================================================
   C-O Cloud Platform — tokens
   ========================================================== */
:root{
  --ink:#0F1D33;
  --ink-2:#22355C;
  --orange:#EF7F1A;
  --orange-lt:#FF9E4A;
  --wash:#FDF2E6;
  --paper:#F7F8FB;
  --line:#E7EBF2;
  --muted:#69758A;
  --body:#3D4759;
  --white:#fff;

  --f-display:'Poppins','Segoe UI',sans-serif;
  --f-body:'Inter','Segoe UI',sans-serif;
  --f-mono:'JetBrains Mono',ui-monospace,monospace;

  --r-sm:12px; --r-md:18px; --r-lg:26px;
  --sh-sm:0 1px 3px rgba(15,29,51,.05);
  --sh-md:0 14px 40px rgba(15,29,51,.09);
  --sh-lg:0 30px 70px rgba(15,29,51,.14);
  --ease:cubic-bezier(.16,.84,.44,1);
  --wrap:1200px;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--white); color:var(--body);
  font-family:var(--f-body); -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3,h4{font-family:var(--f-display); color:var(--ink); margin:0 0 .5em; line-height:1.16; letter-spacing:-.01em;}
p{margin:0 0 1em; line-height:1.7;}
a{color:inherit; text-decoration:none;}
ul,ol{margin:0; padding:0; list-style:none;}
img,svg{display:block; max-width:100%;}
:focus-visible{outline:3px solid var(--orange-lt); outline-offset:3px; border-radius:4px;}

.eyebrow{
  font-family:var(--f-mono); font-size:.74rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--orange); margin:0 0 .9em;
}
.grad{
  background:linear-gradient(96deg,var(--orange) 0%,#FF9E4A 45%,#FFC078 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  padding:.88em 1.7em; border-radius:999px; font-weight:600; font-size:.96rem;
  border:1.5px solid transparent; cursor:pointer; white-space:nowrap;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease),
             background-color .25s var(--ease), border-color .25s var(--ease), color .25s var(--ease);
}
.btn__arrow{transition:transform .25s var(--ease);}
.btn:hover .btn__arrow{transform:translateX(4px);}
.btn--primary{background:var(--orange); color:#fff; box-shadow:0 10px 26px rgba(239,127,26,.3);}
.btn--primary:hover{background:var(--orange-lt); transform:translateY(-2px); box-shadow:0 16px 34px rgba(239,127,26,.38);}
.btn--quiet{background:var(--white); color:var(--ink); border-color:var(--line); box-shadow:var(--sh-sm);}
.btn--quiet:hover{border-color:var(--ink); transform:translateY(-2px);}
.btn--outline{border-color:var(--ink); color:var(--ink); width:100%;}
.btn--outline:hover{background:var(--ink); color:#fff; transform:translateY(-2px);}
.btn--light{background:#fff; color:var(--ink); width:100%;}
.btn--light:hover{background:var(--wash); transform:translateY(-2px);}
.btn--ghost{border-color:rgba(255,255,255,.4); color:#fff;}
.btn--ghost:hover{background:rgba(255,255,255,.1); border-color:#fff; transform:translateY(-2px);}
.btn--lg{padding:1.05em 2.2em; font-size:1.02rem;}
.plan .btn{width:100%;}

/* ---------- motion primitives ---------- */
.anim{opacity:0; transform:translateY(22px); animation:rise .9s var(--ease) forwards;}
.anim[data-anim="1"]{animation-delay:.05s} .anim[data-anim="2"]{animation-delay:.16s}
.anim[data-anim="3"]{animation-delay:.28s} .anim[data-anim="4"]{animation-delay:.4s}
.anim[data-anim="5"]{animation-delay:.52s}
@keyframes rise{to{opacity:1; transform:translateY(0);}}

.reveal{opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease), transform .8s var(--ease);}
.reveal.in-view{opacity:1; transform:none;}
.stagger > *{opacity:0; transform:translateY(26px); transition:opacity .7s var(--ease), transform .7s var(--ease);}
.stagger.in-view > *{opacity:1; transform:none;}
.stagger.in-view > *:nth-child(1){transition-delay:.04s} .stagger.in-view > *:nth-child(2){transition-delay:.1s}
.stagger.in-view > *:nth-child(3){transition-delay:.16s} .stagger.in-view > *:nth-child(4){transition-delay:.22s}
.stagger.in-view > *:nth-child(5){transition-delay:.28s} .stagger.in-view > *:nth-child(6){transition-delay:.34s}
.stagger.in-view > *:nth-child(7){transition-delay:.4s}  .stagger.in-view > *:nth-child(8){transition-delay:.46s}
.stagger.in-view > *:nth-child(9){transition-delay:.52s}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important;}
  .anim,.reveal,.stagger > *{opacity:1 !important; transform:none !important;}
}

/* ---------- scroll progress ---------- */
.progress{
  position:fixed; top:0; left:0; height:3px; width:0;
  background:linear-gradient(90deg,var(--orange),var(--orange-lt));
  z-index:200; transition:width .1s linear;
}

section[id],div[id]{scroll-margin-top:92px;}

/* ==========================================================
   Nav
   ========================================================== */
.nav{position:fixed; inset:0 0 auto 0; z-index:150; padding:16px 0;
  transition:padding .3s var(--ease), background-color .3s var(--ease), box-shadow .3s var(--ease);}
.nav.is-scrolled{padding:9px 0; background:rgba(255,255,255,.86); backdrop-filter:blur(14px); box-shadow:var(--sh-sm);}
.nav__inner{max-width:var(--wrap); margin:0 auto; padding:0 26px; display:flex; align-items:center; justify-content:space-between; gap:20px;}
.brand{display:flex; align-items:center; gap:10px;}
.brand__logo{height:36px; width:auto;}
.brand__tag{
  font-family:var(--f-mono); font-size:.62rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--muted); padding-left:10px; border-left:1px solid var(--line);
}
.nav__links{display:flex; align-items:center; gap:30px; flex:none;}
.nav__links a{flex:none;}
.nav__links a{font-weight:500; font-size:.94rem; color:var(--body); position:relative; padding:.2em 0; transition:color .2s;}
.nav__links a:not(.nav__cta):hover{color:var(--ink);}
.nav__links a:not(.nav__cta)::after{
  content:''; position:absolute; left:0; right:100%; bottom:-3px; height:2px;
  background:var(--orange); transition:right .28s var(--ease);
}
.nav__links a:not(.nav__cta):hover::after{right:0;}
.nav__links a.nav__cta{
  flex:none; background:var(--ink); color:#fff !important; padding:.62em 1.4em; border-radius:999px; font-weight:600;
  transition:background-color .25s, transform .25s;
}
.nav__links a.nav__cta:hover{background:var(--orange); transform:translateY(-2px);}
.nav__toggle{display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:6px;}
.nav__toggle span{width:24px; height:2px; border-radius:2px; background:var(--ink); transition:transform .3s var(--ease), opacity .25s;}

/* ==========================================================
   Hero
   ========================================================== */
.hero{position:relative; padding:160px 26px 90px; overflow:hidden; background:var(--white);}
.hero__inner{
  position:relative; z-index:2; max-width:var(--wrap); margin:0 auto;
  display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center;
}
.hero__title{font-size:clamp(2.2rem,4.6vw,3.5rem);}
.hero__sub{color:var(--muted); font-size:1.09rem; max-width:34em; margin-bottom:2em;}
.hero__actions{display:flex; gap:14px; flex-wrap:wrap; margin-bottom:2.2em;}
.hero__ticks{display:flex; gap:22px; flex-wrap:wrap;}
.hero__ticks li{position:relative; padding-left:22px; font-size:.9rem; color:var(--muted);}
.hero__ticks li::before{
  content:''; position:absolute; left:0; top:.42em; width:7px; height:11px;
  border-right:2px solid var(--orange); border-bottom:2px solid var(--orange); transform:rotate(40deg);
}
.pill{
  display:inline-flex; align-items:center; gap:9px; padding:.5em 1em; border-radius:999px;
  background:var(--paper); border:1px solid var(--line); font-size:.82rem; color:var(--muted); margin-bottom:1.6em;
}
.pill__dot{width:8px; height:8px; border-radius:50%; background:#2BB673; box-shadow:0 0 0 0 rgba(43,182,115,.55); animation:ping 2.2s infinite;}
@keyframes ping{70%{box-shadow:0 0 0 9px rgba(43,182,115,0);} 100%{box-shadow:0 0 0 0 rgba(43,182,115,0);}}

/* atmosphere */
.aurora{position:absolute; inset:-20% -10% auto -10%; height:120%; pointer-events:none; filter:blur(70px); opacity:.5;}
.aurora__blob{position:absolute; border-radius:50%;}
.aurora__blob--a{width:520px; height:520px; background:#FFD9AE; top:-60px; right:4%; animation:drift 17s ease-in-out infinite;}
.aurora__blob--b{width:420px; height:420px; background:#CBD9F5; top:180px; right:32%; animation:drift 21s ease-in-out infinite reverse;}
.aurora__blob--c{width:360px; height:360px; background:#FFE9D2; top:60px; left:2%; animation:drift 25s ease-in-out infinite;}
@keyframes drift{0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(30px,-26px) scale(1.09);}}
.grid-lines{
  position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(120% 90% at 50% 20%,#000 20%,transparent 75%);
  mask-image:radial-gradient(120% 90% at 50% 20%,#000 20%,transparent 75%);
}

/* signature topology */
.topo{position:relative;}
.topo__frame{
  background:var(--white); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--sh-lg); overflow:hidden; animation:float 7s ease-in-out infinite;
}
@keyframes float{0%,100%{transform:translateY(0);} 50%{transform:translateY(-11px);}}
.topo__bar{display:flex; align-items:center; gap:7px; padding:13px 18px; border-bottom:1px solid var(--line); background:var(--paper);}
.topo__bar i{width:9px; height:9px; border-radius:50%; background:#D9DEE8;}
.topo__bar i:first-child{background:#FFB9AE;}
.topo__bar span{margin-left:12px; font-family:var(--f-mono); font-size:.72rem; color:var(--muted);}
.topo__svg{width:100%; height:auto; padding:14px 10px 6px;}
.tlabel{font-family:var(--f-display); font-size:12.5px; font-weight:600; fill:var(--ink);}
.tlabel--on{fill:#fff;}
.tsub{font-family:var(--f-body); font-size:11px; fill:rgba(255,255,255,.7);}
.tsub--dark{fill:var(--muted);}
.topo__links path{stroke-dasharray:5 5; animation:dash 22s linear infinite;}
@keyframes dash{to{stroke-dashoffset:-200;}}
.topo__chip{
  position:absolute; background:#fff; border:1px solid var(--line); border-radius:999px;
  padding:.55em 1em; font-size:.82rem; color:var(--muted); box-shadow:var(--sh-md);
  animation:float 6s ease-in-out infinite;
}
.topo__chip b{color:var(--ink); font-family:var(--f-display);}
.topo__chip--1{top:14%; left:-26px; animation-delay:.6s;}
.topo__chip--2{bottom:16%; right:-22px; animation-delay:1.4s;}

/* ==========================================================
   Marquee
   ========================================================== */
.marquee{overflow:hidden; border-block:1px solid var(--line); background:var(--paper); padding:15px 0;}
.marquee__track{display:flex; gap:30px; width:max-content; animation:slide 42s linear infinite; align-items:center;}
.marquee__track span{font-family:var(--f-mono); font-size:.82rem; letter-spacing:.06em; color:var(--muted); white-space:nowrap;}
.marquee__track i{color:var(--orange); font-size:.6rem; font-style:normal;}
@keyframes slide{to{transform:translateX(-50%);}}

/* ==========================================================
   Section shell
   ========================================================== */
.section{padding:104px 26px; max-width:var(--wrap); margin:0 auto;}
.section--tight{padding-block:60px;}
.section--paper{background:var(--paper); max-width:none; border-block:1px solid var(--line);}
.section--paper > *{max-width:var(--wrap); margin-inline:auto;}
.section__head{max-width:660px; margin:0 auto 58px; text-align:center;}
.section__title{font-size:clamp(1.72rem,3.3vw,2.5rem);}
.section__sub{color:var(--muted); font-size:1.04rem;}
.section__head--split{
  max-width:none; display:flex; align-items:flex-end; justify-content:space-between;
  gap:26px; text-align:left; flex-wrap:wrap;
}
.section__head--split .section__title{margin:0;}

/* ---------- stats ---------- */
.stats{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; text-align:center;}
.stat{padding:22px 12px; border-radius:var(--r-md); background:var(--paper); border:1px solid var(--line);}
.stat__num{display:block; font-family:var(--f-display); font-weight:700; font-size:clamp(1.6rem,3vw,2.2rem); color:var(--ink);}
.stat__label{display:block; margin-top:.4em; font-size:.86rem; color:var(--muted);}

/* ---------- service cards ---------- */
.cards{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.card{
  position:relative; background:var(--white); border:1px solid var(--line); border-radius:var(--r-md);
  padding:32px 28px 28px; overflow:hidden;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.card::before{
  content:''; position:absolute; inset:0 0 auto 0; height:3px;
  background:linear-gradient(90deg,var(--orange),var(--orange-lt));
  transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease);
}
.card:hover{transform:translateY(-7px); box-shadow:var(--sh-md); border-color:transparent;}
.card:hover::before{transform:scaleX(1);}
.card__icon{
  width:50px; height:50px; border-radius:14px; background:var(--wash); color:var(--orange);
  display:flex; align-items:center; justify-content:center; margin-bottom:20px;
  transition:transform .35s var(--ease), background-color .35s var(--ease), color .35s var(--ease);
}
.card__icon svg{width:23px; height:23px;}
.card:hover .card__icon{background:var(--ink); color:var(--orange-lt); transform:translateY(-3px) rotate(-5deg);}
.card h3{font-size:1.1rem; margin-bottom:.45em;}
.card p{color:var(--muted); font-size:.94rem; margin-bottom:1.1em;}
.card__meta{font-family:var(--f-mono); font-size:.7rem; letter-spacing:.06em; color:var(--orange); text-transform:uppercase;}

/* ---------- steps ---------- */
.steps{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.step{
  background:var(--white); border:1px solid var(--line); border-radius:var(--r-md); padding:34px 28px;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.step:hover{transform:translateY(-5px); box-shadow:var(--sh-md);}
.step__num{
  display:inline-block; font-family:var(--f-mono); font-size:.8rem; color:var(--orange);
  border:1px solid var(--wash); background:var(--wash); border-radius:8px; padding:.3em .7em; margin-bottom:18px;
}
.step h3{font-size:1.1rem;}
.step p{color:var(--muted); font-size:.94rem; margin:0;}

/* ---------- pricing ---------- */
.toggle{display:inline-flex; gap:4px; padding:5px; border-radius:999px; background:var(--paper); border:1px solid var(--line); margin-top:26px;}
.toggle__btn{
  border:0; background:none; cursor:pointer; font-family:var(--f-body); font-size:.9rem; font-weight:600;
  color:var(--muted); padding:.6em 1.3em; border-radius:999px; transition:background-color .25s, color .25s;
}
.toggle__btn em{font-style:normal; font-size:.72rem; color:var(--orange); margin-left:.4em;}
.toggle__btn.is-active{background:var(--white); color:var(--ink); box-shadow:var(--sh-sm);}
.toggle__btn.is-active em{color:var(--orange);}

.pricing{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; align-items:stretch;}
.plan{
  position:relative; background:var(--white); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:38px 30px; display:flex; flex-direction:column;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.plan:hover{transform:translateY(-6px); box-shadow:var(--sh-md);}
.plan__badge{
  position:absolute; top:-12px; left:30px; background:var(--orange); color:#fff;
  font-family:var(--f-mono); font-size:.65rem; letter-spacing:.1em; text-transform:uppercase;
  padding:.45em .9em; border-radius:999px;
}
.plan__name{font-family:var(--f-display); font-weight:600; color:var(--orange); font-size:.95rem; margin-bottom:.5em;}
.plan__price{font-family:var(--f-display); font-weight:700; font-size:2.15rem; color:var(--ink); margin-bottom:.25em; display:flex; align-items:baseline; gap:.15em;}
.plan__price i{font-style:normal; font-size:.95rem; font-weight:500; color:var(--muted);}
.price{transition:opacity .25s var(--ease);}
.price.is-swapping{opacity:0;}
.plan__desc{color:var(--muted); font-size:.92rem; margin-bottom:1.7em;}
.plan__list{margin-bottom:2em; flex:1;}
.plan__list li{position:relative; padding-left:1.75em; margin-bottom:.78em; font-size:.93rem;}
.plan__list li::before{content:''; position:absolute; left:0; top:.28em; width:17px; height:17px; border-radius:50%; background:var(--wash);}
.plan__list li::after{
  content:''; position:absolute; left:5px; top:.56em; width:7px; height:4px;
  border-left:2px solid var(--orange); border-bottom:2px solid var(--orange); transform:rotate(-45deg);
}
.plan--featured{border-color:var(--orange-lt); box-shadow:var(--sh-md);}
.plan--dark{background:linear-gradient(165deg,var(--ink-2),var(--ink)); border-color:var(--ink); color:#fff;}
.plan--dark .plan__price,.plan--dark .plan__name{color:#fff;}
.plan--dark .plan__name{color:var(--orange-lt);}
.plan--dark .plan__desc,.plan--dark .plan__list li{color:#C6CFDD;}
.plan--dark .plan__list li::before{background:rgba(239,127,26,.22);}
.pricing__note{text-align:center; color:var(--muted); font-size:.88rem; margin-top:28px;}

/* ---------- why ---------- */
.why{display:grid; grid-template-columns:.9fr 1.1fr; gap:56px; align-items:center;}
.why__copy .section__title{text-align:left;}
.why__copy .section__sub{margin-bottom:1.8em;}
.why__grid{display:grid; grid-template-columns:repeat(2,1fr); gap:20px;}
.feature{background:var(--white); border:1px solid var(--line); border-radius:var(--r-md); padding:26px 24px;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);}
.feature:hover{transform:translateY(-5px); box-shadow:var(--sh-md);}
.feature__icon{
  width:44px; height:44px; border-radius:12px; background:var(--ink); color:var(--orange-lt);
  display:flex; align-items:center; justify-content:center; margin-bottom:16px;
}
.feature__icon svg{width:21px; height:21px;}
.feature h3{font-size:1rem; margin-bottom:.35em;}
.feature p{color:var(--muted); font-size:.9rem; margin:0;}

/* ---------- quotes ---------- */
.quotes{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.quote{
  margin:0; background:var(--paper); border:1px solid var(--line); border-radius:var(--r-md);
  padding:30px 28px; position:relative; transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.quote:hover{transform:translateY(-5px); box-shadow:var(--sh-md);}
.quote__mark{font-family:var(--f-display); font-size:3rem; line-height:.6; color:var(--orange); margin-bottom:18px;}
.quote blockquote{margin:0 0 20px; font-size:.97rem; line-height:1.65; color:var(--ink);}
.quote figcaption{display:flex; flex-direction:column; gap:2px; font-size:.86rem;}
.quote figcaption b{color:var(--ink);}
.quote figcaption span{color:var(--muted);}
.quotes__note{text-align:center; color:var(--muted); font-size:.82rem; margin-top:26px;}

/* ---------- posts ---------- */
.posts{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.post{
  display:flex; flex-direction:column; background:var(--white); border:1px solid var(--line);
  border-radius:var(--r-md); padding:0 26px 28px; overflow:hidden;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.post:hover{transform:translateY(-7px); box-shadow:var(--sh-md);}
.post__art{margin:0 -26px 22px; aspect-ratio:16/9; overflow:hidden; background:var(--paper);}
.post__art img{width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease);}
.post:hover .post__art img{transform:scale(1.05);}
.post__tag{
  align-self:flex-start; font-family:var(--f-mono); font-size:.66rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--orange); background:var(--wash); padding:.35em .8em; border-radius:999px; margin-bottom:14px;
}
.post h3{font-size:1.06rem; margin-bottom:.5em;}
.post p{color:var(--muted); font-size:.92rem; flex:1; margin-bottom:1.1em;}
.post__more{font-size:.86rem; font-weight:600; color:var(--orange);}

/* ---------- faq ---------- */
.faq{max-width:780px; margin:0 auto; display:flex; flex-direction:column; gap:12px;}
.faq__item{background:var(--white); border:1px solid var(--line); border-radius:var(--r-sm); padding:2px 24px; transition:border-color .25s, box-shadow .25s;}
.faq__item[open]{border-color:var(--orange-lt); box-shadow:var(--sh-sm);}
.faq__item summary{
  cursor:pointer; list-style:none; padding:20px 0; font-weight:600; color:var(--ink);
  display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.faq__item summary::-webkit-details-marker{display:none;}
.faq__chev{position:relative; flex:none; width:16px; height:16px;}
.faq__chev::before,.faq__chev::after{
  content:''; position:absolute; background:var(--orange); border-radius:2px;
  transition:transform .3s var(--ease), opacity .3s var(--ease);
}
.faq__chev::before{top:7px; left:0; width:16px; height:2px;}
.faq__chev::after{left:7px; top:0; width:2px; height:16px;}
.faq__item[open] .faq__chev::after{transform:rotate(90deg); opacity:0;}
.faq__item p{color:var(--muted); padding-bottom:20px; margin:0; font-size:.95rem;}

/* ---------- cta ---------- */
.cta{
  position:relative; margin:0 26px 100px; border-radius:var(--r-lg); padding:76px 40px; text-align:center;
  background:linear-gradient(150deg,var(--ink-2),var(--ink)); overflow:hidden;
}
.cta__glow{
  position:absolute; width:600px; height:600px; border-radius:50%; top:-320px; right:-120px;
  background:radial-gradient(circle,rgba(239,127,26,.55),transparent 65%); filter:blur(40px);
  animation:drift 15s ease-in-out infinite;
}
.cta__inner{position:relative; z-index:1; max-width:640px; margin:0 auto;}
.cta h2{color:#fff; font-size:clamp(1.6rem,3.2vw,2.3rem);}
.cta p{color:#C6CFDD; margin-bottom:2em;}
.cta__actions{display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}

/* ---------- footer ---------- */
.footer{background:var(--ink); color:#C6CFDD; padding:70px 26px 0;}
.footer__inner{
  max-width:var(--wrap); margin:0 auto; display:flex; flex-wrap:wrap; justify-content:space-between;
  gap:48px; padding-bottom:46px; border-bottom:1px solid rgba(255,255,255,.09);
}
.footer__brand{max-width:290px;}
.footer__logo{filter:brightness(0) invert(1); height:34px;}
.footer__brand p{color:#9BA7B8; font-size:.9rem; margin-top:16px;}
.footer__cols{display:flex; gap:58px; flex-wrap:wrap;}
.footer__heading{color:#fff; font-family:var(--f-mono); font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; margin-bottom:1.3em;}
.footer__cols div{display:flex; flex-direction:column; gap:.75em;}
.footer__cols a{color:#9BA7B8; font-size:.91rem; transition:color .2s;}
.footer__cols a:hover{color:var(--orange-lt);}
.footer__bottom{max-width:var(--wrap); margin:0 auto; padding:24px 0; text-align:center; font-size:.84rem; color:#75808F;}

/* ==========================================================
   Blog index
   ========================================================== */
.blog-hero{padding:150px 26px 60px; text-align:center; position:relative; overflow:hidden; background:var(--white);}
.blog-hero__inner{position:relative; z-index:2; max-width:700px; margin:0 auto;}
.blog-hero h1{font-size:clamp(2rem,4.2vw,3rem);}
.blog-hero p{color:var(--muted); font-size:1.06rem;}

.blog-hero + .section{padding-top:44px;}
.blog-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}

.feature-post{
  display:grid; grid-template-columns:1.05fr 1fr; gap:0; background:var(--white);
  border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; margin-bottom:22px;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.feature-post:hover{transform:translateY(-5px); box-shadow:var(--sh-md);}
.feature-post__art{background:var(--paper); overflow:hidden;}
.feature-post__art img{width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease);}
.feature-post:hover .feature-post__art img{transform:scale(1.04);}
.feature-post__body{padding:44px 40px; display:flex; flex-direction:column; justify-content:center;}
.feature-post__body h2{font-size:clamp(1.3rem,2.4vw,1.8rem);}
.feature-post__body p{color:var(--muted);}

/* ==========================================================
   Article page
   ========================================================== */
.article{max-width:760px; margin:0 auto; padding:140px 26px 70px;}
.article__meta{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:20px;}
.article__meta .post__tag{margin:0;}
.article__meta time,.article__meta span.read{font-size:.85rem; color:var(--muted);}
.article h1{font-size:clamp(1.9rem,4vw,2.8rem); margin-bottom:.4em;}
.article__lede{font-size:1.14rem; color:var(--muted); line-height:1.65; margin-bottom:2em;}
.article__art{border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); margin-bottom:44px;}
.article__body h2{font-size:1.45rem; margin-top:2em;}
.article__body h3{font-size:1.12rem; margin-top:1.7em;}
.article__body p{font-size:1.03rem; color:var(--body);}
.article__body ul{margin:0 0 1.4em; padding-left:0;}
.article__body ul li{position:relative; padding-left:1.6em; margin-bottom:.6em; font-size:1.01rem;}
.article__body ul li::before{content:''; position:absolute; left:.1em; top:.65em; width:7px; height:7px; border-radius:50%; background:var(--orange);}
.article__body ol{counter-reset:n; margin:0 0 1.4em;}
.article__body ol li{counter-increment:n; position:relative; padding-left:1.9em; margin-bottom:.6em; font-size:1.01rem;}
.article__body ol li::before{content:counter(n) '.'; position:absolute; left:0; font-family:var(--f-mono); color:var(--orange); font-size:.9em;}
.callout{
  background:var(--wash); border-left:3px solid var(--orange); border-radius:0 var(--r-sm) var(--r-sm) 0;
  padding:22px 26px; margin:2em 0;
}
.callout p{margin:0; font-size:.98rem; color:var(--ink);}
.article__cta{
  margin:56px 0 0; padding:38px 34px; border-radius:var(--r-lg); text-align:center;
  background:linear-gradient(150deg,var(--ink-2),var(--ink)); color:#C6CFDD;
}
.article__cta h3{color:#fff; font-size:1.3rem;}
.article__cta p{color:#C6CFDD; margin-bottom:1.5em;}
.back-link{display:inline-flex; align-items:center; gap:.5em; font-size:.9rem; color:var(--muted); margin-bottom:26px; transition:color .2s, gap .25s;}
.back-link:hover{color:var(--orange); gap:.8em;}

.related{border-top:1px solid var(--line); margin-top:64px; padding-top:44px;}
.related h3{font-size:1.15rem; margin-bottom:22px;}
.related__grid{display:grid; grid-template-columns:repeat(2,1fr); gap:18px;}

/* ==========================================================
   Responsive
   ========================================================== */
@media (max-width:1024px){
  .hero__inner{grid-template-columns:1fr; gap:52px;}
  .topo{max-width:520px; margin:0 auto;}
  .cards,.steps,.quotes,.posts,.blog-grid{grid-template-columns:repeat(2,1fr);}
  .pricing{grid-template-columns:1fr; max-width:470px; margin-inline:auto;}
  .why{grid-template-columns:1fr; gap:40px;}
  .stats{grid-template-columns:repeat(2,1fr);}
  .feature-post{grid-template-columns:1fr;}
  .feature-post__art{aspect-ratio:16/8;}
  .feature-post__body{padding:34px 28px;}
}

@media (max-width:760px){
  .nav__links{
    position:fixed; inset:0 0 0 auto; width:80%; max-width:330px; height:100dvh;
    background:var(--ink); flex-direction:column; align-items:flex-start; justify-content:center;
    gap:26px; padding:40px; transform:translateX(100%); transition:transform .35s var(--ease);
  }
  .nav__links.is-open{transform:translateX(0);}
  .nav__links a{color:#fff !important; font-size:1.12rem;}
  .nav__toggle{display:flex; z-index:2;}
  .nav.is-open .nav__toggle span{background:#fff;}
  .nav.is-open .nav__toggle span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .nav.is-open .nav__toggle span:nth-child(2){opacity:0;}
  .nav.is-open .nav__toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

  .cards,.steps,.quotes,.posts,.blog-grid,.why__grid,.related__grid{grid-template-columns:1fr;}
  .section{padding:76px 20px;}
  .hero{padding:130px 20px 70px;}
  .topo__chip{display:none;}
  .cta{margin:0 16px 76px; padding:54px 24px;}
  .article{padding:120px 20px 60px;}
}