:root {
      --sgb-ink: #0b1016;
      --sgb-navy: #101c2c;
      --sgb-navy-2: #162a42;
      --sgb-blueblack: #071018;
      --sgb-violet: #2d2445;
      --sgb-parchment: #f5ebdd;
      --sgb-bone: #fff9ee;
      --sgb-sand: #d8c3a3;
      --sgb-tan: #b89165;
      --sgb-olive: #263b24;
      --sgb-green: #59633a;
      --sgb-red: #a92e2a;
      --sgb-red-dark: #7c241f;
      --sgb-copper: #b86635;
      --sgb-gold: #c9a14a;
      --sgb-pearl: #efe8d3;
      --sgb-silver: #bbc4c6;
      --sgb-muted: #68706c;
      --sgb-line: rgba(245,235,221,.18);
      --sgb-dark-line: rgba(11,16,22,.14);
      --sgb-shadow: 0 26px 80px rgba(7, 16, 24, .22);
      --sgb-radius-xl: 34px;
      --sgb-radius-lg: 24px;
      --sgb-radius-md: 16px;
      --sgb-max: 1180px;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }

    /*
     * CEDAR PLANK SYSTEM v2
     * Horizontal planks — all same warm cedar base.
     * Grain lines (light highlights + dark shadows) create the variation within each board.
     * Two offset tiles (A=500px tall, B=460px tall) stack to break repetition.
     * Cream/white gap lines between boards.
     * Three overlay classes: .cedar-light .cedar-medium .cedar-dark
     */
    :root {
      /* Tile A — 5 boards, 3px gaps, wide cream highlight bands within each board */
      --cedar-a: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1400' height='483'%3E%3Crect width='1400' height='483' fill='%23c07848'/%3E%3C!-- BOARD 1 y0-90 --%3E%3Crect y='0' width='1400' height='90' fill='%23be7040'/%3E%3Cpath d='M0 12 Q300 8 600 14 Q900 20 1200 12 Q1300 9 1400 13' stroke='%23f8e8c8' stroke-width='8' fill='none' opacity='.28'/%3E%3Cpath d='M0 32 Q250 27 500 34 Q800 42 1100 31 Q1250 27 1400 33' stroke='%23fffaf0' stroke-width='5' fill='none' opacity='.38'/%3E%3Cpath d='M0 52 Q350 47 700 54 Q1050 61 1400 51' stroke='%23f0d898' stroke-width='3' fill='none' opacity='.3'/%3E%3Cpath d='M0 68 Q400 63 800 70 Q1100 76 1400 67' stroke='%23a05828' stroke-width='2' fill='none' opacity='.45'/%3E%3Cpath d='M0 80 Q500 75 1000 82 Q1200 86 1400 79' stroke='%23f8deb0' stroke-width='4' fill='none' opacity='.22'/%3E%3C!-- GAP 1 --%3E%3Crect y='90' width='1400' height='3' fill='%23e8d8b8'/%3E%3C!-- BOARD 2 y93-183 --%3E%3Crect y='93' width='1400' height='90' fill='%23c47848'/%3E%3Cpath d='M0 105 Q200 100 400 107 Q700 115 1000 104 Q1200 99 1400 105' stroke='%23fffdf5' stroke-width='10' fill='none' opacity='.32'/%3E%3Cpath d='M0 125 Q350 119 700 127 Q1050 135 1400 124' stroke='%23f8e8c0' stroke-width='6' fill='none' opacity='.35'/%3E%3Cpath d='M0 143 Q450 137 900 145 Q1150 150 1400 142' stroke='%23955020' stroke-width='2' fill='none' opacity='.48'/%3E%3Cpath d='M0 160 Q300 154 600 162 Q900 170 1200 159 Q1300 155 1400 161' stroke='%23fce8c8' stroke-width='7' fill='none' opacity='.25'/%3E%3Cpath d='M0 176 Q500 170 1000 178 Q1200 182 1400 175' stroke='%23a05828' stroke-width='2' fill='none' opacity='.4'/%3E%3C!-- KNOT A1 --%3E%3Cellipse cx='420' cy='143' rx='26' ry='10' fill='%23703018' opacity='.62'/%3E%3Cellipse cx='420' cy='143' rx='13' ry='5' fill='%23501808' opacity='.55'/%3E%3Cpath d='M394 136 Q420 129 446 136 Q456 143 446 151 Q420 158 394 151 Q384 143 394 136' fill='none' stroke='%23602010' stroke-width='1.2' opacity='.42'/%3E%3C!-- GAP 2 --%3E%3Crect y='183' width='1400' height='3' fill='%23e0caa8'/%3E%3C!-- BOARD 3 y186-276 --%3E%3Crect y='186' width='1400' height='90' fill='%23bb6c3c'/%3E%3Cpath d='M0 198 Q250 192 500 200 Q800 209 1100 197 Q1250 192 1400 199' stroke='%23fce8c0' stroke-width='9' fill='none' opacity='.30'/%3E%3Cpath d='M0 218 Q400 212 800 220 Q1100 228 1400 217' stroke='%23fffaf2' stroke-width='6' fill='none' opacity='.36'/%3E%3Cpath d='M0 238 Q300 232 600 240 Q900 248 1200 237 Q1300 232 1400 239' stroke='%238c4818' stroke-width='2' fill='none' opacity='.5'/%3E%3Cpath d='M0 255 Q450 249 900 257 Q1150 262 1400 254' stroke='%23f8dca8' stroke-width='5' fill='none' opacity='.28'/%3E%3Cpath d='M0 270 Q350 264 700 272 Q1050 280 1400 269' stroke='%23a05020' stroke-width='2' fill='none' opacity='.42'/%3E%3C!-- KNOT A2 --%3E%3Cellipse cx='1050' cy='238' rx='22' ry='9' fill='%23703018' opacity='.6'/%3E%3Cellipse cx='1050' cy='238' rx='11' ry='4' fill='%23501808' opacity='.52'/%3E%3C!-- GAP 3 --%3E%3Crect y='276' width='1400' height='3' fill='%23e8d8b8'/%3E%3C!-- BOARD 4 y279-369 --%3E%3Crect y='279' width='1400' height='90' fill='%23c87848'/%3E%3Cpath d='M0 291 Q180 285 360 293 Q660 302 960 290 Q1160 284 1400 291' stroke='%23fff8ee' stroke-width='11' fill='none' opacity='.28'/%3E%3Cpath d='M0 313 Q380 307 760 315 Q1080 323 1400 312' stroke='%23f8e4b8' stroke-width='5' fill='none' opacity='.34'/%3E%3Cpath d='M0 332 Q300 326 600 334 Q900 342 1200 331 Q1300 326 1400 333' stroke='%23905020' stroke-width='2' fill='none' opacity='.48'/%3E%3Cpath d='M0 350 Q430 344 860 352 Q1130 358 1400 349' stroke='%23fce8c0' stroke-width='7' fill='none' opacity='.24'/%3E%3Cpath d='M0 364 Q500 358 1000 366 Q1200 370 1400 363' stroke='%238a4818' stroke-width='2' fill='none' opacity='.4'/%3E%3C!-- KNOT A3 --%3E%3Cellipse cx='240' cy='332' rx='20' ry='8' fill='%236e2e16' opacity='.58'/%3E%3Cellipse cx='240' cy='332' rx='10' ry='4' fill='%234e1608' opacity='.5'/%3E%3C!-- GAP 4 --%3E%3Crect y='369' width='1400' height='3' fill='%23e0caa8'/%3E%3C!-- BOARD 5 y372-483 --%3E%3Crect y='372' width='1400' height='111' fill='%23be7040'/%3E%3Cpath d='M0 385 Q280 379 560 387 Q860 396 1160 384 Q1280 379 1400 386' stroke='%23fce8c0' stroke-width='9' fill='none' opacity='.3'/%3E%3Cpath d='M0 407 Q350 401 700 409 Q1050 417 1400 406' stroke='%23fff9f0' stroke-width='6' fill='none' opacity='.36'/%3E%3Cpath d='M0 427 Q200 421 400 429 Q700 438 1000 426 Q1200 420 1400 428' stroke='%238c4818' stroke-width='2' fill='none' opacity='.5'/%3E%3Cpath d='M0 446 Q450 440 900 448 Q1150 453 1400 445' stroke='%23f8dca8' stroke-width='5' fill='none' opacity='.27'/%3E%3Cpath d='M0 462 Q300 456 600 464 Q900 472 1200 461 Q1300 456 1400 463' stroke='%23a05020' stroke-width='2' fill='none' opacity='.42'/%3E%3Cpath d='M0 476 Q500 470 1000 478 Q1200 482 1400 475' stroke='%23fce4b0' stroke-width='4' fill='none' opacity='.2'/%3E%3C/svg%3E");

      /* Tile B — 5 boards, different widths and knot positions, 3px gaps */
      --cedar-b: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1400' height='443'%3E%3Crect width='1400' height='443' fill='%23c27448'/%3E%3C!-- BOARD 1 y0-84 --%3E%3Crect y='0' width='1400' height='84' fill='%23c07242'/%3E%3Cpath d='M0 11 Q240 5 480 13 Q780 22 1080 10 Q1240 5 1400 11' stroke='%23fff8ec' stroke-width='10' fill='none' opacity='.3'/%3E%3Cpath d='M0 31 Q320 25 640 33 Q980 42 1300 30 Q1350 27 1400 31' stroke='%23f8e4b8' stroke-width='5' fill='none' opacity='.34'/%3E%3Cpath d='M0 50 Q260 44 520 52 Q820 60 1120 48 Q1260 43 1400 51' stroke='%23904e20' stroke-width='2' fill='none' opacity='.48'/%3E%3Cpath d='M0 66 Q400 60 800 68 Q1100 74 1400 65' stroke='%23fce8c0' stroke-width='7' fill='none' opacity='.24'/%3E%3Cpath d='M0 78 Q500 72 1000 80 Q1200 84 1400 77' stroke='%238a4818' stroke-width='2' fill='none' opacity='.4'/%3E%3C!-- KNOT B1 --%3E%3Cellipse cx='780' cy='50' rx='28' ry='11' fill='%23703018' opacity='.62'/%3E%3Cellipse cx='780' cy='50' rx='14' ry='5' fill='%23501808' opacity='.54'/%3E%3Cpath d='M752 43 Q780 36 808 43 Q818 50 808 58 Q780 65 752 58 Q742 50 752 43' fill='none' stroke='%23602010' stroke-width='1.2' opacity='.4'/%3E%3C!-- GAP 1 --%3E%3Crect y='84' width='1400' height='3' fill='%23e8d8b8'/%3E%3C!-- BOARD 2 y87-181 --%3E%3Crect y='87' width='1400' height='94' fill='%23c87a4a'/%3E%3Cpath d='M0 100 Q200 94 400 102 Q700 111 1000 99 Q1200 93 1400 100' stroke='%23fffbf2' stroke-width='12' fill='none' opacity='.29'/%3E%3Cpath d='M0 122 Q360 116 720 124 Q1060 132 1400 121' stroke='%23f8e4b8' stroke-width='6' fill='none' opacity='.36'/%3E%3Cpath d='M0 142 Q290 136 580 144 Q880 152 1180 140 Q1290 135 1400 143' stroke='%238c4e1e' stroke-width='2' fill='none' opacity='.5'/%3E%3Cpath d='M0 160 Q420 154 840 162 Q1120 168 1400 159' stroke='%23fce8c8' stroke-width='7' fill='none' opacity='.26'/%3E%3Cpath d='M0 174 Q270 168 540 176 Q840 184 1140 172 Q1270 167 1400 175' stroke='%23904818' stroke-width='2' fill='none' opacity='.42'/%3E%3C!-- KNOT B2 --%3E%3Cellipse cx='160' cy='142' rx='24' ry='10' fill='%236e2e16' opacity='.6'/%3E%3Cellipse cx='160' cy='142' rx='12' ry='5' fill='%234e1808' opacity='.52'/%3E%3Cpath d='M136 135 Q160 128 184 135 Q193 142 184 150 Q160 157 136 150 Q127 142 136 135' fill='none' stroke='%23602010' stroke-width='1' opacity='.36'/%3E%3C!-- GAP 2 --%3E%3Crect y='181' width='1400' height='3' fill='%23e0caa8'/%3E%3C!-- BOARD 3 y184-272 --%3E%3Crect y='184' width='1400' height='88' fill='%23bd6e3e'/%3E%3Cpath d='M0 196 Q220 190 440 198 Q740 207 1040 195 Q1220 189 1400 197' stroke='%23ffeedd' stroke-width='9' fill='none' opacity='.32'/%3E%3Cpath d='M0 216 Q340 210 680 218 Q1020 226 1360 215 Q1380 213 1400 216' stroke='%23f8e0b0' stroke-width='5' fill='none' opacity='.35'/%3E%3Cpath d='M0 235 Q280 229 560 237 Q860 245 1160 234 Q1280 229 1400 236' stroke='%23904e1e' stroke-width='2' fill='none' opacity='.5'/%3E%3Cpath d='M0 252 Q440 246 880 254 Q1140 260 1400 251' stroke='%23fce8c0' stroke-width='6' fill='none' opacity='.26'/%3E%3Cpath d='M0 265 Q310 259 620 267 Q930 275 1240 264 Q1320 259 1400 266' stroke='%238a4818' stroke-width='2' fill='none' opacity='.42'/%3E%3C!-- KNOT B3 --%3E%3Cellipse cx='1260' cy='235' rx='20' ry='8' fill='%23703018' opacity='.58'/%3E%3Cellipse cx='1260' cy='235' rx='10' ry='4' fill='%23501808' opacity='.5'/%3E%3C!-- KNOT B4 --%3E%3Cellipse cx='600' cy='252' rx='16' ry='7' fill='%236a2c14' opacity='.52'/%3E%3Cellipse cx='600' cy='252' rx='8' ry='3' fill='%234a1606' opacity='.44'/%3E%3C!-- GAP 3 --%3E%3Crect y='272' width='1400' height='3' fill='%23e8d8b8'/%3E%3C!-- BOARD 4 y275-363 --%3E%3Crect y='275' width='1400' height='88' fill='%23c67644'/%3E%3Cpath d='M0 288 Q190 282 380 290 Q680 299 980 287 Q1190 281 1400 288' stroke='%23fff6e8' stroke-width='10' fill='none' opacity='.3'/%3E%3Cpath d='M0 309 Q370 303 740 311 Q1080 319 1400 308' stroke='%23f8e2b0' stroke-width='5' fill='none' opacity='.34'/%3E%3Cpath d='M0 328 Q300 322 600 330 Q900 338 1200 327 Q1300 322 1400 329' stroke='%238e4e1e' stroke-width='2' fill='none' opacity='.5'/%3E%3Cpath d='M0 346 Q430 340 860 348 Q1130 354 1400 345' stroke='%23fce8c0' stroke-width='7' fill='none' opacity='.25'/%3E%3Cpath d='M0 358 Q260 352 520 360 Q820 368 1120 357 Q1260 352 1400 359' stroke='%23904818' stroke-width='2' fill='none' opacity='.42'/%3E%3C!-- GAP 4 --%3E%3Crect y='363' width='1400' height='3' fill='%23e0caa8'/%3E%3C!-- BOARD 5 y366-443 --%3E%3Crect y='366' width='1400' height='77' fill='%23c07040'/%3E%3Cpath d='M0 378 Q230 372 460 380 Q760 389 1060 377 Q1230 371 1400 379' stroke='%23ffeedd' stroke-width='9' fill='none' opacity='.3'/%3E%3Cpath d='M0 397 Q340 391 680 399 Q1020 407 1360 396 Q1380 394 1400 397' stroke='%23f8e0b0' stroke-width='5' fill='none' opacity='.34'/%3E%3Cpath d='M0 415 Q270 409 540 417 Q840 425 1140 414 Q1270 409 1400 416' stroke='%238c4c18' stroke-width='2' fill='none' opacity='.48'/%3E%3Cpath d='M0 430 Q440 424 880 432 Q1140 437 1400 429' stroke='%23fce4b0' stroke-width='4' fill='none' opacity='.24'/%3E%3Cpath d='M0 440 Q500 434 1000 442 Q1200 446 1400 439' stroke='%23844818' stroke-width='2' fill='none' opacity='.38'/%3E%3C/svg%3E");
    }

    /* ── Profile Catalog Grid ── */
    .sgb-catalog-section {
      background: var(--sgb-parchment);
    }
    .sgb-catalog-section .sgb-shell {
      width: min(1320px, calc(100% - 40px));
    }
    .sgb-catalog-head { margin-bottom: 2.5rem; }
    .sgb-catalog-sub {
      margin: .5rem 0 0;
      color: rgba(11,16,22,.55);
      font-size: 1rem;
      font-weight: 600;
      letter-spacing: .02em;
    }
    .sgb-catalog-grid {
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      gap: 1rem;
    }
    @media (max-width: 1100px) { .sgb-catalog-grid { grid-template-columns: repeat(4, 1fr); } }
    @media (max-width: 700px)  { .sgb-catalog-grid { grid-template-columns: repeat(2, 1fr); } }

    .sgb-catalog-card {
      background: rgba(255,255,255,.72);
      border: 1px solid rgba(11,16,22,.09);
      border-radius: 18px;
      padding: .85rem .85rem 1rem;
      display: flex;
      flex-direction: column;
      gap: .35rem;
      transition: transform 220ms cubic-bezier(.34,1.28,.64,1), box-shadow 220ms ease;
      cursor: default;
    }
    .sgb-catalog-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 16px 36px rgba(11,16,22,.13);
    }
    .sgb-catalog-img-wrap {
      width: 100%;
      aspect-ratio: 1 / 1;
      border-radius: 12px;
      background: rgba(11,16,22,.04);
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: .4rem;
    }
    .sgb-catalog-img-wrap img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      transition: transform 280ms cubic-bezier(.34,1.28,.64,1);
      padding: .5rem;
    }
    .sgb-catalog-card:hover .sgb-catalog-img-wrap img {
      transform: scale(1.1);
    }
    .sgb-catalog-card h3 {
      margin: 0;
      color: var(--sgb-navy);
      font-size: .88rem;
      font-weight: 900;
      letter-spacing: -.02em;
      line-height: 1.2;
    }
    .sgb-catalog-title {
      margin: 0;
      color: var(--sgb-gold);
      font-size: .72rem;
      font-weight: 800;
      line-height: 1.3;
    }
    .sgb-catalog-desc {
      margin: .2rem 0 0;
      color: rgba(11,16,22,.58);
      font-size: .72rem;
      line-height: 1.45;
    }

    /* ── Profile Catalog Filters ── */
    .sgb-profile-filters {
      display: flex;
      flex-wrap: wrap;
      gap: .65rem;
      margin-top: 1.35rem;
    }

    .sgb-profile-filter {
      min-height: 42px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: .55rem;
      padding: .62rem .9rem;
      border: 1px solid rgba(11,16,22,.15);
      border-radius: 999px;
      color: var(--sgb-navy);
      background: rgba(255,249,238,.68);
      box-shadow: 0 5px 14px rgba(11,16,22,.06);
      font: inherit;
      font-size: .84rem;
      font-weight: 850;
      line-height: 1;
      cursor: pointer;
      transition:
        transform 160ms ease,
        color 160ms ease,
        background 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease;
    }

    .sgb-profile-filter:hover {
      transform: translateY(-2px);
      border-color: rgba(169,46,42,.34);
      box-shadow: 0 9px 20px rgba(11,16,22,.10);
    }

    .sgb-profile-filter:focus-visible {
      outline: 3px solid rgba(201,161,74,.42);
      outline-offset: 3px;
    }

    .sgb-profile-filter.is-active {
      color: #fff;
      border-color: transparent;
      background: linear-gradient(135deg, var(--sgb-red), var(--sgb-copper));
      box-shadow: 0 10px 24px rgba(124,36,31,.24);
    }

    .sgb-profile-filter-count {
      min-width: 1.55rem;
      height: 1.55rem;
      display: inline-grid;
      place-items: center;
      padding: 0 .35rem;
      border-radius: 999px;
      color: rgba(11,16,22,.68);
      background: rgba(11,16,22,.08);
      font-size: .72rem;
      font-weight: 900;
    }

    .sgb-profile-filter.is-active .sgb-profile-filter-count {
      color: #fff;
      background: rgba(255,255,255,.18);
    }

    .sgb-catalog-card[hidden] { display: none; }

    .sgb-catalog-card.is-filtered-in {
      animation: sgbCatalogCardIn 260ms cubic-bezier(.2,.75,.3,1) both;
    }

    @keyframes sgbCatalogCardIn {
      from { opacity: 0; transform: translateY(10px) scale(.985); }
      to   { opacity: 1; transform: translateY(0) scale(1); }
    }

    @media (max-width: 700px) {
      .sgb-profile-filters {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .55rem;
      }

      .sgb-profile-filter {
        width: 100%;
        padding-inline: .72rem;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .sgb-catalog-card.is-filtered-in { animation: none; }
    }
    .cedar-light,
    .cedar-medium,
    .cedar-dark {
      position: relative;
      isolation: isolate;
    }
    /* Wood tiles sit at z-index -2, overlay at z-index -1, content at z-index 0+ */
    .cedar-light::before,
    .cedar-medium::before,
    .cedar-dark::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -2;
      background:
        var(--cedar-a) top left / 1400px 500px,
        var(--cedar-b) 0px 500px / 1400px 460px;
      background-repeat: repeat-x, repeat-x;
      pointer-events: none;
    }
    .cedar-light::after,
    .cedar-medium::after,
    .cedar-dark::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      pointer-events: none;
    }
    /* Light: mostly pale — wood shows as warm tint only */
    .cedar-light::after { background: rgba(245,235,215,.82); }
    /* Medium: wood clearly visible, warm and natural */
    .cedar-medium::after { background: rgba(230,200,160,.30); }
    /* Dark: minimal overlay — full rich wood */
    .cedar-dark::after { background: rgba(60,20,5,.18); }

    body {
      margin: 0;
      font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      color: var(--sgb-ink);
      background:
        radial-gradient(circle at 85% 7%, rgba(169,46,42,.14), transparent 24rem),
        radial-gradient(circle at 14% 12%, rgba(22,42,66,.18), transparent 28rem),
        linear-gradient(180deg, #f0e4d0, #f8efe0 42%, #ede0ca 100%);
      line-height: 1.55;
    }

    a { color: inherit; text-decoration: none; }
    .sgb-page { overflow: hidden; }
    .sgb-shell { width: min(var(--sgb-max), calc(100% - 40px)); margin: 0 auto; }

    .sgb-nav {
      position: sticky;
      top: 0;
      z-index: 40;
      background: rgba(7, 16, 24, .86);
      border-bottom: 1px solid rgba(239,232,211,.14);
      backdrop-filter: blur(18px);
    }

    .sgb-nav-inner {
      min-height: 74px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
    }

    .sgb-logo {
      display: flex;
      align-items: center;
      gap: .75rem;
      color: var(--sgb-bone);
      font-weight: 950;
      letter-spacing: -.025em;
    }

    .sgb-logo-mark {
      width: 43px;
      height: 43px;
      display: grid;
      place-items: center;
      border-radius: 15px;
      background:
        linear-gradient(135deg, rgba(169,46,42,.92), rgba(184,102,53,.9)),
        var(--sgb-red);
      color: var(--sgb-bone);
      font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      box-shadow: 0 14px 30px rgba(0,0,0,.32);
    }

    .sgb-logo-img {
      display: block;
      width: 172px;
      max-height: 62px;
      object-fit: contain;
    }

    .sgb-hero-logo {
      display: block;
      width: min(360px, 72vw);
      height: auto;
      margin: 0 0 1.35rem;
      filter: drop-shadow(0 18px 34px rgba(0,0,0,.34));
    }

    .sgb-nav-links {
      display: flex;
      align-items: center;
      gap: 1.15rem;
      color: rgba(255,249,238,.72);
      font-size: .94rem;
      font-weight: 750;
    }

    .sgb-nav-links a:hover { color: var(--sgb-bone); }
    .sgb-nav-cta { padding: .62rem .95rem; border-radius: 999px; color: #fff !important; background: var(--sgb-red); }

    .sgb-eyebrow,
    .sgb-section-label {
      display: inline-flex;
      align-items: center;
      gap: .5rem;
      margin: 0 0 .8rem;
      color: var(--sgb-copper);
      font-size: .76rem;
      font-weight: 900;
      letter-spacing: .14em;
      text-transform: uppercase;
    }

    .sgb-eyebrow::before,
    .sgb-section-label::before {
      content: "";
      width: .5rem;
      height: .5rem;
      border-radius: 999px;
      background: var(--sgb-red);
      box-shadow: 0 0 0 5px rgba(169,46,42,.12);
    }

    .sgb-h2 {
      margin: 0;
      color: var(--sgb-navy);
      font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      font-size: clamp(2rem, 4vw, 4.1rem);
      line-height: .98;
      letter-spacing: -.04em;
    }

    .sgb-lede {
      margin: 1rem 0 0;
      max-width: 760px;
      color: #5d625e;
      font-size: clamp(1rem, 1.45vw, 1.18rem);
    }

    .sgb-btn-row { display: flex; flex-wrap: wrap; gap: .85rem; margin-top: 1.75rem; }
    .sgb-btn {
      min-height: 48px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: .82rem 1.22rem;
      border-radius: 999px;
      font-weight: 875;
      border: 1px solid transparent;
      transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease;
    }
    .sgb-btn:hover { transform: translateY(-2px); }
    .sgb-btn-primary { color: #fff; background: linear-gradient(135deg, var(--sgb-red), var(--sgb-copper)); box-shadow: 0 18px 40px rgba(124,36,31,.28); }
    .sgb-btn-secondary { color: var(--sgb-bone); background: rgba(255,249,238,.1); border-color: rgba(255,249,238,.22); }
    .sgb-btn-light { color: var(--sgb-navy); background: rgba(255,249,238,.78); border-color: rgba(11,16,22,.12); }

    .sgb-hero {
      position: relative;
      padding: clamp(4rem, 7vw, 7.2rem) 0 4.8rem;
      background:
        linear-gradient(105deg,
          rgba(5,10,18,.82) 0%,
          rgba(7,16,28,.68) 38%,
          rgba(5,12,22,.38) 62%,
          rgba(4,10,18,.52) 100%),
        url('/assets/images/630941155be64198a45f.webp') center center / cover no-repeat;
      color: var(--sgb-bone);
      isolation: isolate;
    }

    .sgb-hero::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(5,10,18,.55) 0%, transparent 40%);
      z-index: 0;
      pointer-events: none;
    }

    .sgb-hero-grid { position: relative; z-index: 1; }

    .sgb-hero-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.03fr) minmax(320px, .97fr);
      align-items: center;
      gap: clamp(2rem, 5vw, 4.5rem);
    }

    .sgb-hero .sgb-eyebrow {
      color: var(--sgb-gold);
      font-size: 1rem;
      letter-spacing: .12em;
    }
    .sgb-hero h1 {
      margin: 1rem 0 0;
      max-width: 720px;
      color: var(--sgb-bone);
      font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      font-size: clamp(2.6rem, 5.2vw, 5.2rem);
      line-height: 1.02;
      letter-spacing: -.045em;
    }
    .sgb-h1-that {
      color: var(--sgb-gold);
      font-style: italic;
      font-weight: 950;
    }

    .sgb-float-note {
      position: absolute;
      left: 1.25rem;
      right: 1.25rem;
      bottom: 1.25rem;
      padding: 1.12rem 1.18rem;
      border-radius: 24px;
      color: var(--sgb-bone);
      background: rgba(7,16,24,.72);
      border: 1px solid rgba(255,249,238,.14);
      backdrop-filter: blur(14px);
      z-index: 2;
    }

    .sgb-hero-sub { margin: 1.35rem 0 0; max-width: 660px; color: rgba(255,249,238,.78); font-size: clamp(1.08rem, 1.7vw, 1.32rem); }

    .sgb-proof-strip {
      display: flex;
      align-items: flex-start;
      flex-wrap: wrap;
      gap: .6rem 0;
      margin-top: 2rem;
      max-width: 680px;
    }
    .sgb-proof-item {
      display: flex;
      align-items: center;
      gap: .55rem;
      color: rgba(255,249,238,.85);
      font-size: 1rem;
      font-weight: 750;
      padding: 0 1.1rem;
      line-height: 1.3;
    }
    .sgb-proof-item:first-child { padding-left: 0; }
    .sgb-proof-item + .sgb-proof-item {
      border-left: 1px solid rgba(255,249,238,.2);
    }
    .sgb-proof-icon {
      width: 20px;
      height: 20px;
      opacity: .75;
      flex-shrink: 0;
    }

    .sgb-hero-art {
      min-height: 610px;
      position: relative;
      border-radius: var(--sgb-radius-xl);
      overflow: hidden;
      background:
        radial-gradient(circle at 50% 30%, rgba(22,42,66,.55), transparent 70%),
        linear-gradient(145deg, rgba(7,16,24,.72), rgba(11,20,36,.60));
      border: 1px solid rgba(255,249,238,.12);
      box-shadow: 0 34px 90px rgba(0,0,0,.44);
      display: flex;
      align-items: flex-end;
      justify-content: center;
    }

    .sgb-hero-art::before {
      content: "";
      position: absolute;
      inset: 0;
      background: radial-gradient(circle at 50% 100%, rgba(5,10,18,.7) 0%, transparent 60%);
      pointer-events: none;
      z-index: 1;
    }

    .sgb-hero-fish {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
      z-index: 0;
    }


    .sgb-float-note strong { display:block; font-size: .98rem; }
    .sgb-float-note span { display:block; margin-top:.25rem; color:rgba(255,249,238,.7); font-size:.91rem; }

    .sgb-section { padding: clamp(3.75rem, 7vw, 6.5rem) 0; }
    /* Plain light sections get a subtle cedar-warm body */
    .sgb-section:not(.sgb-dark-section):not(.sgb-color-section):not(.sgb-built-section) {
      position: relative;
      isolation: isolate;
    }
    .sgb-section:not(.sgb-dark-section):not(.sgb-color-section):not(.sgb-built-section)::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      background: var(--cedar-grain-light);
      opacity: .10;
      pointer-events: none;
    }
    .sgb-section:not(.sgb-dark-section):not(.sgb-color-section):not(.sgb-built-section) > * {
      position: relative;
      z-index: 1;
    }
    .sgb-dark-section {
      position: relative;
      background: var(--sgb-parchment);
      color: var(--sgb-ink);
    }
    .sgb-dark-section .sgb-h2 { color: var(--sgb-ink); }
    .sgb-dark-section .sgb-lede { color: rgba(11,16,22,.72); }
    .sgb-dark-section .sgb-section-label { color: var(--sgb-copper); }

    .sgb-card-grid { display:grid; grid-template-columns: repeat(4,1fr); gap:1rem; margin-top:2rem; }
    .sgb-card {
      min-height: 222px;
      padding: 1.25rem;
      border-radius: var(--sgb-radius-lg);
      background: rgba(255,249,238,.78);
      border: 1px solid var(--sgb-dark-line);
      box-shadow: 0 18px 46px rgba(11,16,22,.08);
    }
    .sgb-dark-section .sgb-card { background: rgba(255,255,255,.82); border-color: rgba(11,16,22,.10); }
    .sgb-card-number { display:grid; place-items:center; width:38px; height:38px; border-radius:14px; background: rgba(169,46,42,.14); color: var(--sgb-red); font-weight:950; }
    .sgb-dark-section .sgb-card-number { background: rgba(169,46,42,.12); color: var(--sgb-red); }
    .sgb-card h3 { margin:1rem 0 .45rem; color: var(--sgb-navy); font-size:1.12rem; line-height:1.12; letter-spacing:-.025em; }
    .sgb-dark-section .sgb-card h3 { color: var(--sgb-navy); }
    .sgb-card p { margin:0; color:#606660; font-size:.96rem; }
    .sgb-dark-section .sgb-card p { color: #606660; }

    .sgb-split { display:grid; grid-template-columns:minmax(0,.9fr) minmax(320px,1.1fr); gap: clamp(2rem,5vw,4rem); align-items:center; }
    .sgb-text-stack p { color:#5d625e; font-size:1.06rem; }
    .sgb-text-stack p:first-of-type { margin-top:0; }
    .sgb-pullquote { margin:1.5rem 0 0; padding:1.2rem 1.25rem; border-left:5px solid var(--sgb-red); border-radius:0 18px 18px 0; background:rgba(169,46,42,.085); color:var(--sgb-navy); font-size:clamp(1.2rem,2.3vw,1.75rem); line-height:1.14; letter-spacing:-.025em; font-weight: 750; }

    .sgb-material-panel {
      min-height: 460px;
      position: relative;
      overflow: hidden;
      border-radius: var(--sgb-radius-xl);
      background:
        radial-gradient(circle at 74% 18%, rgba(169,46,42,.28), transparent 12rem),
        radial-gradient(circle at 22% 70%, rgba(110,166,200,.18), transparent 14rem),
        linear-gradient(165deg, #5c2e14 0%, #3d1e0e 40%, #1a0d06 100%);
      box-shadow: var(--sgb-shadow);
    }
    .sgb-material-panel::before {
      content:"";
      position:absolute;
      inset:0;
      background: var(--cedar-grain-light);
      opacity: .32;
      mix-blend-mode: overlay;
    }
    .sgb-material-panel::after {
      content:"";
      position:absolute;
      inset:0;
      background: repeating-linear-gradient(174deg, rgba(255,255,255,.055) 0 1px, transparent 1px 18px);
      opacity:.7;
    }
    .sgb-material-note { position:absolute; left:1.25rem; right:1.25rem; bottom:1.25rem; padding:1.15rem; border-radius:24px; color:var(--sgb-bone); background:rgba(7,16,24,.72); border:1px solid rgba(255,249,238,.13); backdrop-filter: blur(14px); }
    .sgb-material-note strong { display:block; }
    .sgb-material-note span { display:block; margin-top:.25rem; color:rgba(255,249,238,.7); }
    .sgb-motion-ribbon { position:absolute; left:50%; top:44%; width:74%; height:42px; border-radius:999px; background:linear-gradient(90deg,#111,#162a42,#6ea6c8,#efe8d3,#a92e2a); transform:translate(-50%,-50%) rotate(-10deg); box-shadow:inset 22px 0 28px rgba(255,255,255,.15), 0 28px 44px rgba(0,0,0,.34); }
    .sgb-motion-ribbon::before, .sgb-motion-ribbon::after { content:""; position:absolute; right:-60px; top:50%; width:100px; height:18px; border-radius:999px; background:inherit; transform-origin:0 50%; }
    .sgb-motion-ribbon::before { transform:translateY(-50%) rotate(24deg); }
    .sgb-motion-ribbon::after { transform:translateY(-50%) rotate(-24deg); }

    .sgb-color-section {
      position: relative;
      background: var(--sgb-parchment);
    }
    .sgb-color-section .sgb-shell {
      width: min(1320px, calc(100% - 40px));
    }
    .sgb-color-head { display:flex; align-items:end; justify-content:space-between; gap:2rem; }
    .sgb-color-section .sgb-h2 { color: var(--sgb-navy); }
    .sgb-color-section .sgb-lede { color: rgba(11,16,22,.7); }

    /* Cedar panel — the full rounded box with wood background */
    .sgb-cedar-panel {
      position: relative;
      overflow: hidden;
      border-radius: var(--sgb-radius-xl);
      border: 1px solid rgba(140,85,35,.20);
      box-shadow: 0 6px 32px rgba(100,50,15,.14), inset 0 1px 0 rgba(255,235,190,.35);
      padding: clamp(1.5rem, 3vw, 2.5rem);
      isolation: isolate;
    }
    .sgb-cedar-panel::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -2;
      background:
        var(--cedar-a) top left / 1400px 483px,
        var(--cedar-b) 0px 483px / 1400px 443px;
      background-repeat: repeat, repeat;
      pointer-events: none;
    }
    .sgb-cedar-panel::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      background: rgba(245,232,210,.72);
      pointer-events: none;
    }

    /* Carousel wrap — dark gray inner box with depth */
    .sgb-carousel-wrap {
      margin-top: 2rem;
      border-radius: 28px;
      overflow: hidden;
      background: linear-gradient(145deg, #5f6874, #3d4652 62%, #242b34);
      border: 1px solid rgba(11,16,22,.28);
      box-shadow:
        0 2px 0 rgba(255,255,255,.08) inset,
        0 -2px 0 rgba(0,0,0,.25) inset,
        0 24px 48px rgba(0,0,0,.32),
        0 6px 16px rgba(0,0,0,.22),
        0 1px 3px rgba(0,0,0,.18);
    }

    .sgb-color-carousel {
      position: relative;
      margin-top: 0;
      overflow: hidden;
      border-radius: 0;
      background: transparent;
      border: none;
      box-shadow: none;
      isolation: isolate;
    }

    .sgb-color-carousel::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      opacity: .20;
      background:
        radial-gradient(circle at 16% 22%, var(--active-c1, #050608), transparent 18rem),
        radial-gradient(circle at 82% 24%, var(--active-c2, #162a42), transparent 20rem),
        radial-gradient(circle at 60% 86%, var(--active-c3, #c9a14a), transparent 16rem);
      transition: background 500ms ease;
    }

    .sgb-color-carousel__inner {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: minmax(240px, .72fr) minmax(0, 1.48fr);
      gap: clamp(1rem, 3vw, 2rem);
      align-items: stretch;
      padding: clamp(.8rem, 2vw, 1.25rem);
    }
    /* Flipped variant — image on right, copy on left */
    .sgb-color-carousel__inner--flip {
      grid-template-columns: minmax(0, 1.48fr) minmax(240px, .72fr);
    }
    .sgb-color-carousel__inner--flip .sgb-color-stage {
      order: 2;
    }
    .sgb-color-carousel__inner--flip .sgb-color-copy-panel {
      order: 1;
    }

    .sgb-color-stage {
      position: relative;
      min-height: 430px;
      border-radius: 28px;
      overflow: hidden;
      background:
        radial-gradient(circle at 24% 18%, rgba(255,255,255,.20), transparent 7rem),
        linear-gradient(145deg, #7c8490, #59626d 58%, #454d58);
      border: 1px solid rgba(255,255,255,.17);
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.20),
        inset 0 -18px 32px rgba(0,0,0,.08),
        0 22px 48px rgba(0,0,0,.14);
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0;
    }

    .sgb-color-stage::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(255,255,255,.06), transparent 40%, rgba(0,0,0,.05));
      pointer-events: none;
    }

    .sgb-color-stage__img {
      position: relative;
      z-index: 1;
      display: block;
      width: 100%;
      height: 100%;
      max-width: 100%;
      max-height: 100%;
      object-fit: contain;
      filter: drop-shadow(0 18px 28px rgba(0,0,0,.22));
    }

    .sgb-color-copy-panel {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      min-height: 430px;
      padding: clamp(.75rem, 1.5vw, 1.1rem) clamp(1.35rem, 3vw, 2rem) clamp(1.35rem, 3vw, 2rem);
      border-radius: 28px;
      color: var(--sgb-bone);
      background: rgba(7,16,24,.74);
      border: 1px solid rgba(255,249,238,.13);
      backdrop-filter: blur(14px);
      position: relative;
    }

    .sgb-color-kicker {
      display: inline-flex;
      width: fit-content;
      padding: .38rem .68rem;
      border-radius: 999px;
      color: var(--sgb-gold);
      background: rgba(255,249,238,.08);
      border: 1px solid rgba(255,249,238,.12);
      font-size: .76rem;
      font-weight: 900;
      letter-spacing: .13em;
      text-transform: uppercase;
    }

    .sgb-color-intro {
      margin: .95rem 0 0;
      max-width: 720px;
      color: rgba(255,249,238,.76);
      font-size: .99rem;
    }

    .sgb-color-name {
      margin: .4rem 0 0;
      color: var(--sgb-bone);
      font-size: clamp(2.25rem, 5vw, 4.85rem);
      line-height: .92;
      letter-spacing: -.06em;
      font-weight: 950;
    }

    .sgb-color-title {
      margin: .8rem 0 0;
      color: var(--sgb-gold);
      font-size: clamp(1.05rem, 2vw, 1.45rem);
      line-height: 1.1;
      letter-spacing: -.025em;
      font-weight: 850;
    }

    .sgb-color-description {
      margin: .85rem 0 0;
      max-width: 620px;
      color: rgba(255,249,238,.76);
      font-size: 1rem;
    }

    .sgb-color-meta {
      margin-top: 1rem;
      color: rgba(255,249,238,.64);
      font-size: .9rem;
      font-weight: 700;
      letter-spacing: .04em;
      text-transform: uppercase;
    }

    .sgb-color-controls {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
      margin-top: 1.5rem;
    }

    .sgb-color-buttons { display: flex; gap: .55rem; }
    .sgb-color-btn {
      display: inline-grid;
      place-items: center;
      width: 44px;
      height: 44px;
      border-radius: 999px;
      border: 1px solid rgba(255,249,238,.18);
      color: var(--sgb-bone);
      background: rgba(255,249,238,.08);
      cursor: pointer;
      font-size: 1.35rem;
      line-height: 1;
      transition: transform 160ms ease, background 160ms ease;
    }
    .sgb-color-btn:hover { transform: translateY(-2px); background: rgba(255,249,238,.14); }

    .sgb-color-progress {
      position: relative;
      flex: 1;
      height: 4px;
      border-radius: 999px;
      overflow: hidden;
      background: rgba(255,249,238,.15);
    }
    .sgb-color-progress span {
      position: absolute;
      inset: 0 auto 0 0;
      width: var(--progress, 0%);
      border-radius: 999px;
      background: linear-gradient(90deg, var(--sgb-gold), var(--sgb-copper));
    }

    .sgb-color-dots {
      display: flex;
      flex-wrap: wrap;
      gap: .42rem;
      margin-top: 1.1rem;
    }
    .sgb-color-dot {
      width: 26px;
      height: 26px;
      border-radius: 999px;
      border: 2px solid rgba(255,249,238,.32);
      background: linear-gradient(135deg, var(--dot-c1), var(--dot-c2));
      cursor: pointer;
      opacity: .62;
      transition: transform 160ms ease, opacity 160ms ease, border-color 160ms ease;
    }
    .sgb-color-dot:hover,
    .sgb-color-dot.is-active { transform: translateY(-2px) scale(1.06); opacity: 1; border-color: var(--sgb-gold); }

    /* Hover hint — top right of copy panel */
    .sgb-hover-hint {
      position: absolute;
      top: .75rem;
      right: 1rem;
      font-size: .72rem;
      font-weight: 700;
      letter-spacing: .06em;
      text-transform: uppercase;
      color: rgba(255,249,238,.28);
      pointer-events: none;
      user-select: none;
    }

    /* Profile shop button */
    .sgb-profile-shop-btn {
      display: inline-flex;
      align-items: center;
      gap: .45rem;
      margin-top: 1.1rem;
      padding: .6rem 1rem;
      border-radius: 999px;
      background: linear-gradient(135deg, var(--sgb-red), var(--sgb-copper));
      color: #fff;
      font-size: .85rem;
      font-weight: 875;
      letter-spacing: .01em;
      box-shadow: 0 6px 18px rgba(124,36,31,.25);
      transition: transform 160ms ease, box-shadow 160ms ease;
      cursor: pointer;
      border: none;
      text-decoration: none;
    }
    .sgb-profile-shop-btn:hover {
      transform: translateY(-2px);
      box-shadow: 0 10px 24px rgba(124,36,31,.34);
    }
    .sgb-color-meta-row {
      display: flex;
      align-items: baseline;
      justify-content: space-between;
      gap: 1rem;
      margin-top: 1rem;
    }
    .sgb-color-meta-row .sgb-color-meta { margin-top: 0; }

    /* Ghost "18 Proven Colors" text — inline with counter */
    .sgb-proven-ghost {
      font-size: clamp(1.1rem, 2vw, 1.6rem);
      font-weight: 950;
      letter-spacing: -.04em;
      line-height: 1;
      color: rgba(255,249,238,.11);
      user-select: none;
      pointer-events: none;
      white-space: nowrap;
      flex-shrink: 0;
    }

    /* Image zoom on hover */
    .sgb-color-stage {
      cursor: zoom-in;
    }
    .sgb-color-stage__img {
      transition: transform 320ms cubic-bezier(.34,1.28,.64,1), filter 320ms ease;
    }
    .sgb-color-stage:hover .sgb-color-stage__img {
      transform: scale(1.32);
      filter: drop-shadow(0 32px 52px rgba(0,0,0,.42));
    }

    /* Lightbox */
    .sgb-lightbox {
      display: none;
      position: fixed;
      inset: 0;
      z-index: 9000;
      background: rgba(7,16,24,.88);
      backdrop-filter: blur(22px);
      align-items: center;
      justify-content: center;
      padding: 1.5rem;
    }
    .sgb-lightbox.is-open {
      display: flex;
    }
    .sgb-lightbox__inner {
      position: relative;
      max-width: min(800px, 92vw);
      width: 100%;
      border-radius: var(--sgb-radius-xl);
      background:
        radial-gradient(circle at 24% 16%, rgba(255,255,255,.16), transparent 10rem),
        linear-gradient(145deg, #7c8490, #59626d 58%, #454d58);
      border: 1px solid rgba(255,255,255,.17);
      box-shadow: 0 48px 120px rgba(0,0,0,.58);
      padding: clamp(1.25rem, 4vw, 2.5rem);
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 1.25rem;
      animation: sgbLbIn 260ms cubic-bezier(.34,1.28,.64,1) both;
    }
    @keyframes sgbLbIn {
      from { opacity:0; transform: scale(.88); }
      to   { opacity:1; transform: scale(1); }
    }
    .sgb-lightbox__img {
      display: block;
      max-width: 100%;
      max-height: 70vh;
      object-fit: contain;
      filter: drop-shadow(0 32px 52px rgba(0,0,0,.36));
      border-radius: 12px;
    }
    .sgb-lightbox__label {
      color: var(--sgb-bone);
      font-size: clamp(1.1rem, 2.5vw, 1.5rem);
      font-weight: 875;
      letter-spacing: -.03em;
      text-align: center;
    }
    .sgb-lightbox__close {
      position: absolute;
      top: -14px;
      right: -14px;
      width: 44px;
      height: 44px;
      border-radius: 999px;
      border: 1px solid rgba(255,249,238,.22);
      background: var(--sgb-navy);
      color: var(--sgb-bone);
      font-size: 1.3rem;
      line-height: 1;
      cursor: pointer;
      display: grid;
      place-items: center;
      box-shadow: 0 8px 24px rgba(0,0,0,.38);
      transition: background 160ms ease, transform 160ms ease;
    }
    .sgb-lightbox__close:hover {
      background: var(--sgb-red);
      transform: scale(1.08);
    }

    .sgb-lineup-grid { display:grid; grid-template-columns: repeat(4,1fr); gap:1rem; margin-top:2.25rem; }
    .sgb-lineup-card { min-height: 0; display:flex; flex-direction:column; justify-content:space-between; gap: .85rem; padding:1.2rem 1.2rem 1rem; border-radius:var(--sgb-radius-lg); background:rgba(255,255,255,.82); border:1px solid rgba(11,16,22,.10); box-shadow:0 8px 24px rgba(0,0,0,.08); }
    .sgb-lineup-card h3 { margin:0; color:var(--sgb-navy); font-size:1.1rem; letter-spacing:-.03em; }
    .sgb-lineup-card p { margin:.4rem 0 0; color:#606660; font-size:.92rem; line-height:1.45; }
    .sgb-lineup-btn { display:inline-flex; align-items:center; gap:.4rem; padding:.55rem .9rem; border-radius:999px; background:linear-gradient(135deg,var(--sgb-red),var(--sgb-copper)); color:#fff; font-size:.82rem; font-weight:875; letter-spacing:.01em; box-shadow:0 6px 18px rgba(124,36,31,.22); transition:transform 160ms ease,box-shadow 160ms ease; align-self:flex-start; }
    .sgb-lineup-btn:hover { transform:translateY(-2px); box-shadow:0 10px 24px rgba(124,36,31,.30); }

    .sgb-built-section {
      position: relative;
      background:
        radial-gradient(circle at 82% 15%, rgba(169,46,42,.12), transparent 22rem),
        linear-gradient(160deg, #f0e3ce, #f8eedd 60%, #e8d9c0);
      isolation: isolate;
    }
    .sgb-built-section::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      background: var(--cedar-grain-light);
      opacity: .14;
      pointer-events: none;
    }
    .sgb-built-section > * { position: relative; z-index: 1; }
    .sgb-built-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
    .sgb-steps { display:grid; gap:.85rem; }
    .sgb-step { display:grid; grid-template-columns:48px 1fr; gap:.9rem; align-items:start; padding:1rem; border-radius:22px; background:rgba(255,255,255,.66); border:1px solid rgba(11,16,22,.12); }
    .sgb-step-num { display:grid; place-items:center; width:44px; height:44px; border-radius:16px; color:#fff; background:linear-gradient(135deg,var(--sgb-red),var(--sgb-copper)); font-weight:950; }
    .sgb-step strong { display:block; color:var(--sgb-navy); margin-bottom:.2rem; }
    .sgb-step span { color:#5d625e; font-size:.95rem; }
    .sgb-story-section { background: var(--sgb-parchment); }
    .sgb-story-card {
      padding:clamp(2rem,5vw,4rem);
      border-radius:var(--sgb-radius-xl);
      position: relative;
      overflow: hidden;
      background: linear-gradient(135deg, rgba(7,16,24,.96), rgba(22,42,66,.97));
      color:var(--sgb-bone);
      box-shadow:var(--sgb-shadow);
      isolation: isolate;
    }
    .sgb-story-card::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      background: radial-gradient(circle at top right, rgba(169,46,42,.28), transparent 18rem);
      pointer-events: none;
    }
    .sgb-story-card > * { position: relative; z-index: 1; }
    .sgb-story-card .sgb-h2 { color:var(--sgb-bone); }
    .sgb-story-card .sgb-lede { color:rgba(255,249,238,.74); }
    .sgb-story-card .sgb-section-label { color: var(--sgb-gold); }
    .sgb-story-card .sgb-pullquote { color:var(--sgb-bone); background:rgba(255,249,238,.08); border-left-color:var(--sgb-gold); }

    .sgb-final { padding:clamp(4rem,7vw,6.5rem) 0; }
    .sgb-final-panel {
      text-align:center;
      padding:clamp(2.25rem,6vw,5rem);
      border-radius:var(--sgb-radius-xl);
      background:
        radial-gradient(circle at top left, rgba(201,161,74,.18), transparent 18rem),
        radial-gradient(circle at bottom right, rgba(169,46,42,.10), transparent 16rem),
        linear-gradient(150deg, #f2e5d0, #f9f0e0 50%, #ece0c8);
      border:1px solid rgba(11,16,22,.10);
      box-shadow:var(--sgb-shadow);
      position: relative;
      overflow: hidden;
      isolation: isolate;
    }
    .sgb-final-panel::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      background: var(--cedar-grain-light);
      opacity: .12;
      pointer-events: none;
    }
    .sgb-final-panel > * { position: relative; z-index: 1; }
    .sgb-final-panel .sgb-h2, .sgb-final-panel .sgb-lede { margin-left:auto; margin-right:auto; }
    .sgb-final-panel .sgb-btn-row { justify-content:center; }

    .sgb-footer { padding:2rem 0; background:var(--sgb-blueblack); border-top:1px solid rgba(239,232,211,.12); color:rgba(255,249,238,.66); font-size:.92rem; }
    .sgb-footer-inner { display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; }

    @media (max-width: 980px) {
      .sgb-nav-links { display:none; }
      .sgb-hero-grid, .sgb-split, .sgb-built-grid { grid-template-columns:1fr; }
      .sgb-hero-art { min-height:520px; }
      .sgb-card-grid, .sgb-lineup-grid { grid-template-columns:repeat(2,1fr); }
      .sgb-color-grid { grid-template-columns:repeat(2,1fr); }
      .sgb-color-head { display:block; }
      /* Carousel stacks on tablet */
      .sgb-color-carousel__inner,
      .sgb-color-carousel__inner--flip {
        grid-template-columns: 1fr;
      }
      .sgb-color-carousel__inner--flip .sgb-color-stage,
      .sgb-color-carousel__inner--flip .sgb-color-copy-panel {
        order: unset;
      }
      .sgb-color-stage { min-height: 280px; }
      .sgb-color-copy-panel { min-height: 0; }
    }

    @media (max-width: 640px) {
      .sgb-shell { width:min(var(--sgb-max), calc(100% - 28px)); }
      .sgb-hero { padding-top:3rem; }
      .sgb-hero h1 { font-size:clamp(3rem,16vw,4.5rem); }
      .sgb-proof-strip, .sgb-card-grid, .sgb-color-grid, .sgb-lineup-grid { grid-template-columns:1fr; }
      .sgb-btn-row, .sgb-btn { width:100%; }
      .sgb-hero-art { min-height:480px; border-radius:26px; }
      .sgb-color-stage { min-height: 240px; }
    }