/* ── PAGE-SPECIFIC ADDITIONS ── */

/* Sticky CTA */
.sticky-cta {
  position: fixed; bottom: 28px; right: 28px; z-index: 800;
  background: var(--g2); color: var(--w);
  font-family: 'Outfit', sans-serif; font-weight: 700; font-size: .8rem;
  letter-spacing: .06em; text-transform: uppercase;
  padding: 13px 22px; border-radius: 100px; border: none;
  cursor: pointer; text-decoration: none;
  display: flex; align-items: center; gap: 8px;
  box-shadow: 0 8px 32px rgba(45,92,45,0.45);
  transform: translateY(80px); opacity: 0;
  transition: transform .4s cubic-bezier(.34,1.56,.64,1), opacity .3s, background .2s;
}
.sticky-cta.visible { transform: translateY(0); opacity: 1; }
.sticky-cta:hover { background: var(--g3); }

/* Ticker strip */
.ticker-wrap {
  background: var(--g2);
  border-top: 1px solid rgba(255,255,255,0.08);
  border-bottom: 1px solid rgba(255,255,255,0.08);
  padding: 14px 0; overflow: hidden;
}
.ticker-track { display: flex; gap: 0; animation: mq 38s linear infinite; width: max-content; }
.ticker-item { display: flex; align-items: center; gap: 10px; padding: 0 40px; white-space: nowrap; border-right: 1px solid rgba(255,255,255,0.1); }
.ticker-item:last-child { border-right: none; }
.ticker-val { font-family: 'Bebas Neue', sans-serif; font-size: 1.1rem; letter-spacing: .04em; color: var(--w); }
.ticker-label { font-family: 'Space Mono', monospace; font-size: .6rem; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,0.5); }

/* Hero quick stats row */
.hero-quick-stats { display: flex; gap: 0; margin-top: 44px; border-top: 1px solid rgba(90,170,90,0.15); padding-top: 36px; }
.hqs { flex: 1; border-right: 1px solid rgba(90,170,90,0.15); padding-right: 28px; }
.hqs:last-child { border-right: none; padding-right: 0; }
.hqs + .hqs { padding-left: 28px; }
.hqs-n { font-family: 'Bebas Neue', sans-serif; font-size: 2.4rem; letter-spacing: .04em; color: var(--w); line-height: 1; }
.hqs-n em { color: var(--g4); font-style: normal; }
.hqs-l { font-family: 'Space Mono', monospace; font-size: .58rem; letter-spacing: .14em; text-transform: uppercase; color: var(--w40); margin-top: 5px; }

/* Insight / Why grid — 2 col on white bg */
.insight-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 40px; }

/* How-it-works vertical steps — white bg variant */
.how-steps { display: flex; flex-direction: column; gap: 0; margin-top: 40px; position: relative; }
.how-steps::before { content: ''; position: absolute; left: 24px; top: 24px; bottom: 24px; width: 1px; background: linear-gradient(180deg, var(--g3) 0%, rgba(45,92,45,0.1) 100%); }
.how-step { display: grid; grid-template-columns: 48px 1fr; gap: 24px; padding-bottom: 28px; position: relative; }
.how-step:last-child { padding-bottom: 0; }
.hs-dot { width: 48px; height: 48px; border-radius: 10px; background: var(--w); border: 1px solid rgba(45,92,45,0.15); display: flex; align-items: center; justify-content: center; flex-shrink: 0; z-index: 1; position: relative; font-family: 'Bebas Neue', sans-serif; font-size: 1.1rem; letter-spacing: .04em; color: var(--g2); transition: .3s var(--ease); box-shadow: 0 4px 16px rgba(13,26,13,0.1); }
.how-step:hover .hs-dot { background: var(--g2); color: var(--w); border-color: var(--g2); box-shadow: 0 8px 28px rgba(45,92,45,0.35); }
.hs-body { padding-top: 8px; }
.hs-body h4 { font-size: 1rem; font-weight: 700; color: var(--ink); margin-bottom: 5px; }
.hs-body p { font-size: .84rem; color: rgba(13,26,13,0.55); line-height: 1.65; }

