/* Palatehub design system — generated from the approved homepage concept. Edit here for the live site. */
@font-face{font-family:'Manrope';font-weight:500;font-style:normal;font-display:swap;src:url(../font/manrope-500.woff2) format('woff2');}
  @font-face{font-family:'Manrope';font-weight:700;font-style:normal;font-display:swap;src:url(../font/manrope-700.woff2) format('woff2');}
  @font-face{font-family:'Manrope';font-weight:800;font-style:normal;font-display:swap;src:url(../font/manrope-800.woff2) format('woff2');}
  @font-face{font-family:'Inter';font-weight:400;font-style:normal;font-display:swap;src:url(../font/inter-400.woff2) format('woff2');}
  @font-face{font-family:'Inter';font-weight:500;font-style:normal;font-display:swap;src:url(../font/inter-500.woff2) format('woff2');}
  @font-face{font-family:'Inter';font-weight:600;font-style:normal;font-display:swap;src:url(../font/inter-600.woff2) format('woff2');}

  /* ============ Palatehub — Cream Editorial × Signal data ============ */
  :root{
    --bg:#FAF8F1; --surface:#FFFFFF; --surface-2:#F3EFE4; --surface-3:#EFEADD;
    --ink:#1F2E28; --ink-2:#586159; --ink-3:#6B7269;
    --forest:#174D3A; --forest-2:#123D2E; --forest-ink:#F5F2E9; --forest-ink-2:#AEC6B6;
    --green:#6FAE34; --green-2:#5f9a2b; --green-ink:#12331F; --green-bright:#81C141;
    --teal:#159A8C; --teal-2:#0F857A; --teal-text:#0C726A; --gold:#C68A22; --gold-bright:#D6A641;
    --line:rgba(31,46,40,.11); --line-2:rgba(31,46,40,.18);
    --pos:#4c9a2f; --pos-bg:rgba(129,193,65,.16); --info-bg:rgba(21,154,140,.14); --gold-bg:rgba(214,166,65,.18);
    --radius:20px; --radius-md:15px; --radius-sm:11px;
    --shadow-sm:0 1px 2px rgba(23,77,58,.05);
    --shadow:0 1px 2px rgba(23,77,58,.05),0 18px 40px -20px rgba(23,77,58,.22);
    --shadow-lg:0 2px 6px rgba(23,77,58,.06),0 30px 60px -24px rgba(23,77,58,.32);
    --maxw:1180px;
    --f-display:'Manrope',system-ui,sans-serif; --f-body:'Inter',system-ui,sans-serif;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{margin:0; background:var(--bg); color:var(--ink); font-family:var(--f-body); font-size:17px; line-height:1.62; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;}
  h1,h2,h3,h4{font-family:var(--f-display); font-weight:800; line-height:1.07; margin:0; letter-spacing:-.02em; text-wrap:balance;}
  p{margin:0;} a{color:inherit; text-decoration:none;} img{max-width:100%;}
  .wrap{max-width:var(--maxw); margin:0 auto; padding:0 26px;}
  section,#main{scroll-margin-top:128px;}
  .eyebrow{font-weight:600; font-size:12.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--teal-text);}
  .skip{position:absolute; left:-999px; top:0; background:var(--green); color:var(--green-ink); padding:10px 16px; z-index:200; font-weight:600; border-radius:0 0 10px 0;}
  .skip:focus{left:0;}
  :focus-visible{outline:3px solid var(--teal); outline-offset:2px; border-radius:6px;}

  .btn{display:inline-flex; align-items:center; gap:9px; font-family:var(--f-body); font-weight:600; font-size:15px; padding:13px 22px; border-radius:100px; border:1.5px solid transparent; cursor:pointer; transition:transform .15s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease; white-space:nowrap;}
  .btn:hover{transform:translateY(-1px);}
  .btn:active{transform:translateY(0);}
  .btn-primary{background:var(--green); color:var(--green-ink); box-shadow:var(--shadow-sm);}
  .btn-primary:hover{background:var(--green-2); box-shadow:0 12px 24px -10px rgba(111,174,52,.6);}
  .btn-ghost{background:transparent; color:var(--ink); border-color:var(--line-2);}
  .btn-ghost:hover{border-color:var(--ink);}

  /* header */
  header.site{position:sticky; top:0; z-index:100; background:rgba(252,250,244,.82); backdrop-filter:saturate(180%) blur(14px); border-bottom:1px solid var(--line); transition:box-shadow .3s ease,background .3s ease;}
  header.site.scrolled{box-shadow:0 8px 28px -14px rgba(23,77,58,.3); background:rgba(252,250,244,.95);}
  .wrap-h{max-width:1300px; margin:0 auto; padding:0 26px;}
  .nav{display:flex; align-items:center; gap:26px; height:113px; transition:height .3s ease;}
  header.site.scrolled .nav{height:88px;}
  .brand{display:flex; align-items:center;}
  .brand .logo{height:93px; width:auto; display:block; transition:height .3s ease;}
  header.site.scrolled .brand .logo{height:66px;}
  .nav-links{display:flex; gap:2px; margin-left:14px;}
  .nav-links a{font-size:14.5px; font-weight:500; color:var(--ink); opacity:.8; padding:8px 13px; border-radius:9px; transition:opacity .2s,background .2s;}
  .nav-links a:hover{opacity:1; background:var(--surface-2);}
  .nav-links a.active{opacity:1; color:var(--forest);}
  .nav-links a.active::after{content:""; display:block; height:2px; background:var(--green); border-radius:2px; margin-top:5px;}
  .nav-right{margin-left:auto; display:flex; align-items:center; gap:12px;}
  .menu-btn{display:none; width:42px; height:42px; border-radius:11px; background:var(--surface-2); border:1px solid var(--line); color:var(--ink); align-items:center; justify-content:center; cursor:pointer;}

  section{padding:80px 0;}
  .sec-head{max-width:62ch;}
  .sec-head h2{font-size:clamp(28px,3.4vw,42px); margin-top:12px;}
  .sec-head p{margin-top:14px; color:var(--ink-2); font-size:18px;}

  /* hero */
  .hero{position:relative; overflow:hidden; background:
      radial-gradient(55% 55% at 90% 4%, rgba(21,154,140,.09), transparent 70%),
      radial-gradient(circle at 1px 1px, rgba(23,77,58,.05) 1px, transparent 1.7px) 0 0/24px 24px,
      linear-gradient(180deg,#FCFAF4 0%,#F3EFE4 100%);}
  .hero-grid{position:relative; display:grid; grid-template-columns:1.05fr .95fr; gap:52px; align-items:center; padding:92px 0 108px;}
  .hero h1{font-size:clamp(44px,6vw,78px);}
  .hero .lead{margin-top:22px; font-size:clamp(17px,1.4vw,20px); color:var(--ink-2); max-width:35ch;}
  .hero-cta{display:flex; gap:12px; margin-top:32px; flex-wrap:wrap;}
  .tagbar{margin-top:30px; display:inline-flex; align-items:center; gap:12px; color:var(--ink-3); font-weight:600; font-size:13px; letter-spacing:.05em;}
  .dot{width:5px; height:5px; border-radius:50%; background:var(--green);}
  .hero-visual{position:relative;}
  .hero-canvas{position:relative; aspect-ratio:1/.9; background:linear-gradient(180deg,#FFFFFF,#FCFBF6); border:1px solid var(--line); border-radius:24px; box-shadow:var(--shadow); padding:12px;}
  .hero-canvas::before{content:""; position:absolute; inset:0; border-radius:24px; background:radial-gradient(70% 70% at 50% 40%, rgba(21,154,140,.05), transparent 72%); pointer-events:none;}
  .hero-canvas .net{position:relative; width:100%; height:100%; display:block; overflow:visible;}
  .edge{stroke:var(--teal); stroke-width:1.6; fill:none; opacity:.5;}
  .edge.dash{stroke-dasharray:2 7; stroke-linecap:round; opacity:.45;}
  .edge.draw{stroke-dasharray:var(--len); stroke-dashoffset:var(--len); animation:draw 1.4s ease forwards;}
  @keyframes draw{to{stroke-dashoffset:0;}}
  .node{opacity:0; animation:nodein .55s ease forwards;}
  @keyframes nodein{from{opacity:0;}to{opacity:1;}}
  .net g.node:nth-of-type(1){animation-delay:.5s;} .net g.node:nth-of-type(2){animation-delay:.64s;}
  .net g.node:nth-of-type(3){animation-delay:.78s;} .net g.node:nth-of-type(4){animation-delay:.92s;}
  .net g.node:nth-of-type(5){animation-delay:1.06s;}
  .node .halo{opacity:.15; transform-origin:center; animation:pulse 3.6s ease-in-out infinite;}
  @keyframes pulse{0%,100%{transform:scale(1); opacity:.15;}50%{transform:scale(1.5); opacity:.05;}}
  .node circle:not(.halo){filter:drop-shadow(0 5px 12px rgba(23,77,58,.16));}
  .node text{font-family:var(--f-body); font-weight:600; font-size:11px; fill:var(--ink); letter-spacing:.02em;}
  .node .sub{fill:var(--ink-3); font-weight:500; font-size:8.5px; letter-spacing:.06em; text-transform:uppercase;}
  .datachip{position:absolute; background:var(--surface); border:1px solid var(--line); border-radius:15px; padding:13px 16px; box-shadow:var(--shadow-lg); min-width:146px; z-index:3;}
  .datachip .clabel{font-size:10.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--teal);}
  .datachip .n{font-family:var(--f-display); font-weight:800; font-size:28px; color:var(--ink); line-height:1; margin-top:6px; font-variant-numeric:tabular-nums;}
  .datachip .spark{margin-top:9px; display:block;}
  .chip-br{right:-4%; bottom:7%;}
  .chip-tl{left:-5%; top:9%;}
  .datachip .glyph{margin-top:10px; display:flex; align-items:center; gap:6px;}
  .datachip .glyph i{width:9px; height:9px; border-radius:50%; display:block;}
  .datachip .glyph i:nth-child(1){background:var(--green);} .datachip .glyph i:nth-child(2){background:var(--gold-bright);} .datachip .glyph i:nth-child(3){background:var(--teal);}
  .datachip .glyph em{font-style:normal; font-size:12px; font-weight:600; color:var(--ink-3); margin-left:2px;}

  /* promise band */
  .promise{background:var(--forest); color:var(--forest-ink);}
  .promise .wrap{padding:56px 26px;}
  .promise .eyebrow{color:var(--green-bright);}
  .promise .row{display:flex; gap:30px; align-items:baseline; flex-wrap:wrap; margin-top:12px;}
  .promise h2{font-size:clamp(26px,3.6vw,44px); color:#fff; flex:1 1 420px;}
  .promise p{color:var(--forest-ink-2); flex:1 1 300px; font-size:17px; max-width:46ch;}

  /* pillars */
  .pillars .flow{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:44px; position:relative;}
  .pcard{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:26px 22px 24px; box-shadow:var(--shadow-sm); position:relative; transition:transform .2s,box-shadow .2s,border-color .2s;}
  .pcard:hover{transform:translateY(-4px); box-shadow:var(--shadow); border-color:var(--line-2);}
  .pico{width:46px; height:46px; border-radius:12px; display:grid; place-items:center; margin-bottom:16px;}
  .pcard h3{font-size:20px;}
  .pcard .verbs{margin-top:8px; font-weight:600; font-size:13.5px; color:var(--ink);}
  .pcard .desc{margin-top:10px; color:var(--ink-2); font-size:14.5px; line-height:1.55;}
  .pcard .step{position:absolute; top:20px; right:20px; font-family:var(--f-display); font-weight:800; font-size:13px; color:var(--ink-3);}
  .flow .arrow{position:absolute; top:44px; color:var(--ink-3); z-index:2;}
  .loopnote{margin-top:22px; display:inline-flex; align-items:center; gap:10px; color:var(--ink-2); font-size:14px; font-weight:500; background:var(--surface-2); padding:9px 16px; border-radius:100px;}
  .tint-green{background:var(--pos-bg); color:var(--green-2);}
  .tint-gold{background:var(--gold-bg); color:var(--gold);}
  .tint-teal{background:var(--info-bg); color:var(--teal-2);}
  .tint-forest{background:var(--forest); color:var(--green-bright);}

  /* services */
  .services{background:var(--surface-2);}
  .grid-2{display:grid; grid-template-columns:repeat(2,1fr); gap:18px; margin-top:44px;}
  .scard{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:28px; display:flex; gap:20px; transition:transform .2s,box-shadow .2s;}
  .scard:hover{transform:translateY(-3px); box-shadow:var(--shadow);}
  .sico{width:52px; height:52px; border-radius:13px; flex:none; display:grid; place-items:center; background:var(--forest); color:var(--green-bright);}
  .scard h3{font-size:19px;}
  .scard p{margin-top:9px; color:var(--ink-2); font-size:15px; line-height:1.55;}
  .scard .more{margin-top:14px; display:inline-flex; align-items:center; gap:7px; color:var(--teal-text); font-weight:600; font-size:14px;}
  .scard:hover .more{gap:11px;}

  /* signals (data-forward) */
  .signals{background:linear-gradient(180deg,var(--surface) 0%,#FCFBF6 100%); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
  .sig-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:44px;}
  .sigcard{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-md); padding:22px; display:flex; flex-direction:column; box-shadow:var(--shadow-sm); transition:transform .2s,box-shadow .2s;}
  .sigcard:hover{transform:translateY(-3px); box-shadow:var(--shadow);}
  .sig-top{display:flex; align-items:center; justify-content:space-between; gap:8px;}
  .sig-label{font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3);}
  .delta{display:inline-flex; align-items:center; gap:3px; font-size:12px; font-weight:600; padding:3px 8px; border-radius:100px; font-variant-numeric:tabular-nums;}
  .delta.up{background:var(--pos-bg); color:#356d1e;}
  .delta.info{background:var(--info-bg); color:#0A6B62;}
  .delta.gold{background:var(--gold-bg); color:#875c12;}
  .sig-num{font-family:var(--f-display); font-weight:800; font-size:clamp(34px,4vw,46px); color:var(--ink); line-height:1; margin-top:16px; letter-spacing:-.03em; font-variant-numeric:tabular-nums;}
  .sig-num .u{font-family:var(--f-body); font-weight:600; font-size:15px; color:var(--ink-3); letter-spacing:0; margin-left:5px;}
  .sig-spark{margin-top:14px; width:100%; height:34px; display:block;}
  .sig-cap{margin-top:12px; color:var(--ink-2); font-size:13.5px; line-height:1.5;}
  .sig-foot{margin-top:22px; display:flex; align-items:center; gap:10px; color:var(--ink-3); font-size:13px;}

  /* crops */
  .crops-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:40px;}
  .crop{position:relative; border-radius:var(--radius); overflow:hidden; aspect-ratio:3/3.4; border:1px solid var(--line); display:flex; flex-direction:column; justify-content:flex-end; padding:20px; isolation:isolate; cursor:pointer;}
  .crop .cbg{position:absolute; inset:0; z-index:0; width:100%; height:100%; object-fit:cover; transition:transform .55s cubic-bezier(.2,.7,.2,1);}
  .crop:hover .cbg{transform:scale(1.07);}
  .crop::before{content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(to top, rgba(8,20,15,.66) 0%, rgba(8,20,15,.12) 52%, rgba(8,20,15,.02) 100%);}
  .crop::after{content:""; position:absolute; top:15px; right:15px; z-index:2; width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.16); backdrop-filter:blur(3px); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:center; opacity:0; transform:translateY(-4px); transition:opacity .25s ease, transform .25s ease;}
  .crop:hover::after{opacity:1; transform:none;}
  .crop h3{font-size:20px; color:#fff; position:relative; z-index:2;}
  .crop .clabel{font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.82); margin-bottom:4px; position:relative; z-index:2;}

  /* cta */
  .cta .panel{background:var(--green-bright); color:var(--green-ink); border-radius:28px; padding:56px 48px; display:flex; gap:30px; align-items:center; justify-content:space-between; flex-wrap:wrap; position:relative; overflow:hidden;}
  .cta h2{font-size:clamp(28px,3.6vw,44px); color:var(--green-ink); max-width:18ch;}
  .cta p{margin-top:12px; color:rgba(18,51,31,.78); max-width:40ch; font-size:16px;}
  .cta .panel .btn-primary{background:var(--forest); color:var(--forest-ink);}
  .cta .panel .btn-primary:hover{background:var(--forest-2);}
  .cta .panel .btn-ghost{border-color:rgba(18,51,31,.4); color:var(--green-ink);}
  .cta .weave{position:absolute; inset:0; z-index:0; color:#12331F; opacity:.4;}
  .cta .panel>*{position:relative; z-index:1;}

  /* footer */
  footer.site{background:var(--forest); color:var(--forest-ink); padding:62px 0 30px; border-top:4px solid var(--green-bright);}
  .foot-grid{display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:32px;}
  .foot-grid h3{font-family:var(--f-body); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--forest-ink-2); font-weight:600; margin-bottom:14px;}
  .foot-grid a{display:block; color:var(--forest-ink); opacity:.82; padding:5px 0; font-size:14.5px;}
  .foot-grid a:hover{opacity:1;}
  .foot-brand .logo{height:64px;}
  .foot-brand p{color:var(--forest-ink-2); font-size:14.5px; margin-top:14px; max-width:34ch;}
  .foot-social{display:flex; gap:9px; margin-top:20px;}
  .foot-social a{width:38px; height:38px; border-radius:50%; border:1px solid rgba(245,242,233,.22); display:grid; place-items:center; color:var(--forest-ink); opacity:.82; transition:opacity .2s,background .2s,border-color .2s;}
  .foot-social a:hover{opacity:1; background:rgba(245,242,233,.1); border-color:rgba(245,242,233,.4);}
  .to-top{display:inline-flex; align-items:center; gap:7px; color:var(--forest-ink-2); font-weight:600;}
  .to-top:hover{color:var(--forest-ink);}
  .foot-bottom{margin-top:44px; padding-top:22px; border-top:1px solid rgba(245,242,233,.14); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; color:var(--forest-ink-2); font-size:13px;}
  .swatches{display:flex; gap:7px; align-items:center;}
  .swatches i{width:15px; height:15px; border-radius:50%; display:block; border:1px solid rgba(255,255,255,.2);}

  .reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease,transform .7s ease;}
  .reveal.in{opacity:1; transform:none;}

  .hero-photo{position:relative; overflow:hidden; background:#0c261c; isolation:isolate;}
  .hero-photo .hp-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 40%; z-index:-2;}
  .hero-photo::after{content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(100deg, rgba(8,28,20,.94) 0%, rgba(8,28,20,.74) 36%, rgba(8,28,20,.22) 68%, rgba(8,28,20,.05) 100%);}
  .hero-photo .wrap{position:relative; min-height:588px; display:flex; flex-direction:column; justify-content:center; padding-top:96px; padding-bottom:96px;}
  .hero-photo .hp-copy{max-width:620px;}
  .hero-photo .eyebrow{color:#9BD65A;}
  .hero-photo h1{color:#fff; font-size:clamp(44px,6vw,78px);}
  .hero-photo .lead{margin-top:22px; font-size:clamp(17px,1.4vw,20px); color:rgba(245,242,233,.9); max-width:36ch;}
  .hero-photo .hero-cta{display:flex; gap:12px; margin-top:32px; flex-wrap:wrap;}
  .hero-photo .btn-ghost{color:#fff; border-color:rgba(245,242,233,.45);}
  .hero-photo .btn-ghost:hover{border-color:#fff;}
  .hero-photo .tagbar{margin-top:30px; display:inline-flex; align-items:center; gap:12px; color:rgba(245,242,233,.72); font-weight:600; font-size:13px; letter-spacing:.05em;}
  .hero-photo .datachip{position:absolute; right:6%; bottom:9%;}

  .hero-split .hero-grid2{display:grid; grid-template-columns:1.02fr .98fr; gap:52px; align-items:center; padding:82px 0 94px; position:relative;}
  .hero-split h1{font-size:clamp(42px,5.4vw,72px);}
  .hero-split .lead{margin-top:22px; font-size:clamp(17px,1.4vw,20px); color:var(--ink-2); max-width:34ch;}
  .hero-split .hero-cta{display:flex; gap:12px; margin-top:32px; flex-wrap:wrap;}
  .hero-split .tagbar{margin-top:30px; display:inline-flex; align-items:center; gap:12px; color:var(--ink-3); font-weight:600; font-size:13px; letter-spacing:.05em;}
  .hero-split .hs-frame{position:relative; aspect-ratio:4/4.3; border-radius:24px; overflow:visible; border:1px solid var(--line); box-shadow:var(--shadow);}
  .hero-split .hs-frame img{width:100%; height:100%; object-fit:cover; display:block; border-radius:24px;}
  .hero-split .hs-frame .datachip{position:absolute; left:-5%; bottom:8%;}

  /* hero style switcher */
  .heroswitch{position:fixed; bottom:20px; left:50%; transform:translateX(-50%); z-index:120; background:rgba(18,22,20,.94); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.14); border-radius:100px; padding:6px 6px 6px 16px; display:flex; align-items:center; gap:10px; box-shadow:0 14px 40px rgba(0,0,0,.36);}
  .heroswitch .hl{color:#9AA6A0; font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;}
  .heroswitch .seg{display:flex; gap:3px; background:rgba(255,255,255,.06); border-radius:100px; padding:3px;}
  .heroswitch button{border:0; cursor:pointer; background:transparent; color:#D6DEDA; font-family:var(--f-body); font-weight:600; font-size:13px; padding:8px 15px; border-radius:100px; transition:background .2s,color .2s;}
  .heroswitch button:hover{color:#fff;}
  .heroswitch button.on{background:#81C141; color:#12331F;}

  @media (max-width:920px){
    .hero-grid{grid-template-columns:1fr; gap:22px; padding:54px 0 64px;}
    .hero-visual{max-width:460px; margin:8px auto 0;}
    .hero-split .hero-grid2{grid-template-columns:1fr; gap:26px; padding:52px 0 60px;}
    .hero-split .hs-frame{max-width:480px; margin:2px auto 0; aspect-ratio:4/3.1;}
    .hero-split .hs-frame .datachip{left:2%;}
    .hero-photo .wrap{min-height:520px;}
    .pillars .flow,.crops-grid,.sig-grid{grid-template-columns:repeat(2,1fr);}
    .flow .arrow{display:none;}
    .grid-2{grid-template-columns:1fr;}
    .foot-grid{grid-template-columns:1fr 1fr;}
    .nav-links{position:absolute; top:113px; left:0; right:0; flex-direction:column; gap:0; background:var(--surface); border-bottom:1px solid var(--line); padding:10px 20px 18px; box-shadow:var(--shadow); display:none;}
    header.site.open .nav-links{display:flex;}
    .nav-links a{padding:12px 8px; border-radius:8px;}
    .nav-links a.active::after{display:none;}
    .menu-btn{display:inline-flex;}
  }
  @media (max-width:560px){
    .crops-grid,.sig-grid,.foot-grid{grid-template-columns:1fr;}
    .pillars .flow{grid-template-columns:repeat(2,1fr); gap:12px;}
    .cta .panel{padding:38px 26px;}
    .chip-br{right:0; bottom:4%;} .chip-tl{left:0; top:4%;}
    .datachip{padding:11px 14px; min-width:128px;} .datachip .n{font-size:24px;}
    .hero-photo .datachip{display:none;}
    .heroswitch .hl{display:none;} .heroswitch button{padding:8px 11px; font-size:12px;}
  }
  @media (prefers-reduced-motion:reduce){
    *{animation:none !important; scroll-behavior:auto !important;}
    .reveal{opacity:1; transform:none; transition:none;}
    .edge.draw{stroke-dashoffset:0;}
    .node{opacity:1 !important;}
  }

/* ============================================================
   Interior pages (About / What We Do / Contact)
   ============================================================ */
.page-hero{position:relative; overflow:hidden; border-bottom:1px solid var(--line); background:
    radial-gradient(50% 70% at 90% 0%, rgba(21,154,140,.08), transparent 70%),
    radial-gradient(circle at 1px 1px, rgba(23,77,58,.05) 1px, transparent 1.7px) 0 0/24px 24px,
    linear-gradient(180deg,#FCFAF4 0%,#F3EFE4 100%);}
.page-hero .wrap{padding:70px 0 58px;}
.crumbs{display:flex; gap:8px; align-items:center; color:var(--ink-3); font-size:13px; font-weight:500; margin-bottom:14px;}
.crumbs a{color:var(--ink-3);} .crumbs a:hover{color:var(--teal);}
.crumbs span{opacity:.6;}
.page-hero h1{font-size:clamp(38px,5vw,60px); max-width:20ch;}
.page-hero .lead{margin-top:18px; font-size:clamp(17px,1.4vw,20px); color:var(--ink-2); max-width:58ch;}

.cols-3{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:44px;}
.icard{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:28px 24px; box-shadow:var(--shadow-sm);}
.icard .ico{width:46px; height:46px; border-radius:12px; display:grid; place-items:center; margin-bottom:16px;}
.icard h3{font-size:20px;}
.icard p{margin-top:10px; color:var(--ink-2); font-size:15px; line-height:1.55;}
.icard .lbl{font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--teal);}
.icard.accent-green{border-top:3px solid var(--green-bright);}
.icard.accent-gold{border-top:3px solid var(--gold-bright);}
.icard.accent-teal{border-top:3px solid var(--teal);}

.valuegrid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:44px;}
.vcard{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-md); padding:22px 22px 20px; display:flex; gap:14px; align-items:flex-start;}
.vcard .vn{font-family:var(--f-display); font-weight:800; font-size:15px; color:var(--green-2); flex:none; width:26px;}
.vcard h3{font-family:var(--f-display); font-weight:800; font-size:16px; letter-spacing:-.01em;}
.vcard p{margin-top:5px; color:var(--ink-2); font-size:14px; line-height:1.5;}

/* service detail cards */
.scard ul{margin:12px 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:7px;}
.scard ul li{position:relative; padding-left:20px; color:var(--ink-2); font-size:14px; line-height:1.5;}
.scard ul li::before{content:""; position:absolute; left:2px; top:8px; width:7px; height:7px; border-radius:50%; background:var(--green);}

/* contact */
.contact-grid{display:grid; grid-template-columns:.85fr 1.15fr; gap:26px; margin-top:44px; align-items:start;}
.contact-info{background:var(--forest); color:var(--forest-ink); border-radius:var(--radius); padding:34px 30px;}
.contact-info h2{color:#fff; font-size:22px;}
.contact-info .cintro{color:var(--forest-ink-2); font-size:15px; margin-top:10px; line-height:1.55;}
.detail-list{margin-top:26px; display:flex; flex-direction:column; gap:20px;}
.detail{display:flex; gap:14px; align-items:flex-start;}
.detail .di{width:42px; height:42px; border-radius:11px; flex:none; display:grid; place-items:center; background:rgba(129,193,65,.16); color:var(--green-bright);}
.detail .dk{font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--forest-ink-2);}
.detail .dv{margin-top:3px; color:#fff; font-size:15.5px;}
.detail .dv a{color:#fff;} .detail .dv a:hover{color:var(--green-bright);}
.contact-info .csocial{margin-top:28px; display:flex; gap:9px;}
.contact-info .csocial a{width:38px; height:38px; border-radius:50%; border:1px solid rgba(245,242,233,.24); display:grid; place-items:center; color:var(--forest-ink); opacity:.85; transition:.2s;}
.contact-info .csocial a:hover{opacity:1; background:rgba(245,242,233,.1);}

.contact-form{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:34px 30px; box-shadow:var(--shadow-sm);}
.contact-form h2{font-size:22px;}
.contact-form .fintro{color:var(--ink-2); font-size:15px; margin-top:8px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:22px;}
.field{display:flex; flex-direction:column; gap:7px; margin-top:16px;}
.field label{font-size:13px; font-weight:600; color:var(--ink);}
.field input, .field textarea, .field select{font-family:var(--f-body); font-size:15px; color:var(--ink); background:var(--bg); border:1.5px solid var(--line-2); border-radius:11px; padding:12px 14px; transition:border-color .2s, box-shadow .2s;}
.field textarea{min-height:130px; resize:vertical;}
.field input:focus, .field textarea:focus, .field select:focus{outline:none; border-color:var(--teal); box-shadow:0 0 0 3px rgba(21,154,140,.15);}
.form-row .field{margin-top:0;}
.form-actions{margin-top:24px; display:flex; align-items:center; gap:16px; flex-wrap:wrap;}
.form-note{color:var(--ink-3); font-size:13px;}

@media (max-width:860px){
  .cols-3, .valuegrid{grid-template-columns:1fr 1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .form-row{grid-template-columns:1fr;}
}
@media (max-width:560px){
  .cols-3, .valuegrid{grid-template-columns:1fr;}
}

/* flash messages */
.flash-wrap:empty{display:none;}
.flash-wrap{padding-top:20px;}
.flash-wrap .message{padding:14px 44px 14px 18px; border-radius:12px; font-weight:500; font-size:15px; box-shadow:var(--shadow-sm); cursor:pointer; position:relative;}
.flash-wrap .message + .message{margin-top:10px;}
.flash-wrap .message.success{background:var(--pos-bg); color:#356d1e; border:1px solid rgba(129,193,65,.45);}
.flash-wrap .message.error{background:rgba(190,66,45,.1); color:#a5402c; border:1px solid rgba(190,66,45,.3);}

/* honeypot anti-spam field (hidden from humans, visible to bots) */
.hp-field{position:absolute !important; left:-9999px !important; top:auto; width:1px; height:1px; overflow:hidden;}

/* ============================================================
   Error pages (404 / 500) — production
   ============================================================ */
.error-page{position:relative; overflow:hidden; border-bottom:1px solid var(--line); text-align:center; background:
    radial-gradient(60% 80% at 50% 0%, rgba(21,154,140,.09), transparent 70%),
    radial-gradient(circle at 1px 1px, rgba(23,77,58,.05) 1px, transparent 1.7px) 0 0/24px 24px,
    linear-gradient(180deg,#FCFAF4 0%,#F3EFE4 100%);}
.error-page .wrap{max-width:720px; padding:100px 26px 108px; position:relative;}
.error-page .err-code{font-family:var(--f-display); font-weight:800; font-size:clamp(96px,20vw,190px); line-height:.82; letter-spacing:-.05em; background:linear-gradient(135deg,var(--green-bright) 0%,var(--teal) 100%); -webkit-background-clip:text; background-clip:text; color:transparent; margin-bottom:8px;}
.error-page h1{font-size:clamp(28px,4vw,44px);}
.error-page p{margin:16px auto 0; color:var(--ink-2); font-size:18px; max-width:48ch;}
.error-page .hero-cta{justify-content:center; margin-top:32px;}
.error-page .err-links{margin-top:32px; padding-top:22px; border-top:1px solid var(--line); display:flex; gap:8px 24px; justify-content:center; flex-wrap:wrap; color:var(--ink-3); font-size:14px;}
.error-page .err-links a{color:var(--teal-text); font-weight:600;}
.error-page .err-links a:hover{text-decoration:underline;}