/* ============================================================
   blocks.css — content block styling (one rule set per block)
   ============================================================ */

/* scroll reveal (driven by shell.js IntersectionObserver) */
.reveal{opacity:0;transform:translateY(42px);transition:opacity .9s ease,transform 1s cubic-bezier(.16,1,.3,1)}
.reveal.in{opacity:1;transform:none}

/* ---------- inline hero (404 / fallback) ---------- */
.inline-hero-card{padding:46px 40px;max-width:760px}
.inline-hero-card h1{margin:14px 0 16px}
.inline-hero-card .hero-actions{margin-top:24px}

/* ---------- tagline ---------- */
.block-tagline{text-align:center}
.tagline-xl{font-family:var(--font-display);font-weight:600;font-size:clamp(1.6rem,3.6vw,2.8rem);line-height:1.15;max-width:20ch;margin:0 auto}

/* ---------- marquee ---------- */
.marquee-wrap{overflow:hidden;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);padding:20px 0;margin:0 0 0}
.marquee{display:flex;align-items:center;gap:22px;white-space:nowrap;width:max-content;animation:tick 34s linear infinite}
.marquee b{font-family:var(--font-util);color:var(--absinthe);font-weight:700;font-size:.95rem}
.marquee .m-prefix{font-family:var(--font-util);color:var(--ink-dim);font-size:.95rem;margin-left:22px}
.marquee .m-dot{color:var(--ink-faint)}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- info box ---------- */
.info-box{padding:34px 36px;max-width:760px}
.info-box h3{margin-bottom:10px;font-size:1.15rem}
.info-box p{color:var(--ink-dim);font-weight:300}

/* ---------- callout ---------- */
.block-callout{display:flex;justify-content:center}
.callout{padding:40px 44px;max-width:820px}
.callout blockquote{font-family:var(--font-display);font-weight:500;font-size:clamp(1.2rem,2.4vw,1.7rem);line-height:1.35}
.callout figcaption{margin-top:18px;font-family:var(--font-util);font-size:.82rem;color:var(--accent,var(--verdigris))}

/* ---------- stat strip ---------- */
.stat-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.stat-cell{padding:28px 24px;text-align:center}
.stat-val{display:block;font-family:var(--font-display);font-weight:700;font-size:clamp(1.6rem,3vw,2.3rem)}
.stat-label{display:block;margin-top:8px;font-size:.84rem;color:var(--ink-dim);font-weight:300}

/* ---------- feature columns ---------- */
.feature-grid{display:grid;gap:20px}
.feature-grid.cols-2{grid-template-columns:repeat(2,1fr)}
.feature-grid.cols-3{grid-template-columns:repeat(3,1fr)}
.feature-grid.cols-4{grid-template-columns:repeat(4,1fr)}
.feature-card{padding:30px 28px}
.feature-card .f-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;font-size:1.3rem;
  background:rgba(255,255,255,.06);border:1px solid var(--hairline);color:var(--accent,var(--verdigris));margin-bottom:18px}
.feature-card h3{margin-bottom:9px;font-size:1.02rem}
.feature-card p{color:var(--ink-dim);font-weight:300;font-size:.92rem}

/* ---------- checklist ---------- */
.checklist{list-style:none;padding:32px 36px;display:flex;flex-direction:column;gap:14px;max-width:860px}
.checklist li{position:relative;padding-left:34px;color:var(--ink-dim);font-weight:300}
.checklist li::before{content:"✓";position:absolute;left:0;top:0;width:22px;height:22px;border-radius:50%;
  display:grid;place-items:center;font-size:.72rem;color:var(--void);background:linear-gradient(120deg,var(--absinthe),var(--verdigris))}

/* ---------- spec list ---------- */
.spec-list{padding:14px 36px;max-width:920px}
.spec-row{display:grid;grid-template-columns:minmax(160px,1fr) 2fr;gap:24px;padding:18px 0;border-bottom:1px solid var(--hairline-soft)}
.spec-row:last-child{border-bottom:none}
.spec-row dt{font-family:var(--font-util);font-size:.85rem;color:var(--ink)}
.spec-row dd{color:var(--ink-dim);font-weight:300;font-size:.92rem}

/* ---------- logo grid ---------- */
.logo-grid{display:flex;flex-wrap:wrap;gap:14px}
.logo-chip{padding:14px 26px;font-family:var(--font-util);font-size:.92rem;color:var(--ink-dim);letter-spacing:.04em}

/* ---------- step list ---------- */
.step-list{list-style:none;display:flex;flex-direction:column;gap:16px;counter-reset:step}
.step{display:flex;gap:22px;padding:26px 30px;align-items:flex-start}
.step-n{font-family:var(--font-util);font-weight:700;font-size:1.1rem;color:var(--accent,var(--absinthe));flex-shrink:0;
  width:46px;height:46px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--hairline);background:rgba(255,255,255,.04)}
.step h3{margin-bottom:6px}
.step p{color:var(--ink-dim);font-weight:300;font-size:.92rem}

/* ---------- image split ---------- */
.image-split{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}
.image-split.flip .split-copy{order:2}
.split-copy h2{margin:12px 0 16px}
.split-copy p{color:var(--ink-dim);font-weight:300}
.split-media{overflow:hidden;min-height:320px;display:grid;place-items:center}
.split-media .media-img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.media-ph{width:100%;min-height:320px;display:grid;place-items:center;border-radius:inherit;
  background:linear-gradient(135deg,rgba(200,240,90,.16),rgba(139,147,255,.18) 60%,rgba(255,126,90,.14));
  position:relative;overflow:hidden}
.media-ph span{font-family:var(--font-util);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-dim);
  background:rgba(8,7,16,.5);padding:8px 16px;border-radius:30px;border:1px solid var(--hairline)}

/* ---------- faq ---------- */
.faq{padding:14px 36px;max-width:900px}
.faq details{border-bottom:1px solid var(--hairline-soft);padding:18px 0}
.faq details:last-child{border-bottom:none}
.faq summary{font-family:var(--font-display);font-weight:500;font-size:1rem;cursor:pointer;list-style:none;
  display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::after{content:"+";font-family:var(--font-util);color:var(--accent,var(--verdigris));font-size:1.3rem;transition:transform .25s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin-top:12px;color:var(--ink-dim);font-weight:300;font-size:.94rem}

/* ---------- cta band ---------- */
.block-cta{display:flex;justify-content:center}
.cta-band{padding:40px 44px;display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;width:100%;max-width:1000px}
.cta-band h2{margin-bottom:8px}
.cta-band p{color:var(--ink-dim);font-weight:300;max-width:46ch}

/* ---------- pricing ---------- */
.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.price-card{padding:34px 30px;display:flex;flex-direction:column}
.price-label{font-family:var(--font-util);font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent,var(--verdigris))}
.price-amt{display:flex;align-items:baseline;gap:8px;margin:14px 0 22px}
.price-amt b{font-family:var(--font-display);font-weight:700;font-size:2.4rem}
.price-amt span{color:var(--ink-faint);font-size:.85rem;font-weight:300}
.price-feats{list-style:none;display:flex;flex-direction:column;gap:11px;margin-bottom:26px;flex:1}
.price-feats li{display:flex;gap:11px;align-items:flex-start;font-size:.9rem;font-weight:300}
.price-feats li i{font-style:normal;font-family:var(--font-util);font-size:.8rem;width:18px;flex-shrink:0}
.price-feats li.yes{color:var(--ink-dim)} .price-feats li.yes i{color:var(--verdigris)}
.price-feats li.no{color:var(--ink-faint)} .price-feats li.no i{color:var(--ember)}

/* ---------- team ---------- */
.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px}
.team-card{padding:30px 28px}
.team-card .team-photo,.team-mono{width:74px;height:74px;border-radius:50%;object-fit:cover;margin-bottom:18px}
.team-mono{display:grid;place-items:center;font-family:var(--font-display);font-size:1.6rem;color:var(--void);
  background:linear-gradient(135deg,var(--absinthe),var(--periwinkle))}
.team-card h3{margin-bottom:4px}
.team-role{font-family:var(--font-util);font-size:.78rem;color:var(--accent,var(--verdigris))}
.team-card p{margin-top:14px;color:var(--ink-dim);font-weight:300;font-size:.92rem}

/* ---------- code/quote ---------- */
.code{padding:26px 30px;overflow:auto;max-width:920px}
.code code{font-family:var(--font-util);font-size:.86rem;color:var(--verdigris);white-space:pre-wrap}

/* ---------- blocks row (feature cards) ---------- */
.cards-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.feature-card-lg{padding:34px 30px;display:flex;flex-direction:column;align-items:flex-start}
.feature-card-lg h2{margin:10px 0 6px}
.feature-card-lg .fc-tag{color:var(--accent,var(--verdigris));font-size:.9rem;margin-bottom:10px}
.feature-card-lg .fc-body{color:var(--ink-dim);font-weight:300;font-size:.92rem;margin-bottom:22px}