/* Three channels — card grid */
.channels-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 40px; }

/* Tags inside cards */
.tag-row { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }

/* Deliverables grid */
.del-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: 40px; }
.del { background: var(--w); border: 1px solid rgba(45,92,45,0.1); border-radius: 10px; padding: 18px 20px; display: flex; align-items: flex-start; gap: 14px; transition: .35s var(--ease); position: relative; overflow: hidden; }
.del::after { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg,var(--g2),var(--g4)); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease); }
.del:hover { transform: translateY(-3px); box-shadow: 0 12px 36px rgba(13,26,13,0.08); border-color: rgba(45,92,45,0.22); }
.del:hover::after { transform: scaleX(1); }
.del-check { width: 22px; height: 22px; border-radius: 6px; flex-shrink: 0; background: rgba(45,92,45,0.08); border: 1px solid rgba(45,92,45,0.18); display: flex; align-items: center; justify-content: center; color: var(--g3); font-size: .75rem; font-weight: 700; margin-top: 1px; }
.del h5 { font-size: .9rem; font-weight: 700; color: var(--ink); margin-bottom: 4px; }
.del p { font-size: .8rem; color: rgba(13,26,13,0.55); line-height: 1.55; }

/* Guarantees — dark green section */
.g-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; margin-top: 40px; }
.g-card { background: rgba(255,255,255,0.04); border: 1px solid rgba(90,170,90,0.15); border-radius: 14px; padding: 32px; position: relative; overflow: hidden; transition: .4s var(--ease); }
.g-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg,var(--g3),var(--g5)); transform: scaleX(0); transform-origin: left; transition: transform .4s var(--ease); }
.g-card:hover { background: rgba(255,255,255,0.07); border-color: rgba(90,170,90,0.3); transform: translateY(-4px); box-shadow: 0 20px 60px rgba(0,0,0,0.3); }
.g-card:hover::before { transform: scaleX(1); }
.g-icon { width: 48px; height: 48px; border-radius: 10px; background: rgba(90,170,90,0.1); border: 1px solid rgba(90,170,90,0.2); display: flex; align-items: center; justify-content: center; font-size: 1.3rem; margin-bottom: 18px; }
.g-title { font-family: 'Outfit', sans-serif; font-size: 1rem; font-weight: 700; color: var(--w); margin-bottom: 10px; line-height: 1.3; }
.g-desc { font-size: .875rem; color: var(--w60); line-height: 1.7; margin-bottom: 14px; }
.g-line { font-family: 'Space Mono', monospace; font-size: .62rem; letter-spacing: .06em; color: var(--g5); padding-top: 14px; border-top: 1px solid rgba(90,170,90,0.12); display: flex; align-items: flex-start; gap: 8px; }
.g-line::before { content: '→'; color: var(--g4); flex-shrink: 0; }

/* Takeaway line inside insight cards */
.takeaway { font-size: .82rem; font-weight: 600; color: var(--g2); padding-top: 12px; border-top: 1px solid rgba(45,92,45,0.1); margin-top: 2px; }

