:root{
      --purple:#97239a;
      --purple-2:#6f1682;
      --purple-deep:#43105f;
      --purple-soft:#f7eef9;
      --orange:#ff7a18;
      --orange-2:#f15b22;
      --orange-soft:#fff1e6;
      --ink:#15161d;
      --muted:#6e727c;
      --line:#ece8ef;
      --wash:#fbfafc;
      --paper:#fff;
      --shadow:0 18px 55px rgba(40,21,49,.08);
      --shadow-sm:0 10px 28px rgba(40,21,49,.055);
      --ease:cubic-bezier(.2,.72,.2,1);
      --spring:cubic-bezier(.16,1,.3,1);
      --max:1220px;
    }

    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      color:var(--ink);
      background:#fff;
      font-family:"SF Pro Display","SF Pro Text",-apple-system,BlinkMacSystemFont,"Helvetica Neue","Segoe UI",Arial,sans-serif;
      line-height:1.55;
      -webkit-font-smoothing:antialiased;
      overflow-x:hidden;
    }
    body *{font-family:inherit}
    a{color:inherit;text-decoration:none}
    button,input,select{font:inherit}
    button{cursor:pointer}
    img{display:block;max-width:100%}
    p,.lead,.article-excerpt,.hero-sub,.desk-copy p,.footer-note{font-weight:500}
    h1,h2,h3,p{margin-top:0}
    h1,h2,h3{letter-spacing:-.052em}
    h1{font-size:clamp(56px,6.5vw,88px);line-height:.96}
    h2{font-size:clamp(38px,4.5vw,58px);line-height:1}
    h3{font-size:23px;line-height:1.12}
    .wrap{width:min(var(--max),calc(100% - 42px));margin-inline:auto}
    .gradient-text{
      background:linear-gradient(90deg,var(--purple),#a82b88 45%,var(--orange) 76%,var(--orange-2));
      -webkit-background-clip:text;
      background-clip:text;
      color:transparent;
    }
    .eyebrow{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:7px 12px;
      border-radius:999px;
      color:var(--orange-2);
      background:linear-gradient(90deg,var(--orange-soft),rgba(247,238,249,.7));
      font-size:10px;
      font-weight:900;
      letter-spacing:.13em;
      text-transform:uppercase;
    }

    /* progress */
    .scroll-progress{
      position:fixed;
      z-index:999;
      top:0;
      left:0;
      width:0;
      height:3px;
      background:linear-gradient(90deg,var(--purple),var(--orange));
      box-shadow:0 0 12px rgba(151,35,154,.3);
    }

    /* header */
    .site-header{
      position:sticky;
      top:0;
      z-index:100;
      padding:18px 0 6px;
      background:linear-gradient(to bottom,rgba(255,255,255,.98),rgba(255,255,255,.88),rgba(255,255,255,0));
      backdrop-filter:blur(12px);
      transition:.3s var(--ease);
    }
    .site-header.scrolled{
      padding-top:7px;
      background:rgba(255,255,255,.94);
      box-shadow:0 8px 24px rgba(20,15,25,.045);
    }
    .nav-shell{
      min-height:70px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:24px;
      padding:10px 14px 10px 18px;
      border:1px solid rgba(151,35,154,.055);
      border-radius:999px;
      background:rgba(255,255,255,.97);
      box-shadow:var(--shadow-sm);
    }
    .brand{
      display:flex;
      align-items:center;
      gap:12px;
      min-width:225px;
      font-size:24px;
      font-weight:900;
      letter-spacing:-.045em;
    }
    .brand-mark{
      position:relative;
      width:34px;
      height:43px;
      flex:none;
    }
    .brand-mark::before,
    .brand-mark::after{
      content:"";
      position:absolute;
      left:7px;
      width:27px;
      height:17px;
      border-radius:999px 999px 999px 4px;
      transform:rotate(-28deg);
    }
    .brand-mark::before{
      top:3px;
      background:linear-gradient(135deg,#ff9b25,var(--orange-2));
    }
    .brand-mark::after{
      bottom:4px;
      transform:rotate(152deg);
      background:linear-gradient(135deg,var(--purple),#6c1b8d);
    }
    .brand .p{color:var(--purple-deep)}
    .brand .o{color:var(--orange)}
    .desktop-nav{
      display:flex;
      align-items:center;
      justify-content:center;
      gap:30px;
      margin-left:auto;
      font-size:13px;
      font-weight:700;
    }
    .desktop-nav a{
      position:relative;
      color:#343740;
    }
    .desktop-nav a::after{
      content:"";
      position:absolute;
      left:0;
      right:100%;
      bottom:-8px;
      height:2px;
      background:linear-gradient(90deg,var(--purple),var(--orange));
      transition:right .25s ease;
    }
    .desktop-nav a:hover,
    .desktop-nav a.active{color:var(--purple)}
    .desktop-nav a:hover::after,
    .desktop-nav a.active::after{right:0}

    .btn{
      min-height:47px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:9px;
      padding:0 20px;
      border:1px solid transparent;
      border-radius:12px;
      font-size:13px;
      font-weight:850;
      transition:transform .28s var(--spring),box-shadow .28s var(--ease),border-color .25s ease;
    }
    .btn:hover{transform:translateY(-3px);box-shadow:0 15px 34px rgba(74,18,91,.16)}
    .btn-primary{
      color:#fff;
      background:linear-gradient(110deg,var(--purple-deep),var(--purple),var(--orange-2));
    }
    .btn-white{
      color:var(--orange-2);
      background:#fff;
      box-shadow:0 12px 28px rgba(76,15,89,.16);
    }
    .arrow{display:inline-block;transition:transform .25s var(--spring)}
    .btn:hover .arrow,
    .read-link:hover .arrow{transform:translateX(4px)}

    .mobile-menu{display:none;position:relative}
    .mobile-menu summary{
      list-style:none;
      width:43px;
      height:43px;
      display:grid;
      place-items:center;
      border-radius:50%;
      background:var(--purple-soft);
      color:var(--purple);
      cursor:pointer;
    }
    .mobile-menu summary::-webkit-details-marker{display:none}
    .mobile-panel{
      position:absolute;
      right:0;
      top:51px;
      width:225px;
      padding:11px;
      border:1px solid var(--line);
      border-radius:16px;
      background:#fff;
      box-shadow:var(--shadow);
    }
    .mobile-panel a{display:block;padding:10px;border-radius:9px}
    .mobile-panel a:hover{background:var(--purple-soft)}

    /* hero */
    .hero{
      position:relative;
      overflow:hidden;
      padding:66px 0 42px;
      background:
        radial-gradient(circle at 86% 20%,rgba(151,35,154,.075),transparent 23%),
        radial-gradient(circle at 72% 58%,rgba(255,122,24,.055),transparent 26%),
        #fff;
    }
    .hero::before{
      content:"";
      position:absolute;
      width:760px;
      height:530px;
      right:-170px;
      top:-60px;
      border:1px solid rgba(151,35,154,.055);
      border-radius:50%;
      transform:rotate(-14deg);
      pointer-events:none;
    }
    .hero-grid{
      position:relative;
      z-index:2;
      display:grid;
      grid-template-columns:1.02fr .98fr;
      gap:66px;
      align-items:center;
    }
    .hero-copy{
      padding:34px 0 48px;
    }
    .hero-copy h1{
      max-width:800px;
      margin:19px 0 18px;
    }
    .hero-sub{
      max-width:650px;
      margin:0;
      color:var(--muted);
      font-size:18px;
      line-height:1.58;
    }
    .subscribe-inline{
      display:flex;
      gap:8px;
      margin-top:31px;
      max-width:520px;
    }
    .subscribe-inline input{
      flex:1;
      min-width:0;
      min-height:48px;
      padding:0 16px;
      outline:none;
      border:1px solid #dcd4e1;
      border-radius:11px;
      background:#fff;
      color:var(--ink);
      box-shadow:0 7px 20px rgba(37,20,48,.025);
      transition:border-color .2s,box-shadow .2s;
    }
    .subscribe-inline input:focus{
      border-color:rgba(151,35,154,.48);
      box-shadow:0 0 0 4px rgba(151,35,154,.06);
    }
    .subscribe-note{
      margin-top:8px;
      color:#92959d;
      font-size:10px;
      font-weight:500;
    }
    .subscribe-success{
      display:none;
      margin-top:9px;
      color:var(--purple);
      font-size:11px;
      font-weight:700;
    }

    /* hero illustration */
    .hero-art{
      position:relative;
      min-height:445px;
    }
    .art-orbit{
      position:absolute;
      left:7%;
      right:3%;
      top:4%;
      bottom:5%;
      border:1px solid rgba(151,35,154,.08);
      border-radius:50%;
      transform:rotate(-19deg);
    }
    .art-orbit::after{
      content:"";
      position:absolute;
      inset:42px;
      border:1px solid rgba(255,122,24,.075);
      border-radius:50%;
    }
    .art-dots{
      position:absolute;
      width:88px;
      height:88px;
      opacity:.62;
      background-image:radial-gradient(var(--orange) 1.3px,transparent 1.3px);
      background-size:11px 11px;
    }
    .dots-a{left:5%;top:21%}
    .dots-b{right:10%;bottom:18%}
    .insight-sheet{
      position:absolute;
      z-index:3;
      left:34%;
      top:15%;
      width:265px;
      height:315px;
      padding:30px 28px;
      border:1px solid rgba(151,35,154,.06);
      border-radius:20px;
      background:rgba(255,255,255,.9);
      box-shadow:0 30px 70px rgba(53,21,60,.11);
      transform:rotate(7deg);
      animation:sheetFloat 6s ease-in-out infinite;
    }
    @keyframes sheetFloat{
      0%,100%{transform:rotate(7deg) translateY(0)}
      50%{transform:rotate(5deg) translateY(-10px)}
    }
    .sheet-line{
      height:10px;
      margin-bottom:14px;
      border-radius:999px;
      background:#f1eaf3;
    }
    .sheet-line.short{width:58%}
    .mini-bars{
      height:118px;
      display:flex;
      align-items:flex-end;
      gap:11px;
      padding:13px 5px 14px;
    }
    .mini-bars i{
      flex:1;
      border-radius:8px 8px 3px 3px;
      background:linear-gradient(180deg,#efe3f4,#cda9d8);
    }
    .mini-bars i:nth-child(1){height:24%}
    .mini-bars i:nth-child(2){height:42%}
    .mini-bars i:nth-child(3){height:67%;background:linear-gradient(180deg,#e9d6f2,#a65fc0)}
    .mini-bars i:nth-child(4){height:84%;background:linear-gradient(180deg,#ffe1cb,#ff9a57)}
    .mini-bars i:nth-child(5){height:100%;background:linear-gradient(180deg,#ffd9bc,var(--orange))}
    .art-badge{
      position:absolute;
      z-index:5;
      width:74px;
      height:74px;
      display:grid;
      place-items:center;
      border:1px solid rgba(151,35,154,.1);
      border-radius:17px;
      background:rgba(255,255,255,.93);
      box-shadow:0 17px 36px rgba(43,19,51,.08);
      font-size:28px;
      font-weight:800;
      animation:badgeFloat 5.2s ease-in-out infinite;
    }
    .art-badge.purple{
      left:21%;
      top:21%;
      color:var(--purple);
    }
    .art-badge.orange{
      right:6%;
      top:44%;
      color:var(--orange);
      animation-delay:.8s;
    }
    @keyframes badgeFloat{
      0%,100%{transform:translateY(0)}
      50%{transform:translateY(-11px)}
    }
    .art-line{
      position:absolute;
      z-index:1;
      left:-5%;
      right:-8%;
      top:56%;
      height:160px;
      border-top:1.5px solid rgba(151,35,154,.14);
      border-radius:50%;
      transform:rotate(-9deg);
    }

    /* featured */
    .featured-wrap{padding:6px 0 24px}
    .featured-card{
      overflow:hidden;
      padding:22px;
      border:1px solid #e6e1e9;
      border-radius:22px;
      background:#fff;
      box-shadow:var(--shadow-sm);
    }
    .featured-label{
      margin-bottom:15px;
      color:var(--orange-2);
      font-size:9px;
      font-weight:900;
      letter-spacing:.13em;
      text-transform:uppercase;
    }
    .featured-grid{
      display:grid;
      grid-template-columns:.8fr 1.2fr;
      gap:24px;
      align-items:stretch;
    }
    .featured-visual{
      position:relative;
      min-height:250px;
      overflow:hidden;
      border-radius:17px;
      background:
        radial-gradient(circle at 84% 20%,rgba(255,138,60,.7),transparent 31%),
        linear-gradient(145deg,#4d1679,#72237e 42%,#f1663c 100%);
    }
    .mountains{
      position:absolute;
      left:-3%;
      right:-3%;
      bottom:-5%;
      height:58%;
      background:
        linear-gradient(145deg,transparent 38%,#361160 39% 63%,transparent 64%) 0 100%/48% 100% no-repeat,
        linear-gradient(35deg,transparent 39%,#581a7b 40% 68%,transparent 69%) 44% 100%/48% 100% no-repeat,
        linear-gradient(150deg,transparent 40%,#331053 41% 67%,transparent 68%) 80% 100%/40% 100% no-repeat;
    }
    .featured-growth-line{
      position:absolute;
      left:15%;
      top:35%;
      width:68%;
      height:42%;
    }
    .featured-growth-line path{
      fill:none;
      stroke:#ffd1bd;
      stroke-width:7;
      stroke-linecap:round;
      stroke-linejoin:round;
      filter:drop-shadow(0 5px 10px rgba(255,255,255,.12));
    }
    .featured-growth-line polygon{fill:#ffd1bd}
    .featured-copy{
      min-height:250px;
      display:flex;
      flex-direction:column;
      justify-content:center;
      padding:18px 10px 14px;
    }
    .category-chip{
      align-self:flex-start;
      display:inline-flex;
      padding:6px 9px;
      margin-bottom:10px;
      border-radius:999px;
      background:var(--orange-soft);
      color:var(--orange-2);
      font-size:8px;
      font-weight:900;
      letter-spacing:.08em;
      text-transform:uppercase;
    }
    .featured-copy h2{
      margin:0 0 11px;
      max-width:650px;
      font-size:clamp(31px,3.4vw,46px);
    }
    .featured-copy p{
      max-width:650px;
      margin:0;
      color:var(--muted);
      font-size:15px;
    }
    .featured-meta{
      display:flex;
      align-items:center;
      gap:10px;
      margin-top:23px;
      color:#858993;
      font-size:10px;
      font-weight:500;
    }
    .featured-bottom{
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:16px;
    }
    .read-link{
      display:inline-flex;
      align-items:center;
      gap:8px;
      color:var(--purple);
      font-size:11px;
      font-weight:850;
    }

    /* filters */
    .category-strip{padding:11px 0 14px}
    .category-scroll{
      display:flex;
      gap:9px;
      overflow-x:auto;
      padding:3px 0 6px;
      scrollbar-width:none;
    }
    .category-scroll::-webkit-scrollbar{display:none}
    .filter-btn{
      flex:none;
      min-height:36px;
      padding:0 15px;
      border:1px solid var(--line);
      border-radius:999px;
      background:#fff;
      color:#626670;
      font-size:10px;
      font-weight:700;
      transition:.25s ease;
    }
    .filter-btn:hover,
    .filter-btn.active{
      color:#fff;
      border-color:transparent;
      background:linear-gradient(110deg,var(--purple),#aa2b8d);
      box-shadow:0 9px 20px rgba(116,28,132,.13);
    }

    /* top 3 */
    .top-articles{padding:4px 0 24px}
    .top-grid{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:18px;
    }

    .insight-card{
      position:relative;
      overflow:hidden;
      min-height:410px;
      display:flex;
      flex-direction:column;
      border:1px solid var(--line);
      border-radius:19px;
      background:#fff;
      box-shadow:var(--shadow-sm);
      transition:transform .34s var(--spring),box-shadow .34s ease,border-color .34s;
    }
    .insight-card:hover{
      transform:translateY(-7px);
      border-color:rgba(151,35,154,.14);
      box-shadow:var(--shadow);
    }
    .card-visual{
      position:relative;
      height:176px;
      overflow:hidden;
      background:linear-gradient(135deg,#f3e5f8,#fff);
    }
    .card-visual.orange{background:linear-gradient(135deg,#fff0df,#fff7ee)}
    .card-visual.mix{background:linear-gradient(135deg,#f0e2f6,#fff0e6)}
    .card-dots{
      position:absolute;
      left:19px;
      top:18px;
      width:78px;
      height:62px;
      opacity:.6;
      background-image:radial-gradient(var(--purple) 1.4px,transparent 1.4px);
      background-size:10px 10px;
    }
    .orange .card-dots{background-image:radial-gradient(var(--orange) 1.4px,transparent 1.4px)}
    .card-symbol{
      position:absolute;
      left:50%;
      top:50%;
      transform:translate(-50%,-50%);
      width:98px;
      height:98px;
      display:grid;
      place-items:center;
      border-radius:30px;
      color:var(--purple);
      background:rgba(255,255,255,.66);
      border:1px solid rgba(151,35,154,.08);
      box-shadow:0 15px 30px rgba(83,25,95,.07);
      font-size:43px;
      font-weight:900;
    }
    .orange .card-symbol{color:var(--orange-2)}
    .card-body{
      flex:1;
      display:flex;
      flex-direction:column;
      padding:19px 20px 18px;
    }
    .card-category{
      align-self:flex-start;
      display:inline-flex;
      padding:5px 8px;
      margin-bottom:9px;
      border-radius:999px;
      color:var(--purple);
      background:var(--purple-soft);
      font-size:7.5px;
      font-weight:900;
      letter-spacing:.08em;
      text-transform:uppercase;
    }
    .insight-card:nth-child(even) .card-category{
      color:var(--orange-2);
      background:var(--orange-soft);
    }
    .card-body h3{margin:0 0 10px;font-size:22px}
    .article-excerpt{
      margin:0 0 17px;
      color:var(--muted);
      font-size:13px;
      line-height:1.52;
    }
    .card-footer{
      margin-top:auto;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      color:#8a8e96;
      font-size:9px;
    }

    /* growth desk */
    .desk-strip{padding:10px 0 31px}
    .desk-card{
      min-height:117px;
      display:grid;
      grid-template-columns:110px 1fr auto;
      align-items:center;
      gap:22px;
      padding:20px 28px;
      border:1px solid #eadff0;
      border-radius:18px;
      background:
        radial-gradient(circle at 95% 50%,rgba(255,122,24,.09),transparent 24%),
        linear-gradient(90deg,#f8effa,#fff 58%,#fff9f4);
      box-shadow:0 9px 26px rgba(41,22,50,.04);
    }
    .desk-icon{
      width:72px;
      height:72px;
      display:grid;
      place-items:center;
      border-radius:50%;
      color:var(--purple);
      background:rgba(255,255,255,.75);
      box-shadow:0 10px 24px rgba(78,24,90,.08);
      font-size:31px;
      font-weight:900;
    }
    .desk-copy h3{margin:0 0 4px;font-size:19px}
    .desk-copy p{
      margin:0;
      max-width:570px;
      color:var(--muted);
      font-size:12px;
    }

    /* all insights */
    .library{padding:20px 0 45px}
    .library-head{
      display:flex;
      align-items:flex-end;
      justify-content:space-between;
      gap:24px;
      margin-bottom:20px;
    }
    .library-title{
      display:flex;
      align-items:baseline;
      gap:22px;
    }
    .library-title h2{
      margin:0;
      color:var(--orange-2);
      font-size:21px;
      letter-spacing:-.02em;
    }
    .library-title span{
      color:#898d96;
      font-size:11px;
      font-weight:500;
    }
    .sort-select{
      min-height:38px;
      padding:0 34px 0 13px;
      border:1px solid var(--line);
      border-radius:10px;
      outline:none;
      background:#fff;
      color:#61656f;
      font-size:10px;
    }
    .library-grid{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:17px;
    }
    .library-card{
      min-height:340px;
      display:flex;
      flex-direction:column;
      padding:18px;
      border:1px solid var(--line);
      border-radius:17px;
      background:#fff;
      box-shadow:0 7px 21px rgba(34,19,42,.04);
      transition:.3s var(--spring);
    }
    .library-card:hover{
      transform:translateY(-5px);
      box-shadow:var(--shadow-sm);
    }
    .library-icon{
      width:66px;
      height:66px;
      display:grid;
      place-items:center;
      margin-bottom:18px;
      border-radius:18px;
      color:var(--purple);
      background:linear-gradient(145deg,var(--purple-soft),#fff);
      font-size:31px;
      font-weight:900;
    }
    .library-card:nth-child(even) .library-icon{
      color:var(--orange-2);
      background:linear-gradient(145deg,var(--orange-soft),#fff);
    }
    .library-card h3{margin:0 0 9px;font-size:18px}
    .library-card p{
      margin:0 0 14px;
      color:var(--muted);
      font-size:12px;
      line-height:1.48;
    }
    .library-meta{
      margin-top:auto;
      color:#8d9199;
      font-size:9px;
    }
    .library-read{
      align-self:flex-end;
      margin-top:12px;
      color:var(--purple);
      font-size:9px;
      font-weight:850;
    }
    .empty-state{
      display:none;
      padding:38px;
      text-align:center;
      color:var(--muted);
    }

    /* bottom CTA */
    .closing-cta{padding:12px 0 42px}
    .closing-card{
      min-height:135px;
      display:grid;
      grid-template-columns:1fr 1.2fr .9fr;
      align-items:center;
      gap:26px;
      padding:28px 40px;
      overflow:hidden;
      border-radius:18px;
      color:#fff;
      background:
        radial-gradient(circle at 94% 22%,rgba(255,197,117,.24),transparent 22%),
        linear-gradient(105deg,#6d0f8a,#922095 42%,#d33c61 68%,#ff6d10);
      box-shadow:0 24px 52px rgba(76,14,89,.18);
    }
    .closing-card h2{
      margin:0;
      color:#fff;
      font-size:34px;
    }
    .closing-copy{
      padding-left:26px;
      border-left:1px solid rgba(255,255,255,.28);
      color:rgba(255,255,255,.78);
      font-size:12px;
      font-weight:500;
      line-height:1.5;
    }
    .closing-action{
      display:flex;
      justify-content:flex-end;
    }

    /* compact footer */
    .footer{
      padding:0 0 27px;
      color:#767a84;
      font-size:10px;
    }
    .footer-row{
      min-height:58px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:24px;
      border-top:1px solid #f0edf2;
    }
    .footer-left,
    .footer-right{
      display:flex;
      align-items:center;
      gap:22px;
      flex-wrap:wrap;
    }
    .footer strong{color:var(--orange-2)}
    .footer a:hover{color:var(--purple)}

    /* reveal */
    .reveal{
      opacity:0;
      transform:translateY(28px);
      filter:blur(5px);
      transition:.78s var(--spring);
    }
    .reveal.left{transform:translateX(-38px)}
    .reveal.right{transform:translateX(38px)}
    .reveal.visible{
      opacity:1;
      transform:none;
      filter:none;
    }
    .stagger>*{
      opacity:0;
      transform:translateY(23px);
      transition:.65s var(--spring);
    }
    .stagger.visible>*{opacity:1;transform:none}
    .stagger.visible>*:nth-child(2){transition-delay:.07s}
    .stagger.visible>*:nth-child(3){transition-delay:.14s}
    .stagger.visible>*:nth-child(4){transition-delay:.21s}

    @media(max-width:1100px){
      .desktop-nav{display:none}
      .mobile-menu{display:block}
      .hero-grid{grid-template-columns:1fr}
      .hero-art{min-height:390px}
      .featured-grid{grid-template-columns:1fr}
      .top-grid{grid-template-columns:1fr 1fr}
      .library-grid{grid-template-columns:1fr 1fr}
      .closing-card{grid-template-columns:1fr}
      .closing-copy{padding-left:0;padding-top:17px;border-left:0;border-top:1px solid rgba(255,255,255,.25)}
      .closing-action{justify-content:flex-start}
    }

    @media(max-width:720px){
      .wrap{width:min(var(--max),calc(100% - 24px))}
      .site-header{padding-top:7px}
      .nav-shell{min-height:58px;padding:7px 8px 7px 11px;border-radius:17px}
      .brand{min-width:0;font-size:20px;gap:8px}
      .brand-mark{width:28px;height:35px}
      .nav-shell>.btn{display:none}
      .hero{padding-top:30px}
      .hero-copy{padding:22px 0 20px}
      h1{font-size:clamp(44px,12vw,58px)}
      .hero-sub{font-size:15px}
      .subscribe-inline{display:grid;grid-template-columns:1fr auto}
      .hero-art{min-height:330px}
      .insight-sheet{left:27%;top:12%;width:225px;height:272px;padding:25px 22px}
      .art-badge{width:61px;height:61px;font-size:23px}
      .featured-card{padding:13px;border-radius:18px}
      .featured-visual{min-height:220px}
      .featured-copy{min-height:auto;padding:13px 6px}
      .featured-bottom{align-items:flex-start;flex-direction:column}
      .top-grid{grid-template-columns:1fr}
      .desk-card{grid-template-columns:68px 1fr;padding:17px}
      .desk-icon{width:58px;height:58px;font-size:26px}
      .desk-card>.read-link{grid-column:1/-1;justify-self:flex-end}
      .library-head{align-items:flex-start;flex-direction:column}
      .library-title{align-items:flex-start;flex-direction:column;gap:5px}
      .library-grid{grid-template-columns:1fr}
      .closing-card{padding:28px 23px}
      .closing-card h2{font-size:31px}
      .footer-row{align-items:flex-start;flex-direction:column;padding:18px 0}
    }

    @media(max-width:470px){
      .subscribe-inline{grid-template-columns:1fr}
      .subscribe-inline .btn{width:100%}
      .hero-art{min-height:295px}
      .insight-sheet{left:23%;width:205px;height:250px}
    }

    @media(prefers-reduced-motion:reduce){
      html{scroll-behavior:auto}
      *,*:before,*:after{animation:none!important;transition:none!important}
      .reveal,.stagger>*{opacity:1!important;transform:none!important;filter:none!important}
    }
  
  /* =========================================================
     ANIMATION LAYER — INSIGHTS V3
     Smooth, premium, scroll-aware and mobile-safe.
  ========================================================= */

  /* Page entry */
  body{
    opacity:0;
    animation:pageFadeIn .55s ease forwards;
  }

  @keyframes pageFadeIn{
    to{opacity:1}
  }

  /* Header floats in, then tightens on scroll */
  .nav-shell{
    animation:navDrop .75s .08s var(--spring) both;
    transform-origin:center top;
  }

  @keyframes navDrop{
    0%{
      opacity:0;
      transform:translateY(-24px) scale(.985);
      filter:blur(6px);
    }
    100%{
      opacity:1;
      transform:none;
      filter:none;
    }
  }

  .site-header.scrolled .nav-shell{
    transform:translateY(-1px) scale(.992);
  }

  /* Logo / brand micro motion */
  .brand-mark{
    animation:brandPulse 5.8s ease-in-out infinite;
  }

  @keyframes brandPulse{
    0%,100%{transform:rotate(0deg) scale(1)}
    50%{transform:rotate(-3deg) scale(1.045)}
  }

  .brand:hover .brand-mark{
    transform:rotate(7deg) scale(1.08);
    transition:transform .35s var(--spring);
  }

  /* Hero headline word reveal */
  .hero h1 .hero-word{
    display:inline-block;
    opacity:0;
    transform:translateY(34px) rotateX(14deg);
    filter:blur(7px);
    transform-origin:center bottom;
    animation:heroWordIn .72s var(--spring) forwards;
    animation-delay:calc(.16s + (var(--i) * 45ms));
  }

  @keyframes heroWordIn{
    to{
      opacity:1;
      transform:none;
      filter:none;
    }
  }

  .hero-sub,
  .subscribe-inline,
  .subscribe-note{
    opacity:0;
    transform:translateY(18px);
    animation:heroSupportIn .75s var(--spring) forwards;
  }

  .hero-sub{animation-delay:.64s}
  .subscribe-inline{animation-delay:.78s}
  .subscribe-note{animation-delay:.88s}

  @keyframes heroSupportIn{
    to{opacity:1;transform:none}
  }

  /* Hero artwork gains depth */
  .hero-art{
    perspective:1100px;
  }

  .insight-sheet{
    transform-origin:center;
    will-change:transform;
    animation:sheetFloat 6s ease-in-out infinite, sheetEntrance .95s .18s var(--spring) both;
  }

  @keyframes sheetEntrance{
    from{
      opacity:0;
      transform:translateY(42px) rotate(11deg) scale(.92);
      filter:blur(7px);
    }
    to{
      opacity:1;
      filter:none;
    }
  }

  .art-orbit{
    animation:orbitRotate 22s linear infinite;
  }

  .art-orbit::after{
    animation:orbitRotateReverse 17s linear infinite;
  }

  @keyframes orbitRotate{
    to{transform:rotate(341deg)}
  }

  @keyframes orbitRotateReverse{
    to{transform:rotate(-341deg)}
  }

  .art-dots{
    animation:dotsDrift 7s ease-in-out infinite alternate;
  }

  .dots-b{animation-delay:-2.3s}

  @keyframes dotsDrift{
    from{transform:translate3d(0,0,0)}
    to{transform:translate3d(11px,-8px,0)}
  }

  .art-line{
    animation:artLineBreath 5.8s ease-in-out infinite;
  }

  @keyframes artLineBreath{
    0%,100%{opacity:.45;transform:rotate(-9deg) scaleX(.96)}
    50%{opacity:1;transform:rotate(-7deg) scaleX(1.03)}
  }

  /* Animated bars inside hero sheet */
  .mini-bars i{
    transform-origin:center bottom;
    animation:barRise 1.05s var(--spring) both;
  }
  .mini-bars i:nth-child(1){animation-delay:.45s}
  .mini-bars i:nth-child(2){animation-delay:.52s}
  .mini-bars i:nth-child(3){animation-delay:.59s}
  .mini-bars i:nth-child(4){animation-delay:.66s}
  .mini-bars i:nth-child(5){animation-delay:.73s}

  @keyframes barRise{
    from{transform:scaleY(.08);opacity:.18}
    to{transform:scaleY(1);opacity:1}
  }

  /* Featured article */
  .featured-card{
    position:relative;
    isolation:isolate;
  }

  .featured-card::before{
    content:"";
    position:absolute;
    z-index:-1;
    width:230px;
    height:230px;
    right:-105px;
    top:-105px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(151,35,154,.10),transparent 69%);
    animation:featuredHalo 5.5s ease-in-out infinite;
  }

  @keyframes featuredHalo{
    0%,100%{transform:scale(.92);opacity:.5}
    50%{transform:scale(1.12);opacity:1}
  }

  .featured-visual{
    transform:translateZ(0);
  }

  .featured-visual::after{
    content:"";
    position:absolute;
    inset:-45% -20%;
    transform:translateX(-110%) rotate(14deg);
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);
    animation:visualSheen 5.8s ease-in-out infinite 1.4s;
  }

  @keyframes visualSheen{
    0%,70%{transform:translateX(-110%) rotate(14deg)}
    100%{transform:translateX(130%) rotate(14deg)}
  }

  .featured-growth-line path{
    stroke-dasharray:900;
    stroke-dashoffset:900;
    animation:drawFeaturedLine 2.1s .55s var(--spring) forwards;
  }

  .featured-growth-line polygon{
    opacity:0;
    transform-box:fill-box;
    transform-origin:center;
    animation:arrowPop .45s 2.25s var(--spring) forwards;
  }

  @keyframes drawFeaturedLine{
    to{stroke-dashoffset:0}
  }

  @keyframes arrowPop{
    from{opacity:0;transform:scale(.3) rotate(-18deg)}
    to{opacity:1;transform:scale(1)}
  }

  /* Category pill animation */
  .filter-btn{
    position:relative;
    overflow:hidden;
  }

  .filter-btn::before{
    content:"";
    position:absolute;
    left:50%;
    top:50%;
    width:4px;
    height:4px;
    border-radius:50%;
    background:linear-gradient(110deg,var(--purple),var(--orange));
    opacity:0;
    transform:translate(-50%,-50%) scale(0);
    transition:transform .42s var(--spring),opacity .25s ease;
    z-index:-1;
  }

  .filter-btn:hover::before,
  .filter-btn.active::before{
    opacity:1;
    transform:translate(-50%,-50%) scale(40);
  }

  .filter-btn:hover,
  .filter-btn.active{
    position:relative;
    color:#fff;
    background:transparent;
    z-index:1;
  }

  /* Top insight card animation */
  .insight-card{
    transform-style:preserve-3d;
    will-change:transform;
  }

  .card-symbol{
    animation:symbolFloat 5.5s ease-in-out infinite;
  }

  .insight-card:nth-child(2) .card-symbol{animation-delay:-1.1s}
  .insight-card:nth-child(3) .card-symbol{animation-delay:-2s}

  @keyframes symbolFloat{
    0%,100%{transform:translate(-50%,-50%) translateY(0) rotate(0)}
    50%{transform:translate(-50%,-50%) translateY(-7px) rotate(-2deg)}
  }

  .card-dots{
    animation:cardDotsPan 9s linear infinite;
  }

  @keyframes cardDotsPan{
    to{background-position:20px 10px}
  }

  .insight-card:hover .card-visual{
    transform:scale(1.015);
  }

  .card-visual{
    transition:transform .45s var(--spring);
  }

  /* Desk strip */
  .desk-card{
    position:relative;
    overflow:hidden;
  }

  .desk-card::after{
    content:"";
    position:absolute;
    width:170px;
    height:170px;
    right:-75px;
    top:-75px;
    border-radius:50%;
    border:1px solid rgba(151,35,154,.08);
    box-shadow:
      0 0 0 28px rgba(151,35,154,.025),
      0 0 0 56px rgba(255,122,24,.018);
    animation:deskRings 5.2s ease-in-out infinite;
    pointer-events:none;
  }

  @keyframes deskRings{
    0%,100%{transform:scale(.92);opacity:.45}
    50%{transform:scale(1.08);opacity:1}
  }

  .desk-icon{
    animation:deskIconFloat 4.8s ease-in-out infinite;
  }

  @keyframes deskIconFloat{
    0%,100%{transform:translateY(0) rotate(0)}
    50%{transform:translateY(-6px) rotate(-5deg)}
  }

  /* Library cards */
  .library-card{
    position:relative;
    overflow:hidden;
  }

  .library-card::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:3px;
    transform:scaleX(0);
    transform-origin:left;
    background:linear-gradient(90deg,var(--purple),var(--orange));
    transition:transform .35s var(--spring);
  }

  .library-card:hover::after{
    transform:scaleX(1);
  }

  .library-card:hover .library-icon{
    transform:translateY(-4px) rotate(-4deg) scale(1.04);
  }

  .library-icon{
    transition:transform .38s var(--spring);
  }

  /* Closing CTA */
  .closing-card{
    position:relative;
    isolation:isolate;
    background-size:180% 180%;
    animation:ctaGradient 8s ease infinite;
  }

  @keyframes ctaGradient{
    0%,100%{background-position:0% 50%}
    50%{background-position:100% 50%}
  }

  .closing-card::before,
  .closing-card::after{
    content:"";
    position:absolute;
    z-index:-1;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.14);
    pointer-events:none;
  }

  .closing-card::before{
    width:260px;
    height:260px;
    right:-95px;
    top:-120px;
    animation:ctaOrbA 7s ease-in-out infinite;
  }

  .closing-card::after{
    width:190px;
    height:190px;
    right:115px;
    bottom:-145px;
    animation:ctaOrbB 8s ease-in-out infinite;
  }

  @keyframes ctaOrbA{
    0%,100%{transform:translate3d(0,0,0) scale(1)}
    50%{transform:translate3d(-18px,18px,0) scale(1.13)}
  }

  @keyframes ctaOrbB{
    0%,100%{transform:translate3d(0,0,0) scale(.92)}
    50%{transform:translate3d(16px,-16px,0) scale(1.08)}
  }

  .btn-white{
    animation:ctaButtonPulse 3.7s ease-in-out infinite;
  }

  @keyframes ctaButtonPulse{
    0%,100%{box-shadow:0 12px 28px rgba(76,15,89,.16)}
    50%{box-shadow:0 18px 38px rgba(255,255,255,.18),0 12px 30px rgba(76,15,89,.22)}
  }

  /* Footer hover */
  .footer a{
    transition:transform .25s var(--spring),color .25s ease;
  }

  .footer a:hover{
    transform:translateY(-2px);
  }

  /* Dynamic JS animation helpers */
  [data-animate-line]{
    position:relative;
  }

  [data-animate-line]::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-6px;
    width:100%;
    height:2px;
    transform:scaleX(0);
    transform-origin:left;
    background:linear-gradient(90deg,var(--purple),var(--orange));
    transition:transform .7s var(--spring);
  }

  [data-animate-line].visible::after{
    transform:scaleX(1);
  }

  .parallax-layer{
    will-change:transform;
    transition:transform .08s linear;
  }

  /* More cinematic card entrance */
  .insight-card,
  .library-card{
    opacity:0;
    transform:translateY(35px) scale(.975);
  }

  .insight-card.anim-in,
  .library-card.anim-in{
    opacity:1;
    transform:none;
    transition:
      opacity .7s var(--spring),
      transform .7s var(--spring),
      box-shadow .34s ease,
      border-color .34s ease;
  }

  /* Loading/sorting refresh */
  .is-refreshing{
    animation:contentRefresh .42s var(--spring);
  }

  @keyframes contentRefresh{
    0%{opacity:.35;transform:translateY(8px)}
    100%{opacity:1;transform:none}
  }

  @media(max-width:720px){
    .hero-art{
      transform:none!important;
    }

    .insight-card:hover,
    .library-card:hover{
      transform:none;
    }

    .insight-sheet{
      animation:sheetFloat 6s ease-in-out infinite;
    }
  }

  @media(prefers-reduced-motion:reduce){
    body{opacity:1;animation:none!important}
    .hero h1 .hero-word,
    .hero-sub,
    .subscribe-inline,
    .subscribe-note,
    .insight-card,
    .library-card{
      opacity:1!important;
      transform:none!important;
      filter:none!important;
      animation:none!important;
    }
  }