/* ---------- merged twin ---------- */
.block-twin{text-align:center}
.twin-head{font-family:var(--font-display);font-weight:500;font-size:clamp(1.2rem,2.6vw,1.9rem);line-height:1.3;
  max-width:30ch;margin:0 auto var(--s-6)}
.twin-head .rotator{display:inline-block;min-width:4ch}
.twin-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;text-align:left}
.twin-card{position:relative;padding:42px 38px 46px;overflow:hidden;min-height:330px;
  display:flex;flex-direction:column;align-items:flex-start;transition:transform .4s}
.twin-card:hover{transform:translateY(-8px)}
.twin-card .glow{position:absolute;width:120%;height:120%;top:-40%;left:-10%;filter:blur(70px);opacity:.45;transition:opacity .5s;
  background:radial-gradient(circle at 30% 30%,var(--accent),transparent 70%)}
.twin-card:hover .glow{opacity:.7}
.twin-card>*{position:relative}
.twin-card h2{margin:12px 0 10px}
.twin-card .twin-tag{color:var(--accent);font-size:.95rem;margin-bottom:14px}
.twin-card .twin-body{color:var(--ink-dim);font-weight:300;margin-bottom:26px}
.twin-card .btn{margin-top:auto}

/* ---------- responsive blocks ---------- */
@media (max-width:1024px){
  .feature-grid.cols-3,.feature-grid.cols-4{grid-template-columns:repeat(2,1fr)}
  .stat-strip{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:760px){
  .feature-grid.cols-2,.feature-grid.cols-3,.feature-grid.cols-4{grid-template-columns:1fr}
  .stat-strip{grid-template-columns:1fr 1fr}
  .image-split{grid-template-columns:1fr}
  .image-split.flip .split-copy{order:0}
  .twin-grid{grid-template-columns:1fr}
  .spec-row{grid-template-columns:1fr;gap:4px}
  .cta-band{flex-direction:column;align-items:flex-start}
}

/* ---------- twin card backgrounds (home merged_twin) ---------- */
.twin-card.twin-right{
  background:
    linear-gradient(155deg,rgba(8,12,22,.58),rgba(8,12,22,.82)),
    url("/assets/img/metal.png");
  background-size:cover;background-position:center;background-blend-mode:normal}
.twin-card.twin-left{
  background:
    linear-gradient(155deg,rgba(8,12,22,.55),rgba(8,12,22,.80)),
    url("/assets/img/office.png");
  background-size:cover;background-position:center}
/* keep the corner-hugging hairline + text legible over the texture */
.twin-card.twin-left .twin-body,.twin-card.twin-right .twin-body{color:rgba(237,235,247,.82)}
.twin-card.twin-left .glow,.twin-card.twin-right .glow{opacity:.28}

/* ---------- uniform card padding (20px) + interior gaps (20px) ---------- */
.dock-tile,.tiles-interior .dock-tile.lg,
.feature-card,.feature-card-lg,.price-card,.twin-card,
.info-box,.callout,.team-card,.step,.checklist,.spec-list,.faq,.code,
.stat-cell,.inline-hero-card,.logo-chip{padding:20px !important}
.stat-strip,.step-list,.feature-grid,.cards-row,.pricing-grid,.team-grid,.twin-grid{gap:20px}

/* ---------- interior hero divider (matches the footer divider) ---------- */
.hero-divider{position:relative;width:min(var(--w-wide),calc(100% - 48px));margin:40px auto;height:1.5px;
  background:linear-gradient(90deg,transparent,var(--absinthe),var(--verdigris),var(--periwinkle),var(--ember),transparent);
  opacity:.55;border:none}

/* ---------- page heading (centered, not in a card) ---------- */
.block-pageheading{padding-top:var(--s-6);padding-bottom:var(--s-4)}
.page-title{margin:0 auto;color:var(--ink)}
.page-sub{font-family:var(--font-display);font-weight:400;color:var(--ink-dim);
  font-size:clamp(1.05rem,2vw,1.55rem);line-height:1.35;margin:12px auto 0;max-width:46ch}
.block-pageheading.plain .page-title{font-size:clamp(1.1rem,2.4vw,1.7rem);color:var(--ink)}
.block-spacer{width:100%}
/* download: tighten consecutive card rows to ~20px */
.block-row + .block-row{margin-top:calc(-1 * var(--s-7) + 20px)}

/* ---------- centered CTA info box (get-button gradient) ---------- */
.info-box.is-cta{background:linear-gradient(110deg,var(--absinthe),var(--verdigris));color:var(--void)}
.info-box.is-cta::before{display:none}
.info-box.is-cta h3,.info-box.is-cta p{color:var(--void)}
.al-center .info-box{margin-left:auto;margin-right:auto}

/* ---------- callout: <=40px gap above and below ---------- */
.block:has(+ .block-callout){padding-bottom:20px}
.block-callout{padding-top:20px;padding-bottom:20px}
.block-callout + .block{padding-top:20px}

/* ---------- page heading sub: avoid the awkward orphan wrap ---------- */
.page-sub{max-width:62ch;text-wrap:balance}

/* === defog section gap === */
.block{padding-top:calc(var(--section-gap) / 2)!important;
       padding-bottom:calc(var(--section-gap) / 2)!important}
.block + .block{margin-top:0!important}
.block-row + .block-row{margin-top:0!important}
.site-footer{margin-top:calc(var(--section-gap) / 2)!important}
.hero{padding-bottom:calc(var(--section-gap) / 2)!important}
/* === end defog section gap === */

/* === defog card solid border === */
.glass{background-clip:padding-box!important}
.cta-band,.has-bg-image{background-clip:padding-box!important}
/* === end defog card solid border === */

/* === defog cta standard === */
.block-cta{width:min(var(--w-wide),calc(100% - 32px))!important;margin-left:auto;margin-right:auto}
.block-cta .cta-band{
  width:100%!important;box-sizing:border-box;
  display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;
  background-image:linear-gradient(90deg,rgba(7,6,14,.62),rgba(7,6,14,.28)),url("/assets/img/cta_bg.jpg")!important;
  background-size:cover!important;background-position:center!important;
  background-clip:padding-box!important;
}
.block-cta .cta-band > div{flex:1 1 60%;min-width:min(100%,420px)}
.block-cta .cta-band .btn{flex:0 0 auto;margin-left:auto;align-self:center}
@media (max-width:640px){.block-cta .cta-band{justify-content:flex-start}.block-cta .cta-band .btn{margin-left:0}}
/* === end defog cta standard === */

/* === defog announce form === */
.block-announce,.block-unsub{display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.announce-card{width:100%;max-width:560px;padding:22px;display:block}
.announce-card .display{margin:0 0 14px}
#announce-signup,#unsub-form{display:flex;flex-direction:column;gap:12px}
#announce-signup .form-row{display:flex;gap:12px;flex-wrap:wrap}
#announce-signup .form-row label{flex:1 1 180px}
.announce-card label{display:flex;flex-direction:column;gap:6px;font-size:.86rem;color:var(--ink-dim,#cfd2e6)}
.announce-card input,.announce-card select{padding:11px 12px;border-radius:12px;border:1px solid var(--hairline,rgba(255,255,255,.14));
  background:rgba(7,6,14,.45);color:var(--ink,#fff);font:inherit}
.announce-card .form-check{flex-direction:row;align-items:center;gap:10px;font-size:.86rem}
.announce-card .form-check input{width:auto;padding:0}
.announce-card .form-status{min-height:1.2em;font-size:.88rem;color:var(--absinthe,#C8F05A)}
.announce-card .form-fine{font-size:.76rem;color:var(--ink-faint,#8c8fa6);margin:0}
.announce-success{max-width:560px}
/* === end defog announce form === */

/* === defog ticker === */
.marquee-wrap{overflow:hidden;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);padding:14px 0;margin:0}
.marquee-wrap--bleed{width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.marquee-wrap--inline{width:100%}
.marquee{display:flex;align-items:center;gap:22px;white-space:nowrap;width:max-content;animation:tick 60s linear infinite}
.marquee .m-prefix{font-family:var(--font-serif,Georgia,'Times New Roman',serif)!important;
  color:#e8e8e8!important;font-size:1.18rem!important;font-style:italic;letter-spacing:.01em;margin-left:0}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* === end defog ticker === */

/* === defog pricing hover === */
.price-card{transition:transform .28s ease, background .35s ease, box-shadow .3s ease;will-change:transform}
.price-card:hover{transform:scale(1.035);
  /* 40% darker so text stays clearly readable */
  background:linear-gradient(135deg, rgba(165,58,25,.97), rgba(14,90,165,.97))!important;
  box-shadow:0 18px 56px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.12)}
.price-card:hover .price-label,.price-card:hover .price-amt,.price-card:hover .price-feats{color:#fff}
/* === end defog pricing hover === */

/* === defog oncanvas === */
.hero-bg-title{font-family:var(--font-display,sans-serif);font-weight:800;font-size:var(--fs-hero-bg,clamp(2.6rem,6.2vw,5rem));line-height:1.02;color:var(--ink,#fff);margin:0 0 .35em;text-wrap:balance; align:center;}
.hero-bg-sub{font-family:var(--font-display,sans-serif);font-weight:700;font-size:var(--fs-hero-bg-sub,clamp(1.5rem,3vw,2.2rem));line-height:1.1;color:var(--ink,#fff); align:center;}
.hero-bg-title.is-center,.block-bgtitle.al-center .hero-bg-title{text-align:center;margin-left:auto;margin-right:auto}
.onbg{background:none!important;border:0!important;box-shadow:none!important;padding:0!important;backdrop-filter:none!important}
.block-onbg .onbg blockquote{font-size:clamp(1.3rem,2.6vw,2rem);line-height:1.3;color:var(--ink,#fff);font-weight:600}
.block-onbg .onbg p{color:var(--ink-dim)}
.block-onbg .onbg h3.hero-bg-sub{margin:0 0 .4em}
.compliance-card{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:0 44px}
.checklist.cols-2{display:grid;grid-template-columns:1fr 1fr;gap:8px 44px}
@media(max-width:760px){.compliance-card,.checklist.cols-2{grid-template-columns:1fr}}
/* === end defog oncanvas === */

/* === defog twocol === */
.twocol-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.twocol-card{padding:22px 24px}
.twocol-card h3{margin:0 0 12px;font-size:1.15rem;color:var(--ink,#fff);font-weight:700}
.twocol-card .code{margin:0;font-size:.82rem;white-space:pre-wrap;overflow:auto}
@media(max-width:760px){.twocol-grid{grid-template-columns:1fr}}
/* === end defog twocol === */

/* === defog final === */
.block-rich .rich-onbg{color:var(--ink-dim)} .block-rich .rich-onbg p{margin:0 0 1em}
.block-rich .rich-card{padding:26px 28px} .block-rich .blog-h,.blog-h{font-family:var(--font-display,sans-serif);font-weight:700;font-size:1.5rem;color:var(--ink,#fff);margin:1.4em 0 .5em}
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.blog-card{display:flex;flex-direction:column;gap:8px;padding:20px;transition:transform .25s ease,box-shadow .25s ease}
.blog-card:hover{transform:translateY(-5px);box-shadow:0 16px 40px rgba(0,0,0,.35)}
.blog-card h3{margin:0;font-size:1.12rem} .blog-card .blog-more{color:var(--absinthe,#C8F05A);font-weight:600}
.post-time{font-family:var(--font-util);font-size:.72rem;letter-spacing:.04em;color:var(--ink-faint)}
.blog-body{max-width:74ch} .blog-article{max-width:min(var(--w-wide),calc(100% - 32px))}
.share-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:10px 0 24px}
.share-set{display:flex;gap:8px;flex-wrap:wrap}
.share-chip{font-family:var(--font-util);font-size:.74rem;padding:6px 12px;border-radius:var(--r-pill,60px);border:1px solid var(--hairline);color:var(--ink-dim);background:rgba(255,255,255,.04);cursor:pointer}
.share-chip:hover{color:#fff;border-color:var(--periwinkle,#8B93FF)}
.cookie-consent{position:fixed;left:16px;right:16px;bottom:16px;z-index:90;max-width:720px;margin:0 auto;display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:16px 20px;border-radius:var(--r-lg,26px);background:rgba(14,12,26,.9);backdrop-filter:blur(20px);border:1px solid var(--hairline);box-shadow:0 18px 50px rgba(0,0,0,.5)}
.cookie-consent p{margin:0;font-size:.84rem;color:var(--ink-dim);flex:1 1 320px}
.cookie-actions{display:flex;gap:10px}
.procure-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 28px}
.procure-grid details{border-bottom:1px solid var(--hairline);padding:8px 0}
.procure-grid summary{cursor:pointer;font-weight:600;color:var(--ink,#fff)}
.procure-grid details p{margin:.5em 0 0;color:var(--ink-dim);font-size:.9rem}
@media(max-width:760px){.procure-grid{grid-template-columns:1fr}}
.story-card{padding:26px 28px;border-radius:var(--r-lg,26px)}
.story-a{background:linear-gradient(150deg,rgba(63,210,180,.22),rgba(107,92,165,.18))}
.story-b{background:linear-gradient(150deg,rgba(255,126,90,.20),rgba(139,147,255,.18))}
/* === end defog final === */

/* === PATCH01 blocks === */
/* spec_list 4-col: [key][val][key][val] per row via display:contents */
.spec-list.cols-4{
  display:grid;
  grid-template-columns:1fr 1.9fr 1fr 1.9fr;
  gap:0 24px;
  padding:20px 28px!important;
  max-width:none!important;
}
.spec-list.cols-4 .spec-row{display:contents}
.spec-list.cols-4 .spec-row dt{
  align-self:start;padding:13px 0;
  border-bottom:1px solid var(--hairline-soft);
  font-family:var(--font-util);font-size:.85rem;color:var(--ink);
}
.spec-list.cols-4 .spec-row dd{
  align-self:start;padding:13px 0;
  border-bottom:1px solid var(--hairline-soft);
  color:var(--ink-dim);font-weight:300;font-size:.92rem;
}
/* step_list 2×2 grid */
.step-list.grid-2x2{
  display:grid;grid-template-columns:1fr 1fr;gap:20px;
}
/* faq 2-col (auto-grows on expand since each column flows independently) */
.faq.cols-2{
  display:grid;grid-template-columns:1fr 1fr;gap:0 44px;align-items:start;
  max-width:none!important;
}
.faq.cols-2 details{break-inside:avoid}
/* logo_grid section: centered eyebrow + chips */
.block-logos.is-centered{text-align:center}
.block-logos.is-centered .sec-eyebrow{display:block!important;text-align:center}
.block-logos.is-centered .logo-grid{justify-content:center}
/* bg_title sub-size (one size smaller than biggest) */
.block-bgtitle.is-sub .hero-bg-title{font-size:var(--fs-hero-bg-sub)!important}
/* all on-background section titles: centered, 80% max-width */
.block-bgtitle .hero-bg-title,
.block-bgtitle .hero-bg-sub{
  max-width:80%;margin-left:auto;margin-right:auto;
}
.block-bgtitle.al-center .hero-bg-title,
.block-bgtitle.al-center .hero-bg-sub{text-align:center}
/* single-card blocks_row: fill 100% */
.cards-row:has(> .feature-card-lg:only-child){grid-template-columns:1fr}
/* standalone blocks fill their container width */
.block-specs .spec-list:not(.cols-4){max-width:none!important}
.block-checklist .checklist{max-width:none!important}
.block-faq .faq:not(.cols-2){max-width:none!important}
.block-infos .info-box{max-width:none!important}
/* team photo 3× size */
.team-card .team-photo,.team-card img.team-photo{
  width:222px!important;height:222px!important;border-radius:50%;object-fit:cover;
}
.team-card .team-mono{width:222px!important;height:222px!important;font-size:3.6rem!important}
.team-email{display:block;font-family:var(--font-util);font-size:.78rem;color:var(--verdigris);margin-top:6px}
/* callout bare: strip glass card, keep text centered 80% wide */
.callout.bare{
  background:none!important;border:none!important;box-shadow:none!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  max-width:80%!important;margin:0 auto!important;text-align:center;
}
.callout.bare::before{display:none!important}
.callout.bare blockquote{
  font-family:var(--font-display);font-weight:600;
  font-size:clamp(1.3rem,2.8vw,2rem);line-height:1.3;color:var(--ink);
}
.callout.bare figcaption{color:var(--ink-dim);font-family:var(--font-util);font-size:.82rem}
/* constitution card + tabs */
.constitution-wrap{width:100%}
.const-tabs{display:flex;gap:16px;margin-bottom:30px;flex-wrap:wrap}
.const-tab{
  flex:1;min-width:180px;padding:20px 22px;border-radius:var(--r-lg);
  border:2px solid var(--hairline);background:rgba(255,255,255,.04);
  cursor:pointer;text-align:left;transition:border-color .25s,background .25s;
}
.const-tab:hover{border-color:var(--periwinkle);background:rgba(139,147,255,.09)}
.const-tab.active{border-color:var(--periwinkle);background:rgba(139,147,255,.13)}
.const-tab-n{display:block;font-family:var(--font-util);font-size:.66rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--periwinkle);margin-bottom:7px}
.const-tab-label{display:block;font-family:var(--font-display);font-size:1rem;font-weight:600;color:var(--ink)}
.const-panel{display:none}
.const-panel.active{display:block;animation:cfadeIn .3s ease}
@keyframes cfadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.const-h3{font-family:var(--font-util);font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--verdigris);margin:28px 0 12px}
.const-body p{color:var(--ink-dim);font-weight:300;line-height:1.7;margin-bottom:.9em}
.const-body dt{font-weight:700;color:var(--ink);margin-top:16px;font-family:var(--font-util);font-size:.9rem}
.const-body dd{margin-left:0;padding:6px 0 6px 16px;border-left:2px solid var(--hairline);
  color:var(--ink-dim);font-weight:300;line-height:1.6;margin-bottom:10px}
.const-nav{
  display:flex;justify-content:space-between;align-items:center;
  margin-top:36px;padding-top:22px;border-top:1px solid var(--hairline);gap:16px;
}
.const-nav-btn{
  font-family:var(--font-util);font-size:.82rem;color:var(--periwinkle);
  background:none;border:1px solid var(--hairline);border-radius:var(--r-pill);
  padding:9px 18px;cursor:pointer;transition:.2s;
}
.const-nav-btn:hover{color:var(--ink);border-color:var(--periwinkle);background:rgba(139,147,255,.09)}
.const-nav-spacer{flex:1}
/* integrations page: "don't see yours?" on background */
.block-int-onbg{text-align:center;padding:40px 0}
.block-int-onbg .hero-bg-sub{max-width:72ch;margin:10px auto 20px}
.block-int-onbg p{color:var(--ink-dim);max-width:58ch;margin:0 auto;font-weight:300}
@media(max-width:760px){
  .step-list.grid-2x2{grid-template-columns:1fr}
  .faq.cols-2{grid-template-columns:1fr}
  .spec-list.cols-4{grid-template-columns:1fr 1.7fr}
  .const-tabs{flex-direction:column}
}
/* === END PATCH01 blocks === */
/* single blocks_row: stretch to full width */
.cards-row-single{grid-template-columns:1fr!important}
.cards-row-single .feature-card-lg{min-width:0;width:100%}
/* procure-grid 3-col (shield-pricing procurement section) */
.procure-3col{grid-template-columns:1fr 1fr 1fr!important}
@media(max-width:760px){.procure-3col{grid-template-columns:1fr!important}}

/* ============================================================
   fix_width_glass: SINGLE-CARD 100% WIDTH + CTA FULL WIDTH
   Every block type that renders alone on a line must fill
   the full w-wide container. Inner text gets its own max-width
   for readability; the CARD border/bg stretches edge-to-edge.
   ============================================================ */

/* info_box — was max-width:760px, now fills container */
.info-box{
  max-width:none!important;
  width:100%!important;
  box-sizing:border-box;
}
/* keep text readable inside the now-wider card */
.info-box > p,.info-box > .info-body{max-width:74ch}

/* callout — was max-width:820px + flex-centered */
.block-callout{
  display:block!important;  /* was flex:center, prevented stretching */
}
.callout{
  max-width:none!important;
  width:100%!important;
  box-sizing:border-box;
}
/* keep blockquote text readable */
.callout blockquote{max-width:70ch}
.callout figcaption{max-width:70ch}

/* bare/onBg callout — text only, 80% wide, centered */
.callout.bare{
  max-width:80%!important;
  width:auto!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center;
}

/* faq — was max-width:900px */
.faq{max-width:none!important;width:100%!important;box-sizing:border-box}

/* checklist — was max-width:860px (already patched for .block-checklist but belt+suspenders) */
.checklist{max-width:none!important;width:100%!important;box-sizing:border-box}

/* spec-list — was max-width:920px */
.spec-list{max-width:none!important;width:100%!important;box-sizing:border-box}

/* rich block — fills its block container */
.block-rich > .glass,.block-rich > div{max-width:none!important;width:100%!important}

/* stat-strip — fills full width */
.block-stats .stats-row,.stat-strip{max-width:none!important;width:100%!important}

/* logo-grid section — fills full width */
.block-logos .logo-section,.block-logos > div{max-width:none!important;width:100%!important}

/* CTA band — strip the old 1000px cap; block-cta already sets w-wide width */
.cta-band{max-width:none!important}
.block-cta .cta-band{max-width:none!important;width:100%!important}

/* Step list — fill width */
.step-list{max-width:none!important;width:100%!important}

/* Code block — fill width */
.code{max-width:none!important;width:100%!important}

/* ── GLOBAL RULE: any .block that contains exactly one direct child  ──────────
   card element should let that child fill 100%. The section.block is already
   constrained to min(w-wide, 100%-32px) by block_shell_open. */
.block > .glass,
.block > .info-box,
.block > .callout,
.block > .faq,
.block > .checklist,
.block > .spec-list,
.block > .cta-band,
.block > .step-list{
  width:100%!important;
  max-width:none!important;
  box-sizing:border-box;
}

/* ============================================================
   END fix_width_glass single-card rules
   ============================================================ */

/* ============================================================
   fix_mobile: all mobile-specific fixes
   ============================================================ */

/* ── CTA band: button wraps to new line on mobile, full width ── */
@media (max-width:640px){
  .block-cta .cta-band{flex-direction:column!important;align-items:stretch!important}
  .block-cta .cta-band > div{min-width:0!important;flex:none!important;width:100%!important}
  .block-cta .cta-band .btn{
    margin-left:0!important;margin-top:18px!important;
    width:100%!important;text-align:center!important;
    display:block!important;box-sizing:border-box;
  }
}

/* ── Code blocks: no horizontal overflow on mobile ── */
@media (max-width:880px){
  .code{
    max-width:calc(100vw - 48px)!important;
    width:100%!important;
    overflow-x:auto!important;
    word-break:break-all;
    font-size:.82rem!important;
  }
  .block-twocol .twocol-grid,.block-twocol{overflow:hidden!important}
  pre,code{max-width:100%!important;overflow-x:auto!important;word-break:break-all}
  /* code card inside two_col on mobile */
  .twocol-grid .code{max-width:calc(100vw - 64px)!important}
}

/* ── Feature grid: single column on mobile ── */
@media (max-width:640px){
  .feature-grid{grid-template-columns:1fr!important}
  .cards-row{grid-template-columns:1fr!important;justify-items:center}
  /* Step list: single column on mobile */
  .step-list.grid-2x2{grid-template-columns:1fr!important}
  /* FAQ: single column on mobile */
  .faq.cols-2{grid-template-columns:1fr!important}
  /* Spec list: two-column on mobile (not four) */
  .spec-list.cols-4{grid-template-columns:1fr 1.6fr!important}
}

/* ── Pricing cards: full width on mobile ── */
@media (max-width:640px){
  .price-card{width:100%!important;box-sizing:border-box}
  .pricing-grid{grid-template-columns:1fr!important}
}

/* ── Blog: max 90px gap between any sections on mobile ── */
@media (max-width:880px){
  .block{padding-top:min(var(--s-7),90px)!important;padding-bottom:min(var(--s-7),90px)!important}
  /* Blog index: compact hero bottom padding */
  .block.hero-block,.block.inline-hero,.block:first-child{padding-bottom:40px!important}
  /* Blog article: reduce huge space above article text */
  .blog-article{padding-top:40px!important}
  .blog-body{padding-top:20px!important}
}

/* ── Constitution: show as 3 stacked cards on mobile (hide tabs) ── */
@media (max-width:760px){
  #defog-constitution .const-tabs{display:none!important}
  #defog-constitution .const-panel{
    display:block!important;
    border:1px solid var(--hairline);
    border-radius:var(--r-lg);
    padding:22px 20px;
    margin-bottom:16px;
    background:rgba(6,8,26,.64);
    backdrop-filter:blur(20px);
  }
  #defog-constitution .const-nav{display:none!important}
}

/* ── Team cards: visible on mobile ── */
@media (max-width:640px){
  .team-grid{grid-template-columns:1fr!important}
  .team-card{width:100%!important}
  .team-card .team-photo,.team-card .team-mono{
    width:120px!important;height:120px!important;
    font-size:2rem!important;
  }
}

/* ── Stat strip: wrap on mobile ── */
@media (max-width:640px){
  .stats-row{flex-wrap:wrap!important;gap:20px!important}
  .stat-cell{flex:1 1 40%!important;min-width:140px!important}
}

/* ── Two-col: stack on mobile ── */
@media (max-width:760px){
  .twocol-grid{grid-template-columns:1fr!important}
  .block-twocol{overflow-x:hidden!important}
}

/* ── Checklist: pad correctly on mobile ── */
@media (max-width:640px){
  .checklist{padding:20px 18px!important}
  .checklist.cols-2{grid-template-columns:1fr!important}
}

/* ── End fix_mobile ── */

/* === fix_icons_orbit: icons no square bg, 3x bigger === */
/* Feature cards: remove square background behind icons */
.feature-card .f-icon{
  background:none!important;
  border:none!important;
  box-shadow:none!important;
  border-radius:0!important;
  width:auto!important;
  height:auto!important;
  margin-bottom:14px!important;
  /* 3x bigger: from 1.3rem to 3.6rem */
  font-size:3.6rem!important;
}
.feature-card .f-icon .material-icons{
  font-size:3.2rem!important;
  line-height:1;
}

/* Feature-card-lg (blocks_row cards) also get large bare icons */
.feature-card-lg .t-ic{
  background:none!important;
  border:none!important;
  box-shadow:none!important;
  border-radius:0!important;
  width:auto!important;
  height:auto!important;
  margin-bottom:12px!important;
  font-size:3.2rem!important;
}
.feature-card-lg .t-ic .material-icons{
  font-size:3rem!important;
  line-height:1;
}
/* === end fix_icons_orbit icons === */

/* ============================================================
   fix_final: GLOBAL SPACING — 40px sections, 20px items
   Overrides any previously appended rules that used larger gaps.
   ============================================================ */

/* Every section block: cap at 40px top/bottom */
.block{
  padding-top:40px!important;
  padding-bottom:40px!important;
}
/* Hero blocks get a bit more breathing room (but not excessive) */
.hero-block,.block:first-child,.block.hero-interior{
  padding-top:60px!important;
  padding-bottom:40px!important;
}
/* Between items in the SAME section: 20px */
.cards-row{gap:20px!important}
.feature-grid{gap:20px!important}
.step-list{gap:20px!important}
.step-list.grid-2x2{gap:20px!important}
.const-tabs{gap:12px!important;margin-bottom:20px!important}
.stats-row{gap:20px!important}
.logo-grid{gap:12px!important}
.spec-list dl,.spec-list{gap:0!important}
.faq{gap:0!important}
/* Team grid: 20px between member cards */
.team-grid{gap:20px!important}

/* Blog article body: tighten line spacing */
.blog-body p,.blog-article p{margin-bottom:14px!important}

/* Ticker / marquee: reduce gap to next block */
.block-ticker,.ticker-wrap{padding:0!important;margin:0!important}

/* Callout bare on background: minimal vertical margin */
.block-callout .callout.bare,.block-onbg .callout.bare{
  padding-top:20px!important;padding-bottom:20px!important;
}

/* Stat strip: tighter */
.block-stats{padding-top:30px!important;padding-bottom:30px!important}

/* Mobile: tighter still */
@media(max-width:880px){
  .block{padding-top:30px!important;padding-bottom:30px!important}
  .hero-block,.block:first-child{padding-top:40px!important;padding-bottom:30px!important}
  .cards-row,.feature-grid,.step-list,.const-tabs,.team-grid{gap:16px!important}
}
@media(max-width:640px){
  .block{padding-top:24px!important;padding-bottom:24px!important}
  .hero-block,.block:first-child{padding-top:32px!important;padding-bottom:24px!important}
}

/* ── BROWSER / PLATFORM CARDS on mobile: 100% wide, 20px gap ── */
@media(max-width:880px){
  .cards-row .feature-card-lg{
    width:100%!important;
    max-width:none!important;
    box-sizing:border-box;
  }
}

/* ── "What you get on install" heading: use hero-bg-sub font ── */
/* The page_heading h2 for this section should match hero size */
.block-pageheading .sec-title,
.block-pageheading h2.display{
  font-size:var(--fs-hero-bg-sub)!important;
  font-family:var(--font-display)!important;
  font-weight:900!important;
  margin-bottom:20px!important;
}
.block-pageheading{
  padding-top:24px!important;
  padding-bottom:16px!important;
}

/* ── CTA band: reduce top padding so it doesn't float ── */
.block-cta{padding-top:24px!important;padding-bottom:24px!important}

/* ── Team grid: visible on ALL screen sizes ── */
.team-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr))!important;
  gap:20px!important;
}
@media(max-width:640px){
  .team-grid{grid-template-columns:1fr!important}
}
.team-card{display:flex!important;flex-direction:column!important;align-items:center!important}

/* ── Constitution on mobile: 3 stacked content cards, no tabs ── */
@media(max-width:760px){
  #defog-constitution .const-tabs{display:none!important}
  #defog-constitution .const-panel{
    display:block!important;
    padding:18px!important;
    margin-bottom:16px!important;
    border:1px solid var(--hairline)!important;
    border-radius:var(--r-lg)!important;
    background:rgba(6,8,26,.68)!important;
    backdrop-filter:blur(20px)!important;
  }
  #defog-constitution .const-nav{display:none!important}
  #defog-constitution .const-panel-h{
    font-size:1.1rem!important;
    margin-bottom:12px!important;
  }
}

/* ── About page: force section order and spacing on mobile ── */
@media(max-width:760px){
  /* Ensure about blocks stack in document order (already the case; enforce no float) */
  .block-callout .callout.bare blockquote{
    font-size:1.15rem!important;
    text-align:center!important;
  }
}

/* ── "Why These Principles Exist" follow-up card on about: compact ── */
.block-rich .glass{padding:24px 20px!important}

/* ── END fix_final spacing === */

/* === defog fix1 === */
/* rich-onbg: always centered container + text */
.rich-onbg { display:block; text-align:center; max-width:80%; margin:0 auto; }

/* bg_title heroSize: biggest display size */
.hero-size-xl { font-size:clamp(2.4rem,7vw,5.2rem)!important; }

/* Blog: no gap before first article, always visible */
.blog-article:first-of-type { margin-top:0!important; }
.blog-article.reveal { opacity:1!important; transform:none!important; animation:none!important; }

/* Manifesto principle grid: 2-col guaranteed */
.principle-grid { display:grid!important; grid-template-columns:1fr 1fr!important; gap:20px; width:100%; }
@media(max-width:700px){ .principle-grid{grid-template-columns:1fr!important;} }

/* Articles grid: 3-col guaranteed */
.articles-grid { display:grid!important; grid-template-columns:repeat(3,1fr)!important; gap:20px; width:100%; }
.article-last { grid-column:2; }
@media(max-width:900px){ .articles-grid{grid-template-columns:1fr 1fr!important;} .article-last{grid-column:1;} }
@media(max-width:600px){ .articles-grid{grid-template-columns:1fr!important;} }

/* About/manifesto: center bg_title + spacer before constitution */
.block-bgtitle.heroSize .hero-bg-title, 
.hero-size-xl { text-align:center; max-width:80%; margin:0 auto; }

/* Blog hero split: news swiper in right column */
.blog-hero-inner { display:flex; align-items:stretch; gap:40px; }
.blog-hero-copy { flex:0 0 52%; }
.blog-hero-news { flex:1; display:flex; flex-direction:column; gap:10px; padding-top:10px; }

/* Blog hero: side-by-side hero card + news card */
.blog-hero-row { display:flex; align-items:stretch; gap:20px; }
.blog-hero-row .hero-copy { flex:0 0 52%; }
.blog-news-card {
  flex:1; display:flex; flex-direction:column;
  justify-content:center; align-items:stretch;
  padding:20px; overflow:hidden;
}
.blog-news-card .hns-feed-label { margin-bottom:10px; }
.blog-news-card .news-feed-swiper { flex:1; min-height:0; }
@media(max-width:860px){ .blog-hero-row{flex-direction:column;} }

/* === end defog fix1 === */

/* === defog pricing-video-news === */
/* ── Pricing Video Swiper ─────────────────────────────────────── */
.block-pricing-vid { padding:0 0 60px; }
.pricing-vid-swiper { width:100%;padding:40px 0 60px;overflow:visible!important; }
.price-vid-slide {
  width:274px!important; height:500px; border-radius:24px;
  overflow:hidden; position:relative; cursor:grab;
  box-shadow:0 8px 40px rgba(0,0,0,.5);
  transition:box-shadow .3s;
}
.swiper-slide-active.price-vid-slide { box-shadow:0 16px 60px rgba(0,0,0,.7); }
.plan-video {
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; display:block;
}
/* Active info layer — fades in on active slide */
.plan-active-info {
  position:absolute; inset:0; z-index:2;
  background:linear-gradient(to top, rgba(7,6,14,.95) 0%, rgba(7,6,14,.3) 55%, transparent 100%);
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:22px 18px; opacity:0; pointer-events:none;
  transition:opacity .35s ease;
}
.swiper-slide-active .plan-active-info { opacity:1; pointer-events:auto; }
.plan-price-row { display:flex; align-items:baseline; gap:5px; margin-bottom:10px; }
.plan-price-val { font-family:var(--font-display,sans-serif); font-size:2.6rem; font-weight:900; color:#fff; line-height:1; }
.plan-price-per { font-size:.8rem; color:rgba(255,255,255,.55); }
.plan-mini-feats { list-style:none; padding:0; margin:0 0 14px; }
.plan-mini-feats li { font-size:.74rem; color:rgba(255,255,255,.78); padding:2px 0; }
.plan-mini-feats li::before { content:'✓ '; color:var(--absinthe,#C8F05A); }
.plan-sub-btn {
  width:100%; background:linear-gradient(110deg,var(--absinthe,#C8F05A),var(--verdigris,#3FD2B4));
  color:#07060e; font-family:var(--font-util,sans-serif); font-weight:700; font-size:.88rem;
  padding:10px 0; border:none; border-radius:20px; cursor:pointer; transition:filter .2s;
}
.plan-sub-btn:hover { filter:brightness(1.08); }
/* Selected overlay — slides up from bottom */
.plan-sel-overlay {
  position:absolute; inset:0; z-index:5;
  background:rgba(7,6,14,.95);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  border-radius:inherit; padding:18px 16px;
  display:flex; flex-direction:column;
  transform:translateY(100%); transition:transform .38s cubic-bezier(.4,0,.2,1);
  overflow-y:auto;
}
.plan-sel-overlay.is-open { transform:translateY(0); }
.plan-close-x {
  position:absolute; top:12px; right:12px;
  background:rgba(255,255,255,.1); border:none; color:#fff;
  width:26px; height:26px; border-radius:50%; cursor:pointer; font-size:.75rem;
}
.plan-sel-name { font-family:var(--font-display,sans-serif); font-size:1.4rem; font-weight:900; color:#fff; margin:0 0 4px; }
.plan-sel-desc { font-size:.75rem; color:rgba(255,255,255,.55); margin:0 0 14px; }
.plan-billing { display:flex; flex-direction:column; gap:7px; margin-bottom:12px; }
.billing-pick {
  display:flex; align-items:center; justify-content:space-between;
  padding:9px 12px; border-radius:12px;
  border:1px solid rgba(255,255,255,.14); background:transparent;
  color:#fff; font-size:.8rem; cursor:pointer; transition:background .2s,border-color .2s;
  position:relative;
}
.billing-pick.is-sel { background:rgba(200,240,90,.14); border-color:var(--absinthe,#C8F05A); }
.bp-save {
  position:absolute; right:10px; top:-8px;
  background:var(--absinthe,#C8F05A); color:#07060e;
  font-size:.62rem; font-weight:800; padding:1px 6px; border-radius:8px;
}
.plan-sel-feats { list-style:none; padding:0; margin:0 0 12px; flex:1; }
.plan-sel-feats li { display:flex; align-items:center; gap:6px; font-size:.74rem; color:rgba(255,255,255,.72); padding:3px 0; }
.plan-sel-feats li i { color:var(--absinthe,#C8F05A); font-style:normal; }
.plan-go-btn {
  display:block; text-align:center; text-decoration:none;
  background:linear-gradient(110deg,var(--absinthe,#C8F05A),var(--verdigris,#3FD2B4));
  color:#07060e; font-weight:700; font-size:.88rem;
  padding:11px 0; border-radius:20px;
}

/* ── News Feed Swiper (manifesto hero split) ──────────────────── */
.hns-inner { display:flex; align-items:stretch; gap:40px; }
.hns-copy { flex:0 0 52%; }
.hns-news { flex:1; display:flex; flex-direction:column; gap:10px; padding-top:10px; }
.hns-feed-label { font-family:var(--font-util,sans-serif); font-size:.68rem; letter-spacing:.12em; color:var(--verdigris,#3FD2B4); text-transform:uppercase; margin-bottom:6px; }
.news-feed-swiper { height:400px; overflow:hidden; }
.news-feed-swiper .swiper-scrollbar { right:2px; }
.news-card {
  display:flex; flex-direction:column; height:auto; min-height:140px;
  text-decoration:none; border-radius:14px; overflow:hidden;
  transition:transform .2s; cursor:pointer;
}
.news-card:hover { transform:translateY(-2px); }
.nc-img-wrap { width:100%; height:80px; overflow:hidden; flex-shrink:0; position:relative; }
.nc-img-wrap img { width:100%; height:100%; object-fit:cover; }
.nc-body { padding:10px 12px; display:flex; flex-direction:column; gap:3px; }
.nc-source { font-size:.62rem; color:var(--verdigris,#3FD2B4); text-transform:uppercase; letter-spacing:.06em; }
.nc-title { font-size:.8rem; font-weight:700; color:var(--ink,#e8e8f0); margin:0; line-height:1.35; }
.nc-desc { font-size:.72rem; color:var(--ink-dim); margin:0; line-height:1.4; }
.nc-time { font-size:.64rem; color:var(--ink-dim); margin-top:auto; }
.nc-loading { display:grid; place-items:center; height:200px; color:var(--ink-dim); }
@media(max-width:900px){
  .hns-inner { flex-direction:column; }
  .hns-copy,.hns-news { flex:none; width:100%; }
  .news-feed-swiper { height:300px; }
}
/* === end defog pricing-video-news === */

/* === defog fix2-centering === */
/* bg_title centering — cover both class names (blocks.php outputs 'block-bgtitle') */
.block-bgtitle, .block-bg-title { text-align:center; }
.block-bgtitle .hero-bg-title,
.block-bg-title .hero-bg-title {
  display:block; text-align:center !important;
  max-width:80%; margin-left:auto; margin-right:auto;
}
.block-bgtitle .hero-bg-sub,
.block-bg-title .hero-bg-sub {
  display:block; text-align:center !important;
  max-width:80%; margin-left:auto; margin-right:auto;
}
/* .is-center used on the h2 element itself */
.hero-bg-title.is-center, .hero-bg-sub.is-center {
  text-align:center !important;
  max-width:80%; margin-left:auto; margin-right:auto;
}
/* Blog hero two-column layout */
.blog-hero-row { display:flex; align-items:stretch; gap:20px; width:100%; }
.blog-hero-copy { flex:0 0 50%; }
.blog-news-card {
  flex:1; display:flex; flex-direction:column; padding:20px;
  min-height:300px; overflow:hidden;
}
.blog-news-card .hns-feed-label { margin-bottom:10px; }
.blog-news-card .news-feed-swiper { flex:1; min-height:0; height:320px; }
@media(max-width:860px){
  .blog-hero-row { flex-direction:column; }
  .blog-hero-copy, .blog-news-card { flex:none; width:100%; }
}
/* === end defog fix2-centering === */



/* === defog fix3 === */
/* Blog hero: two columns, side-by-side, not nested */
.blog-hero-row {
  display:flex !important; align-items:stretch; gap:24px; width:100%;
}
.blog-hero-copy-wrap, .blog-news-wrap {
  flex:1 1 50%; min-width:0; display:flex;
}
.blog-hero-copy-wrap > .hero-copy.glass,
.blog-news-wrap > .glass { width:100%; }
.blog-news-card {
  display:flex; flex-direction:column; padding:20px;
  min-height:320px; max-height:480px; overflow:hidden;
}
.blog-news-card .hns-feed-label {
  font-family:var(--font-util,sans-serif); font-size:.7rem;
  letter-spacing:.12em; text-transform:uppercase;
  color:var(--verdigris,#3FD2B4); margin-bottom:12px;
}
.blog-news-card .news-feed-swiper { flex:1; min-height:0; height:100%; }
.blog-news-card .news-card {
  display:flex; flex-direction:column; padding:10px 12px;
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08);
  border-radius:10px; text-decoration:none; cursor:pointer;
}
.blog-news-card .nc-img-wrap { height:60px; overflow:hidden; border-radius:6px; margin-bottom:6px; }
.blog-news-card .nc-img-wrap img { width:100%; height:100%; object-fit:cover; }
.blog-news-card .nc-source { font-size:.6rem; color:var(--verdigris,#3FD2B4); text-transform:uppercase; }
.blog-news-card .nc-title { font-size:.78rem; margin:2px 0 0; color:var(--ink); line-height:1.35; }
@media(max-width:860px){
  .blog-hero-row { flex-direction:column; }
  .blog-hero-copy-wrap, .blog-news-wrap { flex:none; width:100%; }
}

/* Blog article: left-aligned, full-width, not centered */
.blog-title {
  font-family:var(--font-display,sans-serif); font-weight:900;
  font-size:clamp(1.8rem,4vw,2.6rem);
  color:var(--ink); margin:0 0 14px;
  text-align:left !important; max-width:none !important;
}
.blog-body {
  text-align:left !important; max-width:none !important;
  margin:0 !important; color:var(--ink-dim);
}
.blog-body p, .blog-body h2, .blog-body h3, .blog-body li {
  text-align:left !important;
}

/* GLOBAL: any text-on-bg (bg_title, rich onBg) must be centered in 80% wrapper */
.block-bgtitle, .block-bg-title {
  text-align:center !important;
}
.block-bgtitle > *, .block-bg-title > * {
  max-width:80%; margin-left:auto; margin-right:auto;
  text-align:center !important;
}
.hero-bg-title, .hero-bg-sub {
  text-align:center !important;
  max-width:80%; margin-left:auto; margin-right:auto;
}
/* Override: only the blog article title escapes this */
.blog-title.hero-bg-title { text-align:left !important; max-width:none !important; }

/* rich-onbg: forced centered 80% */
.rich-onbg, .block-rich.is-onbg {
  text-align:center !important;
  max-width:80% !important; margin:0 auto !important;
}
.rich-onbg p, .block-rich.is-onbg p { text-align:center !important; }
/* === end defog fix3 === */

/* === defog fix3-quote === */
/* 100%-wide quote card (compliance, etc.) */
.quote-card { padding:32px 36px; }
.quote-card .quote-body {
  font-family:var(--font-display,sans-serif); font-size:1.1rem;
  line-height:1.55; color:var(--ink); margin:0 0 12px; max-width:none;
  text-align:left;
}
.quote-card .quote-attr {
  font-size:.85rem; color:var(--verdigris,#3FD2B4); margin:0;
  text-align:left;
}

/* heroSize bg_title — biggest display font */
.hero-size-xl, .hero-bg-title.hero-size-xl,
.block-bgtitle.heroSize .hero-bg-title {
  font-size:clamp(2.2rem, 5vw, 4rem) !important;
  font-family:var(--font-display,sans-serif) !important;
  font-weight:900 !important; line-height:1.05 !important;
  text-align:center !important; max-width:80% !important;
  margin-left:auto !important; margin-right:auto !important;
}
/* === end defog fix3-quote === */

/* === defog v5 pricing-news-tiles === */
/* ── Pricing Video Swiper — slides must have explicit width + visibility ── */
.pricing-vid-swiper {
  width: 100% !important;
  padding: 40px 0 60px;
  overflow: visible !important;
}
.pricing-vid-swiper .swiper-wrapper {
  align-items: center;
}
.pricing-vid-swiper .swiper-slide.price-vid-slide {
  width: 274px !important;
  height: 500px !important;
  flex-shrink: 0;
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  background: #0a0712;
}
.pricing-vid-swiper .plan-video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; z-index: 1;
}
.pricing-vid-swiper .swiper-pagination {
  position: relative;
  margin-top: 20px;
}
.block-pricing-vid { padding: 20px 0; min-height: 600px; }

/* ── Blog news card: fill from 40px right of copy card to content edge ── */
.blog-hero-row { gap: 40px !important; }
.blog-news-wrap { flex: 1 1 auto !important; min-width: 0; }
.blog-news-card {
  width: 100%; height: 100%; min-height: 380px;
  display: flex; flex-direction: column;
  padding: 20px;
}
.blog-news-card .news-feed-swiper {
  flex: 1; min-height: 0;
  width: 100%;
  height: 320px;
}
.blog-news-card .swiper-slide {
  height: auto !important;
  padding: 6px 0;
}
.blog-news-card .news-card {
  display: flex !important;
  flex-direction: row !important;
  gap: 12px;
  padding: 10px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 10px;
  text-decoration: none;
  min-height: 80px;
}
.blog-news-card .nc-img-wrap {
  flex: 0 0 80px;
  height: 80px;
  border-radius: 8px;
  overflow: hidden;
  margin: 0;
}
.blog-news-card .nc-img-wrap img {
  width: 100%; height: 100%; object-fit: cover;
  display: block;
}
.blog-news-card .nc-body {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; gap: 4px;
}
.blog-news-card .nc-source {
  font-size: .62rem; color: var(--verdigris,#3FD2B4);
  text-transform: uppercase; letter-spacing: .08em;
}
.blog-news-card .nc-title {
  font-size: .82rem; color: var(--ink,#e8e8f0);
  margin: 0; line-height: 1.35;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ── Homepage hero tiles: match interior tile glass / transparency / saturation ── */
.hero .dock-tile,
.hero-tiles .dock-tile {
  background: rgba(20, 18, 38, 0.55) !important;
  backdrop-filter: blur(14px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(140%) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  /* Uniform sizing */
  width: 240px !important;
  min-width: 240px !important;
  max-width: 240px !important;
  height: 140px !important;
  min-height: 140px !important;
  max-height: 140px !important;
  overflow: auto !important;
  padding: 14px 16px !important;
}
/* Larger interior orbiting tiles keep their own size override */
.tiles-interior .dock-tile.lg {
  width: 240px !important;
  min-width: 240px !important;
  max-width: 240px !important;
  height: 140px !important;
  min-height: 140px !important;
  max-height: 140px !important;
  overflow: auto !important;
}
.hero .dock-tile h3,
.tiles-interior .dock-tile h3 { font-size: .9rem !important; }
.hero .dock-tile p,
.tiles-interior .dock-tile p { font-size: .78rem !important; }
/* === end defog v5 pricing-news-tiles === */

/* === defog v6 carousels === */
/* ── Custom 3D Carousel — shared base ─────────────────────────────────────── */
.d3-carousel {
  position: relative;
  width: 100%;
  perspective: 1400px;
  user-select: none;
  background: transparent;
  overflow: visible;
}
.d3-carousel-stage {
  position: relative;
  width: 100%;
  transform-style: preserve-3d;
  margin: 0 auto;
}
.d3-card {
  position: absolute;
  top: 50%;
  left: 50%;
  transform-style: preserve-3d;
  transition: transform .55s cubic-bezier(.4,0,.2,1),
              opacity .55s cubic-bezier(.4,0,.2,1);
  cursor: default;
  background: transparent;
}
.d3-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 20;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.08);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50%;
  color: #fff;
  cursor: pointer;
  font-size: 1.2rem;
  transition: background .2s, transform .15s;
}
.d3-arrow:hover { background: rgba(255,255,255,.18); }
.d3-arrow:active { transform: translateY(-50%) scale(.92); }
.d3-arrow.d3-prev { left: 8px; }
.d3-arrow.d3-next { right: 8px; }

/* ── Pricing 3D Carousel ──────────────────────────────────────────────────── */
.d3-pricing { padding: 30px 0 50px; }
.d3-pricing .d3-carousel-stage { height: 540px; }
.d3-pricing .d3-card {
  width: 274px;
  height: 500px;
  margin-left: -137px;     /* center horizontally */
  margin-top: -250px;      /* center vertically */
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(0,0,0,.5);
}
.d3-pricing .plan-video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  pointer-events: none;
}
/* Title bar (always visible) */
.d3-pricing .plan-title-bar {
  position: absolute;
  top: 18px; left: 0; right: 0;
  text-align: center;
  font-family: var(--font-display,sans-serif);
  font-weight: 700;
  font-size: 1rem;
  color: #fff;
  text-shadow: 0 2px 8px rgba(0,0,0,.6);
  z-index: 3;
  pointer-events: none;
}
/* Active card overlay: catches all clicks + shows details */
.d3-pricing .plan-overlay {
  position: absolute; inset: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 22px 18px;
  background: linear-gradient(to top, rgba(7,6,14,.94) 0%, rgba(7,6,14,.4) 55%, transparent 100%);
  opacity: 0;
  pointer-events: none;
  transition: opacity .35s;
  cursor: pointer;
}
.d3-card.is-active .plan-overlay {
  opacity: 1;
  pointer-events: auto;
}
.d3-card.is-active .plan-overlay:hover { cursor: pointer; }
.d3-pricing .plan-price-row {
  display: flex; align-items: baseline; gap: 6px;
  margin-bottom: 10px;
}
.d3-pricing .plan-price-val {
  font-family: var(--font-display,sans-serif);
  font-size: 2.4rem; font-weight: 900;
  color: #fff; line-height: 1;
}
.d3-pricing .plan-price-per {
  font-size: .8rem; color: rgba(255,255,255,.6);
}
.d3-pricing .plan-feats {
  list-style: none; padding: 0; margin: 0 0 14px;
}
.d3-pricing .plan-feats li {
  font-size: .76rem; color: rgba(255,255,255,.82);
  padding: 2px 0;
}
.d3-pricing .plan-feats li::before {
  content: '✓ '; color: var(--absinthe,#C8F05A);
}
.d3-pricing .plan-cta {
  display: block; text-align: center;
  background: linear-gradient(110deg, var(--absinthe,#C8F05A), var(--verdigris,#3FD2B4));
  color: #07060e; font-weight: 700; font-size: .9rem;
  padding: 11px 0; border-radius: 22px;
  text-decoration: none;
}

/* Monthly/Annual toggle */
.d3-billing-toggle {
  display: flex;
  justify-content: center;
  gap: 4px;
  margin: 0 auto 24px;
  width: fit-content;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 24px;
  padding: 4px;
}
.d3-billing-toggle button {
  background: transparent;
  border: none;
  color: rgba(255,255,255,.6);
  font-family: var(--font-util,sans-serif);
  font-size: .82rem;
  padding: 8px 18px;
  border-radius: 20px;
  cursor: pointer;
  transition: all .2s;
}
.d3-billing-toggle button.is-on {
  background: linear-gradient(110deg, var(--absinthe,#C8F05A), var(--verdigris,#3FD2B4));
  color: #07060e;
  font-weight: 700;
}
.d3-billing-save {
  font-size: .62rem; font-weight: 800;
  background: var(--absinthe,#C8F05A); color: #07060e;
  padding: 1px 6px; border-radius: 8px; margin-left: 6px;
}

/* ── News 3D Carousel ─────────────────────────────────────────────────────── */
.d3-news { padding: 0; width: 100%; height: 100%; }
.d3-news .d3-carousel-stage { height: 320px; }
.d3-news .d3-card {
  width: 220px;
  height: 280px;
  margin-left: -110px;
  margin-top: -140px;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0,0,0,.4);
}
.d3-news .news-img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; z-index: 1;
}
.d3-news .news-overlay {
  position: absolute; inset: 0;
  z-index: 2;
  padding: 14px;
  display: flex; flex-direction: column; justify-content: flex-end;
  background: linear-gradient(to top, rgba(0,0,0,.92) 0%, rgba(0,0,0,.4) 50%, transparent 100%);
  text-decoration: none;
  pointer-events: none;
}
.d3-news .d3-card.is-active .news-overlay { pointer-events: auto; }
.d3-news .news-source {
  font-size: .58rem; color: var(--verdigris,#3FD2B4);
  text-transform: uppercase; letter-spacing: .08em;
  margin-bottom: 4px;
}
.d3-news .news-title {
  font-size: .82rem; color: #fff;
  margin: 0; line-height: 1.3; font-weight: 700;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* News carousel sits in blog hero right column, 40px gap, fills to edge */
.blog-hero-row { gap: 40px !important; align-items: stretch; }
.blog-news-wrap {
  flex: 1 1 auto !important;
  display: flex;
  align-items: center;
  min-width: 0;
}
.blog-news-wrap .d3-news { width: 100%; }

/* Kill any leftover Swiper / .glass shell around the news carousel */
.blog-news-card.is-d3 {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  backdrop-filter: none !important;
}
/* === end defog v6 carousels === */

/* === defog news carousel fit === */
.blog-hero-row{
  display:flex !important; align-items:stretch; gap:40px !important;
  width:min(var(--w-wide),100%); margin-left:auto; margin-right:auto;
}
.blog-hero-copy-wrap{ flex:0 0 46% !important; min-width:0; }
.blog-news-wrap{
  flex:1 1 auto !important; min-width:0;
  display:flex; align-items:center;
  overflow:hidden;            /* clip the coverflow so it never spills past the right edge */
}
.blog-news-wrap .d3-news,
.blog-news-wrap .d3-carousel{ width:100%; }
.d3-news .d3-carousel-stage{ overflow:visible; }
@media (max-width:860px){
  .blog-hero-row{ flex-direction:column; }
  .blog-hero-copy-wrap,.blog-news-wrap{ flex:none !important; width:100%; }
  .blog-news-wrap{ overflow:visible; }
}
/* === end defog news carousel fit === */

/* === defog section-center + arrows === */
.block-bgtitle, .block-bg-title{ text-align:center !important; }
.block-bgtitle > *, .block-bg-title > *{ margin-left:auto !important; margin-right:auto !important; }
.hero-bg-title, .hero-bg-sub, .sec-title{
  text-align:center !important; margin-left:auto !important; margin-right:auto !important;
}
.sec-eyebrow{ display:block !important; text-align:center !important; width:100%; }
/* blog post title stays left */
.blog-title.hero-bg-title{ text-align:left !important; margin-left:0 !important; margin-right:0 !important; }
/* Pricing carousel arrows: 80px gap from the carousel sides */
.d3-pricing .d3-arrow.d3-prev{ left:80px !important; }
.d3-pricing .d3-arrow.d3-next{ right:80px !important; }
/* === end defog section-center + arrows === */

/* === defog carousel-width + tagline + onbg-center === */
.blog-hero-row{
  display:flex !important; align-items:stretch; gap:40px !important;
  width:min(var(--w-wide),100%); margin-left:auto; margin-right:auto;
}
.blog-hero-row .hero-copy{
  position:static !important; flex:0 0 38% !important;
  width:auto !important; max-width:none !important; top:auto !important;
}
.blog-hero-copy-wrap{ flex:0 0 38% !important; display:flex; min-width:0; }
.blog-news-wrap{
  flex:1 1 auto !important; min-width:0;
  display:flex; align-items:center; overflow:hidden;
}
.blog-news-wrap .d3-news,
.blog-news-wrap .d3-carousel{ width:100%; }
@media (max-width:860px){
  .blog-hero-row{ flex-direction:column; }
  .blog-hero-row .hero-copy,
  .blog-hero-copy-wrap, .blog-news-wrap{ flex:none !important; width:100% !important; }
  .blog-news-wrap{ overflow:visible; }
}

/* image_split media tagline overlay */
.split-media{ position:relative; }
.split-tagline{
  position:absolute; left:0; right:0; bottom:0; z-index:3;
  padding:16px 22px;
  background:linear-gradient(to top, rgba(7,8,20,.93), rgba(7,8,20,.66) 60%, rgba(7,8,20,0));
  color:#eef0ff;
  font-family:var(--font-display,sans-serif); font-weight:700;
  font-size:clamp(1.05rem,1.7vw,1.45rem); line-height:1.16;
  text-shadow:0 2px 14px rgba(0,0,0,.55);
}

/* centered div, left-justified text (About fix + intro prose vehicle) */
.rich-onbg, .onbg{ margin-left:auto !important; margin-right:auto !important; text-align:left; }
/* === end defog carousel-width + tagline + onbg-center === */

/* === defog polish: pricing gap + callout + blog copy === */
/* Pricing: <=40px above the section after the plan carousel (both pricing pages) */
.block-pricing-vid{ min-height:auto !important; padding-bottom:0 !important; }
.d3-pricing{ padding-bottom:0 !important; }
.block-pricing-vid + .block{ padding-top:40px !important; }

/* Callout (bare): attribution centered, 20px below the quote */
.callout.bare blockquote{ max-width:70ch; margin:0 auto 20px !important; text-align:center; }
.callout.bare figcaption{ max-width:70ch; margin:0 auto !important; text-align:center; }

/* Blog left hero card: fixed 430px, like the interior pages */
.blog-hero-row .hero-copy{ flex:0 0 430px !important; width:430px !important; max-width:430px !important; }
.blog-hero-copy-wrap{ flex:0 0 430px !important; }
@media (max-width:860px){
  .blog-hero-row .hero-copy,
  .blog-hero-copy-wrap{ flex:none !important; width:100% !important; max-width:none !important; }
}
/* === end defog polish: pricing gap + callout + blog copy === */

/* === defog split-tagline center === */
.split-tagline{
  left:50% !important; right:auto !important; top:50% !important; bottom:auto !important;
  transform:translate(-50%,-50%) !important;
  width:max-content !important; max-width:86% !important;
  padding:16px 26px !important;
  background:rgba(222,226,238,.46) !important;
  backdrop-filter:blur(7px) saturate(1.1) !important;
  -webkit-backdrop-filter:blur(7px) saturate(1.1) !important;
  border:1px solid rgba(255,255,255,.28) !important;
  border-radius:18px !important;
  color:#10131f !important;
  text-align:center !important;
  font-size:clamp(1.7rem,3vw,2.6rem) !important;
  line-height:1.14 !important;
  text-shadow:none !important;
}
/* === end defog split-tagline center === */

/* === defog blog news center === */
.blog-news-wrap .d3-news{
  display:flex; flex-direction:column; justify-content:center;
  position:relative; top:12px;
}
/* === end defog blog news center === */

/* === defog intro prose left === */
/* Intro-prose blocks: the div is a true 80% wide, centered column, but the
   paragraphs read LEFT-aligned with breathing room above. Exception to the
   centered onBg standard; other onBg blocks (manifesto, about) are unaffected. */
.rich-onbg.src-defog-intro{
  width:80% !important; max-width:80% !important;
  margin-left:auto !important; margin-right:auto !important;
  text-align:left !important; padding-top:48px !important;
}
.rich-onbg.src-defog-intro p{ text-align:left !important; }
/* === end defog intro prose left === */