@media(max-width: 960px) {
  .insight-grid, .del-grid, .g-grid { grid-template-columns: 1fr; }
  .channels-grid { grid-template-columns: 1fr; }
  .hero-quick-stats { flex-wrap: wrap; }
  .hqs { flex: 0 0 50%; border-right: none; padding-bottom: 16px; border-bottom: 1px solid rgba(90,170,90,0.15); }
  .hqs + .hqs { padding-left: 0; }
  .hqs:nth-child(odd) { padding-right: 16px; }
  .hqs:nth-last-child(-n+2) { border-bottom: none; padding-bottom: 0; }
}
@media(max-width: 680px) {
  .hero-quick-stats { flex-direction: column; }
  .hqs { flex: 0 0 100%; border-bottom: 1px solid rgba(90,170,90,0.15); padding: 14px 0 !important; }
  .hqs:last-child { border-bottom: none; }
  .insight-grid, .channels-grid { grid-template-columns: 1fr; }
  .how-steps::before { left: 23px; }
}
/* Services nav dropdown */
.nav-dd{position:relative}
.nav-dd>a{display:inline-flex;align-items:center;gap:5px}
.nav-dd>a .ddcaret{font-size:.6em;transition:transform .3s cubic-bezier(0.16,1,0.3,1);opacity:.7}
.nav-dd:hover>a .ddcaret{transform:rotate(180deg)}
.nav-ddmenu{position:absolute;top:100%;left:0;min-width:300px;background:rgba(13,26,13,0.96);backdrop-filter:blur(20px);border:1px solid rgba(90,170,90,0.18);border-radius:14px;padding:10px;margin-top:10px;opacity:0;visibility:hidden;transform:translateY(8px);transition:all .3s cubic-bezier(0.16,1,0.3,1);box-shadow:0 24px 60px rgba(13,26,13,0.45);z-index:1001}
.nav-dd:hover .nav-ddmenu,.nav-dd:focus-within .nav-ddmenu{opacity:1;visibility:visible;transform:translateY(0)}
.nav-ddmenu::before{content:"";position:absolute;top:-10px;left:0;right:0;height:10px}
.nav-ddmenu a{display:block;padding:11px 14px;border-radius:9px;text-decoration:none;color:rgba(255,255,255,0.82);transition:background .2s cubic-bezier(0.16,1,0.3,1)}
.nav-ddmenu a:hover{background:rgba(90,170,90,0.14)}
.nav-ddmenu a .ddt{display:block;font-family:'Outfit',sans-serif;font-weight:600;font-size:.86rem;color:#fff;line-height:1.2}
.nav-ddmenu a .dds{display:block;font-family:'Space Mono',monospace;font-size:.58rem;letter-spacing:.06em;color:rgba(138,204,138,0.7);margin-top:3px;text-transform:uppercase}
.nav-ddmenu .ddsep{height:1px;background:rgba(90,170,90,0.14);margin:8px 6px}
/* Mobile services submenu */
.mob-sub{display:none;flex-direction:column;padding-left:14px;margin:2px 0 8px;border-left:2px solid rgba(90,170,90,0.25)}
.mob-sub.open{display:flex}
.mob-svc-toggle{display:inline-flex;align-items:center;gap:6px;cursor:pointer;background:none;border:none;font:inherit;color:inherit;padding:0}
.mob-svc-toggle .mc{transition:transform .3s cubic-bezier(0.16,1,0.3,1);font-size:.7em}
.mob-svc-toggle.open .mc{transform:rotate(180deg)}
.mob-sub a{font-size:.92rem!important;opacity:.85}
/* Fix Products & Services heading */

.nav-ddmenu .ddtitle{
    display:block !important;
    padding:14px 24px 10px !important;
    width:100%;
}

.nav-ddmenu .ddtitle span{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;

    padding:8px 18px !important;

    background:rgba(97,191,87,.12) !important;
    border:1px solid rgba(97,191,87,.25) !important;
    border-radius:999px !important;

    color:#71d364 !important;

    font-size:11px !important;
    font-weight:700 !important;
    letter-spacing:2px !important;
    text-transform:uppercase !important;

    visibility:visible !important;
    opacity:1 !important;
    position:relative !important;
    z-index:999 !important;
}

.nav-ddmenu .ddsep{
    display:block !important;
}
/* ==========================
   CHALLENGE SECTION
========================== */

.challenge-section{
    padding:120px 0;
    background:#fbfcf8;
}

.challenge-container{
    width:90%;
    max-width:1400px;
    margin:auto;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:90px;
}

.challenge-left{
    width:58%;
}

.challenge-left .eyebrow{
    color:#5ea34f;
    text-transform:uppercase;
    letter-spacing:4px;
    font-size:13px;
    margin-bottom:18px;
}

.challenge-left h2{
    font-size:95px;
    line-height:.9;
    font-weight:900;
    color:#081108;
    margin:0 0 30px;
}

.challenge-left h2 span{
    color:#2d6d32;
}

.challenge-left p{
    max-width:650px;
    font-size:18px;
    line-height:1.9;
    color:#5f6763;
}

/* RIGHT */

.challenge-right{
    width:42%;
    display:flex;
    justify-content:center;
}

.timeline{

    width:100%;
    max-width:420px;

    position:relative;
}

.timeline::before{

    content:"";

    position:absolute;

    left:16px;

    top:15px;

    bottom:15px;

    width:2px;

    background:#d8e8d7;
}

.step{

    position:relative;

    padding-left:55px;

    margin-bottom:42px;
}

.step:last-child{
    margin-bottom:0;
}

.step::before{

    content:"";

    position:absolute;

    left:8px;

    top:5px;

    width:18px;

    height:18px;

    border-radius:50%;

    background:#59c65a;

    border:5px solid #edf7ec;
}

.step h4{

    margin:0;

    font-size:24px;

    color:#081108;

    font-weight:700;
}

.step p{

    margin-top:8px;

    color:#6b736f;

    line-height:1.7;

    font-size:15px;
}

.lost::before{
    background:#e64f4f;
}

@media(max-width:991px){

.challenge-container{
    flex-direction:column;
    gap:60px;
}

.challenge-left,
.challenge-right{
    width:100%;
}

.challenge-left h2{
    font-size:58px;
}

.timeline{
    max-width:100%;
}

}

/* =========================================
   PRODUCT TIERS + CATALOGUE  (added)
========================================= */

/* ---- Dropdown: 3-tier menu (uses existing .nav-ddmenu base) ---- */
.nav-ddmenu .ddbadge{
  display:inline-block;margin-left:8px;padding:2px 7px;border-radius:999px;
  font-family:'Space Mono',monospace;font-size:.52rem;letter-spacing:.08em;
  color:var(--g5);background:rgba(90,170,90,.14);border:1px solid rgba(90,170,90,.26);
}

/* ---- Tier landing cards ---- */
.tier-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:44px}
.tier-card{
  position:relative;display:flex;flex-direction:column;
  padding:32px 28px 28px;text-decoration:none;color:inherit;
  background:var(--w);border:1px solid rgba(45,92,45,.15);border-radius:16px;
  overflow:hidden;transition:transform .32s var(--ease),border-color .28s,box-shadow .32s var(--ease);
}
.tier-card::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(420px 200px at 100% 0%,rgba(90,170,90,.10),transparent 70%);
  opacity:0;transition:opacity .34s;
}
.tier-card:hover{transform:translateY(-5px);border-color:rgba(90,170,90,.5);box-shadow:0 20px 52px rgba(13,26,13,.1)}
.tier-card:hover::after{opacity:1}
.tier-card:focus-visible{outline:2px solid var(--g3);outline-offset:3px}
.tier-n{
  font-family:'Space Mono',monospace;font-size:.58rem;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(45,92,45,.45);margin-bottom:16px;
}
.tier-card h3{
  font-family:'Bebas Neue',sans-serif;font-size:2.3rem;line-height:1;
  letter-spacing:.02em;color:var(--ink);margin:0 0 6px;
}
.tier-count{
  font-family:'Space Mono',monospace;font-size:.6rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--g2);margin-bottom:16px;
}
.tier-card p{font-size:.86rem;line-height:1.75;color:rgba(13,26,13,.6);margin:0 0 22px;flex:1}
.tier-eg{
  display:flex;flex-direction:column;gap:6px;
  padding-top:18px;margin-bottom:22px;border-top:1px solid rgba(45,92,45,.12);
}
.tier-eg span{
  font-size:.76rem;color:rgba(13,26,13,.55);
  padding-left:14px;position:relative;
}
.tier-eg span::before{
  content:'';position:absolute;left:0;top:.52em;
  width:5px;height:5px;border-radius:50%;background:var(--g4);
}
.tier-go{
  font-family:'Space Mono',monospace;font-size:.62rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--g2);
  display:inline-flex;align-items:center;gap:8px;margin-top:auto;
}
.tier-card:hover .tier-go{gap:13px}
.tier-go span{transition:gap .3s}

