/* ============================================================================
   heg.ai DECK CAROUSEL ENGINE (scoped) · _heg/heg-carousel-deck.css
   Generated from .claude/skills/heg-carousel/carousel.css — every selector is
   scoped under .heg-deck so the 1080x1350 designed-slide vocabulary can be
   embedded inside marketing pages without colliding with site styles.
   Wrap a carousel in <div class="heg-deck"> … </div>.
   ============================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Onest:wght@400;500;700;800&family=IBM+Plex+Mono:wght@400;500;600&family=Source+Serif+4:ital@1&display=swap');

.heg-deck{ --font-structure:"Onest",system-ui,-apple-system,sans-serif;
  --font-tech:"IBM Plex Mono",ui-monospace,monospace;
  --font-human:"Source Serif 4",Georgia,serif;
  --ink:#101F18; --ink-700:#1B2E25; --ivory:#FCFAF1; --ivory-300:#F1ECD8;
  --green:#06463D; --green-600:#0A5A4E; --green-800:#04342D;
  --ember:#FF6A3D; --ember-100:#FFE4DA; --blue:#B7D4E4; --blue-100:#DCEAF1; --black:#101F18;
  --text-secondary:rgba(16,31,24,.62);
  --glass-blur:blur(30px) saturate(125%);
  --glass-rim:inset 0 1px 0 rgba(255,255,255,.18);
  --film:contrast(.94) saturate(.9) brightness(1.05) sepia(.16) hue-rotate(-8deg);
  --deck-scale:.3;
  --grain-url:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  font-family:var(--font-structure); color:var(--ink); }
.heg-deck *{box-sizing:border-box}
/* defend deck typography from page base element rules (Astro h1,h2,h3{f-display}) */
.heg-deck h1,.heg-deck h2,.heg-deck h3,.heg-deck h4,.heg-deck p{font-family:var(--font-structure);margin:0;letter-spacing:inherit}
.heg-deck .car{max-width:100%;margin:0}
/* ============================================================================
   heg.ai CAROUSEL ENGINE  ·  carousel.css
   Slide vocabulary + rail mechanics for heg.ai carousels (SMM decks @1080x1350
   AND embeddable web rails). Pairs with the `heg-ai-design` skill for full DS
   rules. Source of truth: heg-ai-design-system-6/«Карусели heg.ai.html».
   Fonts by job: Onest = structure, IBM Plex Mono = data/eyebrows, Source Serif
   4 italic = quotes ONLY. NO gradients. Grain only on photos. Rect not circle.
   ============================================================================ */

/* --- reset / page shell (deck preview surface) --- */

/* --- photos: plain <img> path (no custom element needed): warm filmic grade.
       Wrap in .filmwrap to also bake the grain overlay. <image-slot> from the DS
       also works (its ::part(image) carries the same grade). --- */
