/* Campaign Hub marketing site — shared tokens & components */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,wght@0,400;0,600;0,700;0,900;1,500&family=Space+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Noto+Sans+Ethiopic:wght@400;500;600;700&display=swap');

:root{
    --bg: #17120E;
    --bg-soft: #1D1712;
    --bg-card: #221B14;
    --ink: #F2E9DC;
    --ink-dim: #B9AB96;
    --ink-faint: #7C7160;
    --clay: #C1622D;
    --clay-bright: #E07A3E;
    --gold: #D8A73D;
    --teal: #1F5C4A;
    --teal-bright: #3E9377;
    --line: rgba(242,233,220,0.10);
    --line-bright: rgba(242,233,220,0.22);
  }
  *{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  body{
    margin:0;
    background:var(--bg);
    color:var(--ink);
    font-family:'Space Grotesk', 'Noto Sans Ethiopic', sans-serif;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  ::selection{ background:var(--clay); color:var(--bg); }

  a{ color:inherit; text-decoration:none; }
  .eyebrow{
    font-family:'JetBrains Mono', monospace;
    font-size:12.5px;
    letter-spacing:0.12em;
    text-transform:uppercase;
    color:var(--gold);
    display:flex;
    align-items:center;
    gap:10px;
  }
  .eyebrow::before{
    content:'';
    width:18px; height:1px;
    background:var(--gold);
    display:inline-block;
  }
  h1,h2,h3{
    font-family:'Fraunces', serif;
    font-weight:700;
    margin:0;
    letter-spacing:-0.01em;
  }
  em{
    font-style:italic;
    font-weight:500;
    color:var(--clay-bright);
  }
  p{ line-height:1.6; color:var(--ink-dim); margin:0; }

  .wrap{ max-width:1160px; margin:0 auto; padding:0 32px; }

  /* ---------- NAV ---------- */
  nav{
    position:fixed; top:0; left:0; right:0; z-index:100;
    display:flex; align-items:center; justify-content:space-between;
    padding:22px 32px;
    background:transparent;
    transition:background .35s ease, border-color .35s ease, padding .35s ease;
    border-bottom:1px solid transparent;
  }
  nav.solid{
    background:rgba(23,18,14,0.86);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
    padding:14px 32px;
  }
  .logo{
    font-family:'Fraunces', serif;
    font-weight:700;
    font-size:19px;
    display:flex; align-items:center; gap:9px;
  }
  .logo .dot{
    width:8px; height:8px; border-radius:50%;
    background:var(--gold);
  }
  .nav-links{ display:flex; align-items:center; gap:32px; }
  .nav-links a.link{
    font-size:14.5px; color:var(--ink-dim);
    transition:color .2s ease;
  }
  .nav-links a.link:hover{ color:var(--ink); }
  .btn{
    font-family:'Space Grotesk', sans-serif;
    font-weight:600;
    font-size:14.5px;
    padding:11px 20px;
    border-radius:7px;
    display:inline-flex; align-items:center; gap:8px;
    cursor:pointer;
    border:1px solid transparent;
    transition:transform .18s ease, background .2s ease, border-color .2s ease;
  }
  .btn:hover{ transform:translateY(-1px); }
  .btn-primary{ background:var(--clay); color:#1A1410; }
  .btn-primary:hover{ background:var(--clay-bright); }
  .btn-ghost{
    background:transparent; color:var(--ink);
    border-color:var(--line-bright);
  }
  .btn-ghost:hover{ border-color:var(--gold); color:var(--gold); }

  /* ---------- HERO ---------- */
  .hero{
    position:relative;
    min-height:100vh;
    display:flex; align-items:center;
    padding-top:80px;
    overflow:hidden;
  }
  #ring-canvas{
    position:absolute; inset:0;
    z-index:0;
    opacity:0.95;
  }
  .hero-inner{
    position:relative; z-index:2;
    max-width:640px;
  }
  .hero::after{
    content:'';
    position:absolute; inset:0;
    background:linear-gradient(90deg, var(--bg) 0%, rgba(23,18,14,0.75) 38%, rgba(23,18,14,0.15) 62%, rgba(23,18,14,0) 100%);
    z-index:1;
    pointer-events:none;
  }
  .hero h1{
    font-size:clamp(38px, 5.2vw, 62px);
    line-height:1.06;
    margin:20px 0 22px;
  }
  .hero p.lede{
    font-size:17.5px;
    max-width:480px;
    margin-bottom:34px;
  }
  .hero-ctas{ display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
  .hero-note{
    margin-top:22px;
    font-family:'JetBrains Mono', monospace;
    font-size:12px;
    color:var(--ink-faint);
    letter-spacing:0.02em;
  }
  .ring-hud{
    position:absolute; bottom:32px; left:32px; z-index:2;
    width:240px;
  }
  .rh-eyebrow{
    font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.1em;
    text-transform:uppercase; color:var(--gold); margin-bottom:11px;
    display:flex; align-items:center; gap:8px;
  }
  .rh-eyebrow .pulse{
    width:6px; height:6px; border-radius:50%; background:var(--gold);
    animation:hudpulse 1.8s ease-in-out infinite;
  }
  @keyframes hudpulse{
    0%,100%{ opacity:1; transform:scale(1); }
    50%{ opacity:0.4; transform:scale(0.7); }
  }
  .rh-stat{ display:flex; align-items:baseline; gap:9px; margin-bottom:11px; }
  .rh-stat .num{ font-family:'Fraunces', serif; font-weight:700; font-size:32px; color:var(--ink); line-height:1; }
  .rh-stat .of{ font-family:'JetBrains Mono', monospace; font-size:12px; color:var(--ink-faint); }
  .rh-bar{ height:5px; border-radius:3px; background:rgba(242,233,220,0.1); overflow:hidden; margin-bottom:9px; }
  .rh-fill{
    height:100%; width:6%; border-radius:3px;
    background:linear-gradient(90deg, var(--teal-bright), var(--gold));
    transition:width .5s cubic-bezier(.2,.7,.2,1);
  }
  .rh-legend{
    display:flex; gap:12px; margin-bottom:11px;
    font-family:'JetBrains Mono', monospace; font-size:10px; color:var(--ink-faint);
  }
  .rh-legend span{ display:inline-flex; align-items:center; gap:5px; }
  .rh-legend i{ width:6px; height:6px; border-radius:50%; display:inline-block; }
  .rh-legend i.planned{ background:#4A4136; border:1px solid var(--line-bright); }
  .rh-legend i.ready{ background:var(--gold); }
  .rh-legend i.posted{ background:var(--teal-bright); }
  .rh-row{
    font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--ink-faint);
    display:flex; justify-content:space-between; margin-bottom:5px;
  }
  .rh-row span:last-child{ color:var(--ink-dim); }
  .rh-cycle{
    font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--ink-dim);
    margin-top:9px; padding-top:9px; border-top:1px solid var(--line);
  }
  @media (max-width: 880px){
    .ring-hud{ display:none; }
  }
  .ring-callout{
    position:absolute; top:0; left:0; z-index:3;
    width:216px;
    background:rgba(29,23,18,0.94);
    border:1px solid var(--line-bright);
    border-radius:10px;
    padding:13px 16px;
    box-shadow:0 24px 46px -22px rgba(0,0,0,0.65);
    backdrop-filter:blur(6px);
    pointer-events:none;
    opacity:0;
    transition:opacity .35s ease;
    will-change:transform;
  }
  .rc-tag{
    font-family:'JetBrains Mono', monospace; font-size:10.5px; letter-spacing:0.08em;
    color:var(--gold); margin-bottom:7px;
  }
  .rc-text{ font-size:13px; color:var(--ink); line-height:1.42; margin-bottom:9px; }
  .rc-sub{ font-family:'JetBrains Mono', monospace; font-size:10px; color:var(--ink-faint); }
  @media (max-width: 880px){
    .ring-callout{ display:none; }
  }

  /* ---------- SECTION GENERIC ---------- */
  section{ position:relative; padding:110px 0; }
  .section-head{ max-width:620px; margin-bottom:64px; }
  .section-head h2{ font-size:clamp(28px, 3.4vw, 40px); margin-top:16px; line-height:1.14; }
  .section-head p{ margin-top:16px; font-size:16px; }

  .reveal{
    opacity:0; transform:translateY(26px);
    transition:opacity .75s cubic-bezier(.2,.7,.2,1) var(--d, 0s), transform .75s cubic-bezier(.2,.7,.2,1) var(--d, 0s);
  }
  .reveal.in{ opacity:1; transform:none; }

  /* ---------- PROCESS ---------- */
  .process{ background:var(--bg-soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .process-rail{
    display:grid; grid-template-columns:repeat(4,1fr); gap:0;
    position:relative;
  }
  .process-rail::before{
    content:'';
    position:absolute; top:26px; left:0; right:0; height:1px;
    background:var(--line-bright);
  }
  .p-step{ position:relative; padding-right:28px; }
  .p-num{
    font-family:'JetBrains Mono', monospace;
    font-size:13px; color:var(--bg);
    background:var(--gold);
    width:52px; height:52px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    margin-bottom:26px; position:relative; z-index:2;
    font-weight:500;
  }
  .p-step:nth-child(2) .p-num{ background:var(--clay); }
  .p-step:nth-child(3) .p-num{ background:var(--teal-bright); color:var(--bg); }
  .p-step:nth-child(4) .p-num{ background:var(--ink); }
  .p-step h3{ font-size:19px; margin-bottom:10px; }
  .p-step p{ font-size:14.5px; }

  /* ---------- WORKSPACE DEMO ---------- */
  .ws-grid{ display:grid; grid-template-columns:1.05fr 1fr; gap:60px; align-items:center; }
  .browser-frame{
    background:var(--bg-card);
    border:1px solid var(--line);
    border-radius:14px;
    overflow:hidden;
    box-shadow:0 40px 80px -30px rgba(0,0,0,0.6);
  }
  .browser-top{
    display:flex; align-items:center; gap:8px;
    padding:12px 16px;
    border-bottom:1px solid var(--line);
  }
  .browser-top span{ width:9px; height:9px; border-radius:50%; background:var(--line-bright); }
  .browser-tabs{
    display:flex; gap:4px; padding:14px 16px 0;
  }
  .b-tab{
    font-family:'JetBrains Mono', monospace;
    font-size:12px; letter-spacing:0.03em;
    padding:9px 16px; color:var(--ink-faint);
    border-bottom:2px solid transparent;
    cursor:default;
  }
  .b-tab.active{ color:var(--ink); border-color:var(--clay); }
  .browser-body{ padding:22px 24px 26px; min-height:260px; }
  .lang-toggle{
    display:inline-flex; background:var(--bg); border:1px solid var(--line); border-radius:8px;
    padding:3px; margin-bottom:18px; font-family:'JetBrains Mono', monospace; font-size:12px;
  }
  .lang-toggle span{
    padding:6px 14px; border-radius:6px; cursor:pointer; color:var(--ink-faint);
  }
  .lang-toggle span.on{ background:var(--gold); color:var(--bg); }
  .caption-box{
    background:var(--bg); border:1px solid var(--line); border-radius:8px;
    padding:16px 18px; font-size:14px; color:var(--ink-dim); line-height:1.65;
    margin-bottom:14px;
  }
  .caption-box .tag{ color:var(--teal-bright); }
  .checklist{ display:flex; flex-direction:column; gap:9px; margin-top:18px; }
  .cl-item{ display:flex; align-items:center; gap:10px; font-size:13.5px; color:var(--ink-dim); }
  .cl-box{ width:15px; height:15px; border:1px solid var(--line-bright); border-radius:4px; flex-shrink:0; }
  .cl-box.done{ background:var(--teal-bright); border-color:var(--teal-bright); }

  .ws-copy .eyebrow{ margin-bottom:16px; }
  .ws-copy h2{ font-size:clamp(26px,3vw,34px); margin-bottom:18px; line-height:1.16; }
  .ws-copy p{ font-size:15.5px; margin-bottom:14px; }
  .ws-list{ margin-top:24px; display:flex; flex-direction:column; gap:14px; }
  .ws-list li{ list-style:none; display:flex; gap:12px; font-size:14.5px; color:var(--ink-dim); }
  .ws-list li::before{ content:'—'; color:var(--gold); flex-shrink:0; }

  /* ---------- TYPES ---------- */
  .type-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
  .type-card{
    background:var(--bg-card); border:1px solid var(--line); border-radius:14px;
    padding:30px 26px; transition:border-color .25s ease, transform .25s ease;
  }
  .type-card:hover{ border-color:var(--line-bright); transform:translateY(-4px); }
  .type-tag{
    font-family:'JetBrains Mono', monospace; font-size:11.5px; letter-spacing:0.08em;
    text-transform:uppercase; color:var(--ink-faint); margin-bottom:18px; display:block;
  }
  .type-card h3{ font-size:21px; margin-bottom:12px; }
  .type-card p{ font-size:14px; margin-bottom:18px; }
  .type-feats{ display:flex; flex-direction:column; gap:8px; }
  .type-feats span{
    font-size:13px; color:var(--ink-dim); display:flex; gap:8px; align-items:flex-start;
  }
  .type-feats span::before{ content:'✦'; color:var(--gold); font-size:10px; margin-top:3px; }

  /* ---------- CREDITS ---------- */
  .credits{ background:var(--bg-soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .credits-grid{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
  table.credit-table{ width:100%; border-collapse:collapse; font-size:14.5px; }
  table.credit-table th{
    text-align:left; font-family:'JetBrains Mono', monospace; font-size:11.5px;
    letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-faint);
    padding-bottom:14px; border-bottom:1px solid var(--line-bright); font-weight:500;
  }
  table.credit-table td{
    padding:16px 0; border-bottom:1px solid var(--line); color:var(--ink-dim);
  }
  table.credit-table td:last-child{
    text-align:right; font-family:'JetBrains Mono', monospace; color:var(--gold);
  }
  .credit-note{
    margin-top:20px; font-size:13.5px; color:var(--ink-faint); font-family:'JetBrains Mono', monospace;
  }

  /* ---------- WORKED EXAMPLE ---------- */
  .ex-context{
    display:flex; margin-bottom:44px;
    background:var(--bg-card); border:1px solid var(--line); border-radius:14px;
    overflow:hidden;
  }
  .ex-stat{ flex:1; padding:22px 26px; border-right:1px solid var(--line); }
  .ex-stat:last-child{ border-right:none; }
  .ex-stat .lbl{
    font-family:'JetBrains Mono', monospace; font-size:10.5px; letter-spacing:0.08em;
    text-transform:uppercase; color:var(--gold); margin-bottom:8px;
  }
  .ex-stat .val{ font-size:14px; color:var(--ink); line-height:1.45; }

  .ex-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
  .ex-card{
    background:var(--bg-card); border:1px solid var(--line); border-radius:14px;
    padding:26px 24px; display:flex; flex-direction:column;
  }
  .ex-fmt{ display:flex; align-items:center; gap:10px; margin-bottom:18px; }
  .ex-fmt .ico{
    width:30px; height:30px; border-radius:7px; flex-shrink:0; color:var(--gold);
    display:flex; align-items:center; justify-content:center; background:rgba(216,167,61,0.08);
  }
  .ex-fmt .name{
    font-family:'JetBrains Mono', monospace; font-size:12.5px; letter-spacing:0.05em;
    text-transform:uppercase; color:var(--ink);
  }
  .ex-label{
    font-family:'JetBrains Mono', monospace; font-size:10.5px; letter-spacing:0.08em;
    text-transform:uppercase; color:var(--ink-faint); margin:16px 0 8px;
  }
  .ex-label:first-of-type{ margin-top:0; }
  .ex-prompt{
    font-family:'JetBrains Mono', monospace; font-size:12px; color:var(--ink-dim); line-height:1.6;
    background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:12px 14px;
  }
  .ex-caption{
    font-size:13.5px; color:var(--ink-dim); line-height:1.6;
    background:var(--bg); border:1px solid var(--line); border-radius:8px;
    padding:12px 14px; margin-bottom:9px;
  }
  .ex-caption .tag{ color:var(--teal-bright); }
  .ex-taglang{ font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--ink-faint); }
  .ex-visual{
    margin-top:12px; height:150px; border:1px solid var(--line); border-radius:8px;
    overflow:hidden; background:var(--bg-card);
  }
  .ex-visual svg{ display:block; width:100%; height:100%; }
  .ex-visual.trio{ display:flex; gap:7px; padding:0; height:96px; border:none; background:none; }
  .ex-visual.trio .slide{
    flex:1; border-radius:6px; overflow:hidden; border:1px solid var(--line);
  }
  .ex-visual.trio .slide svg{ display:block; width:100%; height:100%; }
  .ex-beats{ display:flex; flex-direction:column; gap:8px; margin-top:2px; }
  .ex-beat{ display:flex; gap:10px; font-size:12.5px; color:var(--ink-dim); }
  .ex-beat .t{ font-family:'JetBrains Mono', monospace; color:var(--gold); flex-shrink:0; width:48px; }
  .ex-note{
    margin-top:34px; text-align:center;
    font-family:'JetBrains Mono', monospace; font-size:11.5px; color:var(--ink-faint);
  }
  @media (max-width: 880px){
    .ex-context{ flex-direction:column; }
    .ex-stat{ border-right:none; border-bottom:1px solid var(--line); }
    .ex-stat:last-child{ border-bottom:none; }
    .ex-grid{ grid-template-columns:1fr; }
  }

  /* ---------- PRICING ---------- */
  .price-banner{
    display:inline-flex; align-items:center; gap:8px;
    font-family:'JetBrains Mono', monospace; font-size:11.5px; letter-spacing:0.04em;
    color:var(--gold);
    border:1px dashed var(--gold);
    border-radius:20px;
    padding:7px 14px;
    margin-bottom:20px;
  }
  .price-banner::before{ content:'●'; font-size:8px; }
  .price-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; align-items:stretch; }
  .price-card{
    background:var(--bg-card); border:1px solid var(--line); border-radius:14px;
    padding:32px 28px; display:flex; flex-direction:column;
    transition:border-color .25s ease, transform .25s ease;
  }
  .price-card:hover{ transform:translateY(-4px); border-color:var(--line-bright); }
  .price-card.featured{ border-color:var(--clay); position:relative; }
  .price-card.featured::before{
    content:'Suggested'; position:absolute; top:-11px; left:28px;
    background:var(--clay); color:#1A1410;
    font-family:'JetBrains Mono', monospace; font-size:10px; letter-spacing:0.06em; text-transform:uppercase;
    padding:4px 10px; border-radius:20px; font-weight:600;
  }
  .price-tag{
    font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase;
    color:var(--ink-faint); margin-bottom:16px;
  }
  .price-tier{ font-size:20px; margin-bottom:14px; }
  .price-amount{ display:flex; align-items:baseline; gap:6px; margin-bottom:6px; }
  .price-amount .num{ font-family:'Fraunces', serif; font-weight:700; font-size:38px; color:var(--ink); }
  .price-amount .num.tbd{
    font-family:'JetBrains Mono', monospace; font-size:22px; color:var(--ink-faint);
    border:1px dashed var(--line-bright); border-radius:6px; padding:4px 12px;
  }
  .price-amount .period{ font-family:'JetBrains Mono', monospace; font-size:12.5px; color:var(--ink-faint); }
  .price-desc{ font-size:13.5px; color:var(--ink-dim); margin-bottom:22px; min-height:36px; }
  .price-feats{ display:flex; flex-direction:column; gap:10px; margin-bottom:28px; flex-grow:1; }
  .price-feats span{ font-size:13.5px; color:var(--ink-dim); display:flex; gap:9px; align-items:flex-start; }
  .price-feats span::before{ content:'✓'; color:var(--teal-bright); font-size:12px; margin-top:2px; }
  .price-feats span.tbd::before{ content:'?'; color:var(--ink-faint); }
  .price-feats span.tbd{ color:var(--ink-faint); }
  .price-cta{ width:100%; justify-content:center; text-align:center; }

  /* ---------- HONEST ---------- */
  .honest-list{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px 40px; margin-top:8px; }
  .honest-list div{
    display:flex; gap:12px; font-size:14.5px; color:var(--ink-dim); align-items:flex-start;
    padding:16px 0; border-top:1px solid var(--line);
  }
  .honest-list div::before{ content:'✕'; color:var(--ink-faint); font-size:13px; margin-top:2px; }

  /* ---------- CTA ---------- */
  .cta-section{
    text-align:center; padding:130px 0 150px;
    position:relative;
  }
  .cta-section h2{ font-size:clamp(32px,4.6vw,54px); max-width:720px; margin:22px auto 34px; line-height:1.1; }
  .cta-section .eyebrow{ justify-content:center; }
  .cta-section .eyebrow::before{ display:none; }
  .cta-btns{ display:flex; gap:14px; justify-content:center; }

  footer{
    border-top:1px solid var(--line);
    padding:36px 0; display:flex; justify-content:space-between; align-items:center;
    font-size:13px; color:var(--ink-faint);
  }

  @media (max-width: 880px){
    .process-rail{ grid-template-columns:1fr 1fr; row-gap:40px; }
    .process-rail::before{ display:none; }
    .ws-grid, .credits-grid{ grid-template-columns:1fr; }
    .type-grid{ grid-template-columns:1fr; }
    .price-grid{ grid-template-columns:1fr; }
    .honest-list{ grid-template-columns:1fr; }
    .hero-inner{ max-width:100%; }
    .hero::after{ background:linear-gradient(180deg, rgba(23,18,14,0.2) 0%, var(--bg) 78%); }
    /* mobile links controlled by .nav-links.is-open */
  }
  @media (prefers-reduced-motion: reduce){
    .reveal{ transition:none; opacity:1; transform:none; }
    html{ scroll-behavior:auto; }
    .cal-today-badge{ animation:none; }
    .showcase-card:hover, .plat-card:hover, .cal-day:hover{ transform:none; }
    .showcase-card:hover .showcase-media img{ transform:none; }
  }

/* ---------- MARKETING SITE EXTRAS ---------- */
.nav-toggle{
  display:none; background:transparent; border:1px solid var(--line-bright);
  color:var(--ink); border-radius:7px; padding:8px 12px; cursor:pointer;
  font-family:var(--font-body, 'Space Grotesk', sans-serif); font-size:13px; font-weight:600;
}
.nav-toggle:focus-visible, .btn:focus-visible, a:focus-visible, .nav-links a:focus-visible{
  outline:2px solid var(--gold); outline-offset:2px;
}
@media (max-width: 880px){
  .nav-toggle{ display:inline-flex; }
  .nav-links{
    display:none; position:absolute; top:100%; left:0; right:0;
    flex-direction:column; align-items:stretch; gap:0;
    background:rgba(23,18,14,0.96); backdrop-filter:blur(12px);
    border-bottom:1px solid var(--line); padding:12px 20px 20px;
  }
  .nav-links.is-open{ display:flex; }
  .nav-links .link{ display:block; padding:14px 4px; border-bottom:1px solid var(--line); }
  .nav-links .btn{ justify-content:center; margin-top:12px; }
}
nav{ position:relative; }
.skip-link{
  position:absolute; left:-9999px; top:8px; z-index:200;
  background:var(--clay); color:#1A1410; padding:10px 16px; border-radius:7px; font-weight:600;
}
.skip-link:focus{ left:16px; }

/* Solution pages */
.sol-hero{ padding:140px 0 80px; border-bottom:1px solid var(--line); }
.sol-hero h1{ font-size:clamp(34px, 4.8vw, 52px); line-height:1.08; margin:18px 0 20px; max-width:720px; }
.sol-hero .lede{ font-size:17px; max-width:540px; margin-bottom:28px; }
.sol-meta{
  display:flex; flex-wrap:wrap; gap:10px; margin-bottom:22px;
}
.sol-chip{
  font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.06em; text-transform:uppercase;
  padding:6px 12px; border-radius:20px; border:1px solid var(--line-bright); color:var(--ink-dim);
}
.sol-chip.on{ border-color:var(--gold); color:var(--gold); }
.benefit-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }
.benefit-card{
  background:var(--bg-card); border:1px solid var(--line); border-radius:14px; padding:26px 24px;
}
.benefit-card h3{ font-size:19px; margin-bottom:10px; }
.benefit-card p{ font-size:14.5px; }
.sol-steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.sol-step{
  background:var(--bg-card); border:1px solid var(--line); border-radius:14px; padding:24px 20px;
}
.sol-step .n{
  font-family:'JetBrains Mono', monospace; font-size:12px; color:var(--gold); letter-spacing:0.08em;
  margin-bottom:14px;
}
.sol-step h3{ font-size:17px; margin-bottom:8px; }
.sol-step p{ font-size:13.5px; }
.example-panel{
  background:var(--bg-card); border:1px solid var(--line); border-radius:14px; padding:32px 28px;
}
.example-panel .ex-grid-inline{ display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:22px; }
.example-panel .label{
  font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--gold); margin-bottom:8px;
}
.example-panel .box{
  background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:14px 16px;
  font-size:14px; color:var(--ink-dim); line-height:1.6;
}
.sol-cta-band{
  background:var(--bg-soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  text-align:center; padding:90px 0;
}
.sol-cta-band h2{ font-size:clamp(28px, 3.6vw, 40px); margin:16px auto 24px; max-width:640px; line-height:1.14; }
.other-types{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.other-types a{
  display:block; background:var(--bg-card); border:1px solid var(--line); border-radius:12px;
  padding:20px 18px; transition:border-color .2s ease, transform .2s ease;
}
.other-types a:hover{ border-color:var(--line-bright); transform:translateY(-2px); }
.other-types .t{ font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--gold); letter-spacing:0.06em; text-transform:uppercase; margin-bottom:8px; }
.other-types h3{ font-size:17px; margin-bottom:6px; }
.other-types p{ font-size:13.5px; }
.auth-loading{
  position:fixed; inset:0; z-index:999; display:flex; align-items:center; justify-content:center;
  background:rgba(23,18,14,0.88); color:var(--ink); font-size:15px;
}
.auth-loading[hidden]{ display:none !important; }
.landing-signin-note{ margin-top:16px; font-size:14px; color:var(--ink-dim); }
.landing-signin-note a{ color:var(--gold); text-decoration:underline; }
@media (max-width: 880px){
  .benefit-grid, .sol-steps, .other-types, .example-panel .ex-grid-inline{ grid-template-columns:1fr; }
  .sol-hero{ padding:120px 0 56px; }
}

.type-grid-4{ grid-template-columns:repeat(2,1fr); }
@media (max-width:880px){ .type-grid-4{ grid-template-columns:1fr; } }

.type-card{ overflow:hidden; padding:0 0 26px; }
.type-card .type-shot{
  display:block; width:100%; aspect-ratio:16/10; object-fit:cover;
  border-bottom:1px solid var(--line); margin-bottom:18px;
}
.type-card .type-tag,
.type-card h3,
.type-card p,
.type-card .type-feats{ padding-left:26px; padding-right:26px; }
.type-card .type-tag{ margin-top:4px; }

/* ---------- PHOTO HERO + PROCESS SHOTS ---------- */
.hero.hero-photo{
  min-height:auto;
  padding:120px 0 72px;
  align-items:stretch;
  overflow:visible;
}
.hero.hero-photo::after{ display:none; }
.hero-photo-grid{
  position:relative; z-index:2;
  display:grid; grid-template-columns:1fr 1.05fr; gap:48px; align-items:center;
  width:100%; max-width:1160px; margin:0 auto; padding:0 32px;
}
.hero.hero-photo .hero-inner{ max-width:none; }
.hero-visual{
  position:relative;
  border-radius:16px; overflow:hidden;
  border:1px solid var(--line-bright);
  box-shadow:0 40px 80px -30px rgba(0,0,0,0.65);
  aspect-ratio:16/10; background:var(--bg-card);
}
.hero-visual img{
  display:block; width:100%; height:100%; object-fit:cover;
}
.hero-visual-caption{
  position:absolute; left:14px; bottom:14px; right:14px;
  font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.04em;
  color:var(--ink); background:rgba(23,18,14,0.78); backdrop-filter:blur(6px);
  border:1px solid var(--line); border-radius:8px; padding:8px 12px;
}
.p-step .step-shot,
.sol-step .step-shot{
  display:block; width:100%; aspect-ratio:4/3; object-fit:cover;
  border-radius:10px; border:1px solid var(--line);
  margin:0 0 18px; background:var(--bg);
}
.p-step{ padding-right:18px; }
.p-step .p-num{ margin-bottom:14px; }
.process-rail.has-shots::before{ display:none; }

.sol-hero-grid{
  display:grid; grid-template-columns:1.05fr 1fr; gap:48px; align-items:center;
}
.sol-hero-visual{
  border-radius:16px; overflow:hidden;
  border:1px solid var(--line);
  box-shadow:0 32px 60px -28px rgba(0,0,0,0.55);
  aspect-ratio:16/10; background:var(--bg-card);
}
.sol-hero-visual img{ display:block; width:100%; height:100%; object-fit:cover; }
.sol-step{ padding:0 0 20px; overflow:hidden; }
.sol-step .step-shot{ margin:0 0 16px; border-radius:14px 14px 0 0; border:none; border-bottom:1px solid var(--line); }
.sol-step .n, .sol-step h3, .sol-step p{ padding-left:18px; padding-right:18px; }
.sol-step .n{ margin-top:4px; }

@media (max-width: 880px){
  .hero-photo-grid, .sol-hero-grid{ grid-template-columns:1fr; gap:28px; padding:0 20px; }
  .hero.hero-photo{ padding:100px 0 48px; }
  .hero-visual{ aspect-ratio:16/11; }
  .sol-hero .wrap{ padding:0; }
  .sol-hero-grid{ padding:0 20px; }
  .process-rail{ grid-template-columns:1fr; }
}

/* Problem · Value · Return */
.sol-example-line{
  font-size:14px; color:var(--ink-dim); margin:-8px 0 22px; max-width:520px;
}
.sol-example-line strong{ color:var(--ink); font-weight:600; }
.pvr-section{ background:var(--bg-soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.pvr-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.pvr-card{
  background:var(--bg-card); border:1px solid var(--line); border-radius:14px; padding:28px 24px;
}
.pvr-kicker{
  font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--gold); margin-bottom:14px;
}
.pvr-card h3{ font-size:20px; margin-bottom:12px; }
.pvr-card p{ font-size:14.5px; }
.pvr-problem{ border-top:3px solid #7C7160; }
.pvr-value{ border-top:3px solid var(--clay); }
.pvr-return{ border-top:3px solid var(--teal-bright); }
.pvr-metrics{ list-style:none; margin:16px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; }
.pvr-metrics li{
  font-size:13.5px; color:var(--ink-dim); display:flex; gap:8px; align-items:flex-start;
}
.pvr-metrics li::before{ content:'→'; color:var(--teal-bright); flex-shrink:0; }

/* Result sample posts */
.results-section{ padding-top:100px; }
.result-posts{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.result-post{
  background:var(--bg-card); border:1px solid var(--line); border-radius:14px; overflow:hidden;
  display:flex; flex-direction:column;
}
.result-post-media{ position:relative; aspect-ratio:16/11; background:var(--bg); }
.result-post-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.result-fmt{
  position:absolute; top:12px; left:12px;
  font-family:'JetBrains Mono', monospace; font-size:10px; letter-spacing:0.08em; text-transform:uppercase;
  background:var(--clay); color:#1A1410; padding:5px 10px; border-radius:20px; font-weight:600;
}
.result-post-body{ padding:18px 18px 22px; }
.result-label{
  font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--gold); margin-bottom:10px;
}
.result-caption{ font-size:14px; color:var(--ink-dim); line-height:1.55; margin-bottom:10px; white-space:normal; }
.result-am{ font-family:'JetBrains Mono', 'Noto Sans Ethiopic', monospace; font-size:12px; color:var(--teal-bright); }
.result-reel{
  margin-top:12px; padding-top:12px; border-top:1px solid var(--line);
  font-size:12.5px; color:var(--ink-dim); line-height:1.5;
}
.result-reel span{
  display:block; font-family:'JetBrains Mono', monospace; font-size:10px;
  letter-spacing:0.06em; text-transform:uppercase; color:var(--gold); margin-bottom:6px;
}
.result-post-media{ aspect-ratio:1; }

@media (max-width: 880px){
  .pvr-grid, .result-posts{ grid-template-columns:1fr; }
}

/* ---------- SOLUTION CASE STUDY ---------- */
.story-band{ background:var(--bg-soft); border-bottom:1px solid var(--line); }
.story-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:14px;
}
.story-card{
  background:var(--bg-card); border:1px solid var(--line); border-radius:12px; padding:18px 16px;
}
.story-card span{
  display:block; font-family:'JetBrains Mono', monospace; font-size:10.5px; letter-spacing:0.07em;
  text-transform:uppercase; color:var(--gold); margin-bottom:8px;
}
.story-card strong{ display:block; font-size:15px; font-weight:600; color:var(--ink); line-height:1.35; }

/* Interactive calendar — day select → plan panel */
.calendar-section{
  padding:90px 0 70px;
  background:radial-gradient(1200px 500px at 70% 0%, rgba(216,167,61,0.08), transparent 60%), var(--bg);
}
.cal-interactive{
  display:grid; grid-template-columns:minmax(0,1.15fr) minmax(280px,0.85fr); gap:28px; align-items:start;
}
.cal-board-wrap{ min-width:0; }
.cal-legend{
  display:flex; flex-wrap:wrap; gap:18px; margin:0 0 18px;
  font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--ink-faint);
}
.cal-legend span{ display:inline-flex; align-items:center; gap:7px; }
.cal-legend i{ width:8px; height:8px; border-radius:50%; display:inline-block; }
.cal-legend i.planned{ background:#4A4136; border:1px solid var(--line-bright); }
.cal-legend i.ready{ background:var(--gold); box-shadow:0 0 12px rgba(216,167,61,0.45); }
.cal-legend i.posted{ background:var(--teal-bright); }
.cal-legend i.today{
  background:var(--gold); outline:2px solid rgba(216,167,61,0.35); outline-offset:2px;
}
.cal-board{
  display:grid; grid-template-columns:repeat(6,1fr); gap:8px;
}
.cal-day{
  appearance:none; border:1px solid var(--line); background:var(--bg-card);
  border-radius:12px; padding:12px 10px 14px; text-align:left; color:inherit;
  cursor:pointer; min-height:88px; position:relative; overflow:hidden;
  transition:transform .28s cubic-bezier(.2,.7,.2,1), border-color .25s ease, box-shadow .3s ease, background .2s ease;
}
.cal-day:hover{
  transform:translateY(-2px); border-color:var(--line-bright);
  box-shadow:0 14px 28px -20px rgba(0,0,0,0.65);
}
.cal-day:focus-visible{
  outline:2px solid var(--gold); outline-offset:2px;
}
.cal-day.is-selected{
  border-color:rgba(216,167,61,0.7);
  background:linear-gradient(180deg, rgba(216,167,61,0.12), var(--bg-card) 55%);
  box-shadow:0 0 0 1px rgba(216,167,61,0.28), 0 16px 32px -22px rgba(216,167,61,0.55);
}
.cal-n{
  font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--ink-faint);
  display:flex; align-items:center; gap:6px; margin-bottom:8px;
}
.cal-n em{
  font-style:normal; font-size:9px; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--bg); background:var(--gold); padding:2px 6px; border-radius:999px;
}
.cal-label{
  font-size:12.5px; color:var(--ink-dim); line-height:1.35; display:block; font-weight:500;
}
.cal-dot{
  position:absolute; left:10px; right:10px; bottom:0; height:3px; border-radius:3px 3px 0 0;
}
.cal-planned .cal-dot{ background:#4A4136; }
.cal-ready{ border-color:rgba(216,167,61,0.3); }
.cal-ready .cal-dot{ background:var(--gold); }
.cal-ready .cal-label{ color:var(--ink); }
.cal-posted .cal-dot{ background:var(--teal-bright); }
.cal-today-cell{ border-color:rgba(216,167,61,0.5); }
.cal-today-badge{
  font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.06em; text-transform:uppercase;
  background:var(--gold); color:var(--bg); padding:8px 12px; border-radius:999px; font-weight:600;
  animation:calReadyGlow 2.2s ease-in-out infinite;
}
@keyframes calReadyGlow{
  0%,100%{ box-shadow:0 0 0 0 rgba(216,167,61,0.35); }
  50%{ box-shadow:0 0 0 8px rgba(216,167,61,0); }
}

.cal-plan{
  position:sticky; top:88px;
  border:1px solid rgba(216,167,61,0.35);
  border-radius:18px; padding:22px 22px 20px;
  background:
    linear-gradient(145deg, rgba(216,167,61,0.12), transparent 50%),
    var(--bg-card);
  box-shadow:0 24px 48px -36px rgba(216,167,61,0.45);
  min-height:320px;
}
.cal-plan.is-today{ border-color:rgba(216,167,61,0.55); }
.cal-plan-kicker{
  font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.06em;
  text-transform:uppercase; color:var(--gold); margin-bottom:8px;
}
.cal-plan-title{
  font-family:'Fraunces', serif; font-size:clamp(26px, 2.8vw, 34px);
  line-height:1.15; margin:0 0 10px; color:var(--ink); font-weight:500;
}
.cal-plan-ready{
  font-size:14.5px; color:var(--ink-dim); line-height:1.5; margin:0 0 18px;
}
.cal-plan-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:16px;
}
.cal-plan-cell{
  border:1px solid var(--line); border-radius:12px; padding:10px 12px; background:rgba(0,0,0,0.12);
}
.cal-plan-cell span{
  display:block; font-family:'JetBrains Mono', monospace; font-size:10px; letter-spacing:0.06em;
  text-transform:uppercase; color:var(--ink-faint); margin-bottom:4px;
}
.cal-plan-cell strong{ font-size:13.5px; color:var(--ink); font-weight:600; }
.cal-plan-block{ margin-bottom:14px; }
.cal-plan-block > span{
  display:block; font-family:'JetBrains Mono', monospace; font-size:10.5px; letter-spacing:0.06em;
  text-transform:uppercase; color:var(--ink-faint); margin-bottom:6px;
}
.cal-plan-block p{ margin:0; font-size:14.5px; color:var(--ink-dim); line-height:1.5; }
.cal-plan-caption{
  font-size:13.5px !important; white-space:normal;
  max-height:9.5em; overflow:auto; padding-right:4px;
}
.cal-plan-foot{
  display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:18px 0 10px;
}
.cal-plan-cta{
  font-family:'JetBrains Mono', monospace; font-size:12px; color:var(--clay-bright);
}
.cal-plan-hint{
  margin:0; font-size:12.5px; color:var(--ink-faint); line-height:1.4;
}

/* Big created content */
.created-section{
  padding:100px 0 80px;
  background:var(--bg-soft);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.showcase-grid{
  display:grid; grid-template-columns:1.05fr 1.05fr; gap:22px; margin-bottom:8px;
}
.showcase-card{
  background:var(--bg-card); border:1px solid var(--line); border-radius:18px; overflow:hidden;
  transition:transform .35s cubic-bezier(.2,.7,.2,1), border-color .25s ease;
}
.showcase-card:hover{ transform:translateY(-6px); border-color:var(--line-bright); }
.showcase-media{
  position:relative; aspect-ratio:1; background:var(--bg); overflow:hidden;
}
.showcase-media img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .7s cubic-bezier(.2,.7,.2,1);
}
.showcase-card:hover .showcase-media img{ transform:scale(1.04); }
.showcase-badge{
  position:absolute; left:14px; bottom:14px;
  font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.05em;
  background:rgba(23,18,14,0.88); color:var(--gold); border:1px solid var(--line-bright);
  padding:7px 12px; border-radius:999px; backdrop-filter:blur(6px);
}
.showcase-body{ padding:20px 22px 24px; }
.showcase-plat{
  font-family:'JetBrains Mono', monospace; font-size:12px; letter-spacing:0.06em;
  text-transform:uppercase; color:var(--clay-bright); margin-bottom:10px;
}
.showcase-caption{
  font-size:16px; color:var(--ink); line-height:1.55; margin:0; font-weight:500;
}

.plat-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.plat-grid-lg{ grid-template-columns:repeat(4,1fr); }
.plat-card{
  background:var(--bg-card); border:1px solid var(--line); border-radius:14px; overflow:hidden;
  display:flex; flex-direction:column;
  transition:transform .3s ease, border-color .25s ease;
}
.plat-card:hover{ transform:translateY(-4px); border-color:var(--line-bright); }
.plat-card-lg .plat-card-media{ aspect-ratio:1; max-height:none; }
.plat-card-media{ background:var(--bg); aspect-ratio:1; }
.plat-card-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.plat-card-body{ padding:14px 16px 18px; }
.plat-meta{ display:flex; justify-content:space-between; gap:8px; align-items:center; margin-bottom:8px; flex-wrap:wrap; }
.plat-name{ font-family:'JetBrains Mono', monospace; font-size:12px; letter-spacing:0.04em; color:var(--ink); font-weight:600; }
.plat-fmt{
  font-family:'JetBrains Mono', monospace; font-size:10.5px; color:var(--bg);
  background:var(--gold); padding:3px 8px; border-radius:12px;
}
.plat-caption{ font-size:13.5px; color:var(--ink-dim); line-height:1.5; margin:0; }

.timing-section{ padding:70px 0; }
.time-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:12px; }
.time-cell{
  background:var(--bg-card); border:1px solid var(--line); border-radius:12px; padding:16px 14px; text-align:center;
}
.time-cell span{
  display:block; font-family:'JetBrains Mono', monospace; font-size:10.5px; letter-spacing:0.06em;
  text-transform:uppercase; color:var(--ink-faint); margin-bottom:8px;
}
.time-cell strong{ font-family:'Fraunces', serif; font-size:22px; color:var(--ink); }
.time-cell.time-total{ border-color:var(--clay); }
.time-cell.time-total strong{ color:var(--clay-bright); }

/* Influencer: keep hero compact */
.sol-page-influencer .sol-hero-visual{
  max-width:480px; margin-left:auto; aspect-ratio:4/3;
}
.sol-page-influencer .sol-hero{ padding:120px 0 56px; }
.sol-page-influencer .showcase-grid{ grid-template-columns:1fr 1fr; }

@media (max-width: 1100px){
  .cal-board{ grid-template-columns:repeat(5,1fr); }
  .plat-grid-lg{ grid-template-columns:repeat(2,1fr); }
  .cal-interactive{ grid-template-columns:1fr; gap:22px; }
  .cal-plan{ position:relative; top:0; }
}
@media (max-width: 880px){
  .story-grid, .plat-grid, .time-grid, .showcase-grid{ grid-template-columns:1fr 1fr; }
  .cal-board{ grid-template-columns:repeat(3,1fr); }
  .sol-page-influencer .sol-hero-visual{ max-width:100%; }
}
@media (max-width: 560px){
  .story-grid, .plat-grid, .time-grid, .showcase-grid, .plat-grid-lg{ grid-template-columns:1fr; }
  .cal-board{ grid-template-columns:repeat(2,1fr); }
  .cal-day{ min-height:78px; }
}