/* ---- Category blocks + product cards ---- */
.cat-block{margin-top:70px}
.cat-block:first-of-type{margin-top:0}
.cat-head{
  display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
  padding-bottom:16px;margin-bottom:26px;border-bottom:1px solid rgba(45,92,45,.16);
}
.cat-head h3{
  font-family:'Bebas Neue',sans-serif;font-size:2rem;letter-spacing:.03em;
  color:var(--ink);margin:0;line-height:1;
}
.cat-head .cat-count{
  font-family:'Space Mono',monospace;font-size:.6rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--g3);
  padding:4px 11px;border:1px solid rgba(45,92,45,.25);border-radius:999px;
}
.cat-head p{flex:1 1 320px;margin:0;font-size:.85rem;line-height:1.7;color:rgba(13,26,13,.55)}
.prod-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.prod-card{
  position:relative;display:flex;flex-direction:column;
  padding:24px 22px 22px;background:var(--w);
  border:1px solid rgba(45,92,45,.14);border-radius:14px;
  text-decoration:none;color:inherit;overflow:hidden;
  transition:transform .32s var(--ease),border-color .28s,box-shadow .32s var(--ease);
}
.prod-card::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:2px;
  background:var(--g4);transform:scaleY(0);transform-origin:top;
  transition:transform .34s var(--ease);
}
.prod-card:hover{transform:translateY(-4px);border-color:rgba(90,170,90,.5);box-shadow:0 16px 44px rgba(13,26,13,.09)}
.prod-card:hover::before{transform:scaleY(1)}
.prod-card:focus-visible{outline:2px solid var(--g3);outline-offset:3px}
.prod-num{
  font-family:'Space Mono',monospace;font-size:.58rem;letter-spacing:.14em;
  color:rgba(45,92,45,.45);margin-bottom:12px;
}
.prod-card h4{
  font-family:'Outfit',sans-serif;font-size:1.02rem;font-weight:700;
  line-height:1.3;color:var(--ink);margin:0 0 8px;
}
.prod-card p{font-size:.8rem;line-height:1.65;color:rgba(13,26,13,.6);margin:0 0 16px;flex:1}
.prod-tags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:16px}
.prod-tag{
  font-family:'Space Mono',monospace;font-size:.53rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--g2);
  padding:3px 8px;background:rgba(90,170,90,.1);border-radius:999px;
}
.prod-go{
  font-family:'Space Mono',monospace;font-size:.6rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--g2);
  display:inline-flex;align-items:center;gap:7px;margin-top:auto;
}
.prod-card:hover .prod-go{gap:12px}
.prod-go span{transition:gap .3s}
.prod-card.is-hub{background:linear-gradient(150deg,rgba(90,170,90,.09),rgba(90,170,90,.02));border-color:rgba(90,170,90,.3)}
.prod-card.is-hub .prod-num{color:var(--g2)}