.heg-deck .filmwrap img, .heg-deck img.ph{width:100%;height:100%;object-fit:cover;display:block;filter:var(--film)}/* --- carousel container · header · rail · thumbnails --- */
.heg-deck .car{max-width:1640px;margin:0 auto 30px}.heg-deck .car-h{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:0 4px 16px}.heg-deck .car-h .t .n{font-family:var(--font-tech);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ember);font-weight:600}.heg-deck .car-h .t h2{font-weight:700;font-size:26px;letter-spacing:-.01em;margin:6px 0 4px}.heg-deck .car-h .t span{font-size:14px;color:rgba(16,31,24,.55)}.heg-deck .dl-all{font-family:var(--font-tech);font-size:12px;letter-spacing:.04em;border:none;cursor:pointer;
          background:var(--black);color:var(--ivory);padding:11px 18px;border-radius:999px;white-space:nowrap}.heg-deck .dl-all:hover{background:var(--green)}.heg-deck .rail{display:flex;gap:18px;overflow-x:auto;padding:6px 4px 4px;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none}.heg-deck .rail::-webkit-scrollbar{display:none}.heg-deck .thumb{flex:none;scroll-snap-align:start;position:relative}.heg-deck .thumb .scale{width:calc(1080px * var(--deck-scale,.3));height:calc(1350px * var(--deck-scale,.3));overflow:hidden;border-radius:14px;
                box-shadow:0 10px 30px rgba(16,31,24,.16);background:#fff}.heg-deck .slide{width:1080px;height:1350px;transform:scale(var(--deck-scale,.3));transform-origin:top left;
         position:relative;overflow:hidden}.heg-deck .thumb .dl{position:absolute;top:10px;right:10px;z-index:9;opacity:0;transition:.15s;
             font-family:var(--font-tech);font-size:11px;letter-spacing:.04em;border:none;cursor:pointer;
             background:rgba(16,31,24,.82);color:#fff;padding:7px 11px;border-radius:8px;backdrop-filter:blur(6px)}.heg-deck .thumb:hover .dl{opacity:1}
/* nav arrows (Mighty-style): below the rail, bottom-left, no scrollbar */
.heg-deck .car-nav{display:flex;gap:14px;margin-top:22px;padding:0 4px}
.heg-deck .car-arrow{width:46px;height:46px;flex:none;padding:0;border-radius:999px;border:1.5px solid rgba(16,31,24,.22);background:var(--ivory);color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color .15s,background .15s,color .15s,opacity .15s}
.heg-deck .car-arrow svg{width:20px;height:20px;display:block}
.heg-deck .car-arrow:hover{border-color:var(--green);color:var(--green);background:#fff}
.heg-deck .car-arrow:disabled{opacity:.3;cursor:default;pointer-events:none}
@media(max-width:640px){.heg-deck{--deck-scale:.26}.heg-deck .car-h .t h2{font-size:22px}.heg-deck .car-h .t span{font-size:13px}.heg-deck .car-nav{margin-top:18px}.heg-deck .car-arrow{width:44px;height:44px}}.heg-deck .grow{flex:1}.heg-deck .row{display:flex}.heg-deck .col{display:flex;flex-direction:column}/* --- pad --- */
.heg-deck .pad{position:absolute;inset:0;padding:158px 86px 96px;display:flex;flex-direction:column;z-index:3}/* --- slot-logo --- */
.heg-deck .slot-logo{position:absolute;top:54px;right:64px;z-index:8;font-family:var(--font-structure);
             font-weight:800;font-size:46px;letter-spacing:-.04em;line-height:1;text-shadow:0 2px 10px rgba(16,31,24,.18)}/* --- slot-counter --- */
.heg-deck .slot-counter{position:absolute;top:54px;left:64px;z-index:8;width:74px;height:74px;border-radius:999px;
                display:flex;align-items:center;justify-content:center;font-family:var(--font-tech);
                font-size:25px;letter-spacing:.02em}/* --- e --- */
.heg-deck .e{font-family:var(--font-tech);font-size:23px;letter-spacing:.14em;text-transform:uppercase;
     display:flex;align-items:center;gap:14px;margin:0}.heg-deck .e i{width:14px;height:14px;background:var(--ember);border-radius:3px;display:inline-block;flex:none}/* --- d1 --- */
.heg-deck .d1{font-weight:800;font-size:108px;line-height:1.02;letter-spacing:-.035em;margin:0}/* --- d2 --- */
.heg-deck .d2{font-weight:800;font-size:82px;line-height:1.05;letter-spacing:-.03em;margin:0}/* --- d3 --- */
.heg-deck .d3{font-weight:700;font-size:58px;line-height:1.08;letter-spacing:-.02em;margin:0}/* --- h3 --- */
.heg-deck .h3{font-weight:700;font-size:42px;line-height:1.14;letter-spacing:-.01em;margin:0}/* --- lead --- */
.heg-deck .lead{font-weight:500;font-size:39px;line-height:1.34;margin:0}/* --- body --- */
.heg-deck .body{font-weight:400;font-size:33px;line-height:1.42;margin:0}.heg-deck .body b{font-weight:700}/* --- mono --- */
.heg-deck .mono{font-family:var(--font-tech);font-size:25px;letter-spacing:.03em;line-height:1.45;margin:0}/* --- serif --- */
.heg-deck .serif{font-family:var(--font-human);font-style:italic;font-weight:400;font-size:50px;line-height:1.3;margin:0}/* --- num --- */
.heg-deck .num{font-weight:800;font-size:128px;line-height:.92;letter-spacing:-.04em;margin:0}/* --- idx --- */
.heg-deck .idx{font-family:var(--font-structure);font-weight:800;font-size:150px;line-height:.85;letter-spacing:-.04em;margin:0}/* --- tone-shadows --- */
/* depth: shadows for volume */
  .heg-deck .slide[data-tone="dark"] .d1, .heg-deck .slide[data-tone="dark"] .d2, .heg-deck .slide[data-tone="dark"] .d3, .heg-deck .slide[data-tone="dark"] .serif{text-shadow:0 3px 24px rgba(0,0,0,.4)}.heg-deck .slide[data-tone="dark"] .num, .heg-deck .slide[data-tone="dark"] .idx{text-shadow:0 4px 30px rgba(0,0,0,.44)}.heg-deck .slide[data-tone="dark"] .lead{text-shadow:0 2px 18px rgba(0,0,0,.34)}.heg-deck .slide[data-tone="light"] .d1, .heg-deck .slide[data-tone="light"] .d2, .heg-deck .slide[data-tone="light"] .d3{text-shadow:0 4px 16px rgba(16,31,24,.10)}.heg-deck .slide[data-tone="light"] .num, .heg-deck .slide[data-tone="light"] .idx{text-shadow:0 8px 22px rgba(16,31,24,.14)}/* text inside colour panels / pills / glass must stay clean (no dirty shadow) */
  .heg-deck .gcard *, .heg-deck .pill, .heg-deck .pill *, .heg-deck .glass, .heg-deck .glass *, .heg-deck .chip, .heg-deck .chip *{text-shadow:none}/* --- gcard --- */
/* grain colour panel — floats */
  .heg-deck .gcard{position:relative;overflow:hidden;border-radius:20px;
         box-shadow:0 26px 60px -14px rgba(16,31,24,.34), inset 0 0 0 1px rgba(255,255,255,.05)}.heg-deck .gcard::after{content:"";position:absolute;inset:0;background-image:var(--grain-url);
                background-size:230px 230px;opacity:.55;mix-blend-mode:overlay;pointer-events:none;z-index:1}.heg-deck .gcard>*{position:relative;z-index:2}.heg-deck .slide[data-tone="dark"] .gcard{box-shadow:0 30px 64px -16px rgba(0,0,0,.55), inset 0 0 0 1px rgba(255,255,255,.06)}/* --- pill --- */
/* CTA / tag pills float */
  .heg-deck .pill{box-shadow:0 16px 34px -10px rgba(16,31,24,.45);position:relative}/* --- frame --- */
/* corner brackets around a frame */
  .heg-deck .frame{position:relative}/* --- brk --- */
.heg-deck .brk{position:absolute;width:46px;height:46px;z-index:5;border:5px solid var(--green)}.heg-deck .brk.tl{top:-8px;left:-8px;border-right:0;border-bottom:0;border-top-left-radius:8px}.heg-deck .brk.tr{top:-8px;right:-8px;border-left:0;border-bottom:0;border-top-right-radius:8px}.heg-deck .brk.bl{bottom:-8px;left:-8px;border-right:0;border-top:0;border-bottom-left-radius:8px}.heg-deck .brk.br{bottom:-8px;right:-8px;border-left:0;border-top:0;border-bottom-right-radius:8px}/* --- glass --- */
/* glass plates (must float over a photo / grain) */
  .heg-deck .glass{position:absolute;z-index:6;border-radius:18px;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur)}.heg-deck .glass.white{background:rgba(255,255,255,.40);color:var(--ink);box-shadow:0 26px 56px -16px rgba(16,31,24,.42),var(--glass-rim)}.heg-deck .glass.greeng{background:rgba(6,70,61,.42);color:var(--ivory);box-shadow:0 26px 56px -16px rgba(0,0,0,.55),inset 0 1px 0 rgba(250,247,234,.2),0 0 40px rgba(6,70,61,.4)}/* --- chip --- */
.heg-deck .chip{position:absolute;z-index:6;padding:22px 26px;border-radius:16px;background:rgba(255,255,255,.42);color:var(--ink);
        backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
        box-shadow:0 30px 64px -18px rgba(16,31,24,.5),var(--glass-rim)}/* --- image-slot --- */
/* photos: film grain + warm filmic grade «под плёнку» */
  .heg-deck image-slot{display:block}.heg-deck image-slot::part(image){filter:contrast(.94) saturate(.9) brightness(1.05) sepia(.16) hue-rotate(-8deg)}/* --- filmwrap --- */
.heg-deck .filmwrap{position:relative;overflow:hidden;border-radius:20px;background:var(--ivory-300);
            box-shadow:0 34px 70px -20px rgba(16,31,24,.5)}.heg-deck .filmwrap::after{content:"";position:absolute;inset:0;background-image:var(--grain-url);
                   background-size:280px 280px;opacity:.85;mix-blend-mode:soft-light;pointer-events:none;z-index:3}/* --- scrim --- */
.heg-deck .scrim::before{content:"";position:absolute;inset:0;z-index:2;background:rgba(10,14,12,.42)}.heg-deck .scrim-soft::before{content:"";position:absolute;inset:0;z-index:2;background:rgba(10,14,12,.24)}/* --- pstrip --- */
.heg-deck .pstrip{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}/* --- capbar --- */
.heg-deck .capbar{display:flex;align-items:center;gap:26px;border-radius:18px;padding:30px 36px;box-shadow:0 26px 60px -16px rgba(0,0,0,.5);text-align:left}.heg-deck .capbar .ic{width:84px;height:84px;border-radius:16px;display:flex;align-items:center;justify-content:center;flex:none}.heg-deck .capbar p{font-weight:700;font-size:33px;line-height:1.2;margin:0}.heg-deck .capbar, .heg-deck .capbar *{text-shadow:none}/* --- on-ember --- */
/* ember-bg slide: ember eyebrow dot would vanish → green */
  .heg-deck .slide.on-ember .e i{background:var(--green)}/* --- lh / gfx (brand-graphic motifs) --- */
/* brand-graphic motifs */
  .heg-deck .lh, .heg-deck .gfx{display:block}.heg-deck .lh svg, .heg-deck .gfx svg{width:100%;height:100%;display:block}.heg-deck .lh svg{filter:drop-shadow(0 22px 36px rgba(16,31,24,.28))}.heg-deck .gfx.planet svg{filter:drop-shadow(0 24px 44px rgba(16,31,24,.26))}.heg-deck .gfx.radar svg{filter:drop-shadow(0 18px 32px rgba(16,31,24,.2))}.heg-deck .slide[data-tone="dark"] .lh svg, .heg-deck .slide[data-tone="dark"] .gfx svg{filter:drop-shadow(0 28px 54px rgba(0,0,0,.5))}/* --- darkmatte --- */
.heg-deck .slide.darkmatte::before{content:"";position:absolute;inset:0;background:rgba(255,255,255,0.08);pointer-events:none;z-index:0}