/* ---- Jump nav on tier pages ---- */
.jump-nav{
  display:flex;flex-wrap:wrap;gap:8px;margin-top:36px;
  padding-top:26px;border-top:1px solid rgba(255,255,255,.12);
}
.jump-nav a{
  font-family:'Space Mono',monospace;font-size:.62rem;letter-spacing:.1em;
  text-transform:uppercase;text-decoration:none;color:var(--w80);
  padding:7px 14px;border-radius:999px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  transition:background .2s,border-color .2s,color .2s;
}
.jump-nav a:hover{background:rgba(90,170,90,.2);border-color:var(--g4);color:#fff}

/* ---- Related chips ---- */
.plat-grid{display:flex;flex-wrap:wrap;gap:9px;margin-top:34px}
.plat-chip{
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 16px;border-radius:999px;text-decoration:none;
  font-size:.78rem;font-weight:500;color:var(--w80);
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);
  transition:background .2s,border-color .2s,color .2s;
}
.plat-chip:hover{background:rgba(90,170,90,.18);border-color:var(--g4);color:#fff}

@media(max-width:980px){.tier-grid{grid-template-columns:1fr}}
@media(max-width:900px){.prod-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.prod-grid{grid-template-columns:1fr}.cat-head h3{font-size:1.6rem}}
@media(prefers-reduced-motion:reduce){
  .prod-card,.prod-card::before,.tier-card,.tier-card::after,.prod-go span,.tier-go span{transition:none!important}
  .prod-card:hover,.tier-card:hover{transform:none}
}
