/* ===================================================================
   AgriView — Design tokens
   Palette (field-notebook / herbarium ledger, not a stock-agri green):
     --ink        #1F2A1B  primary text, deep moss-black
     --paper      #F5EFDD  page background, unbleached ledger paper
     --paper-2    #EEE4C6  recessed panels
     --moss       #3F6B2E  primary accent (leaf)
     --moss-dark  #2B4B1F  deep accent / headers on dark
     --ochre      #C9821A  CTA / warm accent (turmeric)
     --night      #16210F  dark section background
     --line       #D8CBA0  hairlines, borders (dried wheat)
     --white      #FFFDF7  card surfaces
   Type: Fraunces (display) + IBM Plex Sans (body) + IBM Plex Mono (catalog labels/data)
=================================================================== */
:root{
  --ink:#1F2A1B;
  --paper:#F5EFDD;
  --paper-2:#EEE4C6;
  --moss:#3F6B2E;
  --moss-dark:#2B4B1F;
  --ochre:#C9821A;
  --ochre-dark:#A6690F;
  --night:#16210F;
  --line:#D8CBA0;
  --white:#FFFDF7;
  --danger:#9C3B2A;

  --font-display:'Fraunces', Georgia, serif;
  --font-body:'IBM Plex Sans', -apple-system, Segoe UI, Roboto, sans-serif;
  --font-mono:'IBM Plex Mono', 'SFMono-Regular', Consolas, monospace;

  --radius-s:8px;
  --radius-m:14px;
  --radius-l:26px;

  --shadow-1: 0 1px 2px rgba(22,33,15,0.08);
  --shadow-2: 0 12px 30px -12px rgba(22,33,15,0.28);

  --maxw:1180px;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important;}
}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img,svg{display:block; max-width:100%;}
a{color:inherit;}
h1,h2,h3,h4{font-family:var(--font-display); margin:0; font-weight:600; letter-spacing:-0.01em; color:var(--moss-dark);}
p{margin:0;}
.container{max-width:var(--maxw); margin-inline:auto; padding-inline:24px;}
section{position:relative;}
:focus-visible{outline:3px solid var(--ochre); outline-offset:3px; border-radius:4px;}

.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-mono); font-size:0.75rem; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--moss); font-weight:500;
}
.eyebrow::before{content:''; width:18px; height:1px; background:var(--ochre);}

.h1{font-size:clamp(2.2rem, 1.5rem + 3vw, 3.9rem); line-height:1.03;}
.h2{font-size:clamp(1.7rem, 1.35rem + 1.6vw, 2.6rem); line-height:1.1;}
.h3{font-size:clamp(1.15rem, 1.05rem + 0.4vw, 1.4rem); line-height:1.25;}
.lede{font-size:clamp(1.02rem, 0.95rem + 0.3vw, 1.2rem); color:#3A4232; max-width:56ch;}

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--font-body); font-weight:600; font-size:0.98rem;
  padding:14px 26px; border-radius:999px; border:1.5px solid transparent;
  cursor:pointer; text-decoration:none; transition:transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
  white-space:nowrap;
}
.btn:active{transform:translateY(1px);}
.btn-primary{background:var(--ochre); color:var(--white); box-shadow:var(--shadow-1);}
.btn-primary:hover{background:var(--ochre-dark); box-shadow:var(--shadow-2);}
.btn-outline{background:transparent; color:var(--moss-dark); border-color:var(--moss-dark);}
.btn-outline:hover{background:var(--moss-dark); color:var(--white);}
.btn-ghost-light{background:rgba(245,239,221,0.08); color:var(--paper); border-color:rgba(245,239,221,0.35);}
.btn-ghost-light:hover{background:rgba(245,239,221,0.16);}
.btn[disabled]{opacity:0.55; cursor:not-allowed;}

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(245,239,221,0.86); backdrop-filter:blur(10px);
  border-bottom:1px solid transparent;
  transition:border-color .25s ease, box-shadow .25s ease, background .25s ease;
}
.site-header.is-scrolled{border-color:var(--line); box-shadow:0 2px 18px -8px rgba(22,33,15,0.18); background:rgba(245,239,221,0.96);}
.nav{display:flex; align-items:center; justify-content:space-between; gap:20px; padding-block:14px;}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink);}
.brand-mark{width:34px; height:34px; border-radius:9px; background:var(--moss-dark); display:flex; align-items:center; justify-content:center; flex:none;}
.brand-mark svg{width:19px; height:19px;}
.brand-name{font-family:var(--font-display); font-weight:600; font-size:1.28rem; letter-spacing:-0.01em;}
.brand-tag{display:block; font-family:var(--font-mono); font-size:0.62rem; letter-spacing:0.12em; color:var(--moss); text-transform:uppercase; margin-top:-2px;}

.nav-links{display:flex; align-items:center; gap:30px; list-style:none; margin:0; padding:0;}
.nav-links a{
  text-decoration:none; font-size:0.94rem; font-weight:500; color:var(--ink);
  position:relative; padding-bottom:3px;
}
.nav-links a::after{content:''; position:absolute; left:0; right:100%; bottom:0; height:2px; background:var(--ochre); transition:right .22s ease;}
.nav-links a:hover::after{right:0;}
.nav-cta{display:flex; align-items:center; gap:12px;}
.nav-toggle{
  display:none; background:none; border:1.5px solid var(--moss-dark); border-radius:10px;
  width:42px; height:42px; align-items:center; justify-content:center; cursor:pointer;
}
.nav-toggle svg{width:20px; height:20px;}

.mobile-menu{
  display:none; position:fixed; inset:0; z-index:99; background:var(--night);
  padding:100px 28px 40px; overflow-y:auto;
}
.mobile-menu.is-open{display:block;}
.mobile-menu ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px;}
.mobile-menu a{
  display:block; padding:16px 4px; color:var(--paper); text-decoration:none;
  font-family:var(--font-display); font-size:1.5rem; border-bottom:1px solid rgba(245,239,221,0.14);
}
.mobile-menu .btn{margin-top:26px; width:100%;}

@media (max-width:900px){
  .nav-links{display:none;}
  .nav-cta .btn-outline{display:none;}
  .nav-toggle{display:inline-flex;}
}

/* ---------- Hero ---------- */
.hero{
  padding:64px 0 90px;
  background:
    radial-gradient(680px 420px at 88% -10%, rgba(63,107,46,0.14), transparent 60%),
    var(--paper);
  overflow:clip;
}
.hero-grid{display:grid; grid-template-columns:1.05fr 0.95fr; gap:56px; align-items:center;}
.hero-copy{max-width:560px;}
.hero-copy .h1{margin-top:16px;}
.hero-copy .lede{margin-top:20px;}
.hero-actions{display:flex; flex-wrap:wrap; gap:14px; margin-top:32px;}
.hero-stats{display:flex; gap:28px; margin-top:44px; flex-wrap:wrap;}
.hero-stat b{display:block; font-family:var(--font-display); font-size:1.7rem; color:var(--moss-dark);}
.hero-stat span{font-size:0.82rem; color:#5A5B45;}

.phone-wrap{position:relative; display:flex; justify-content:center;}
.phone{
  position:relative; width:min(300px, 84vw); aspect-ratio:9/18.5;
  background:var(--night); border-radius:38px; padding:12px;
  box-shadow:var(--shadow-2), 0 0 0 1px rgba(22,33,15,0.06);
}
.phone-screen{
  height:100%; width:100%; background:var(--white); border-radius:28px; overflow:hidden;
  display:flex; flex-direction:column; position:relative;
}
.phone-topbar{display:flex; justify-content:space-between; align-items:center; padding:12px 16px 6px; font-family:var(--font-mono); font-size:0.62rem; color:#7C7A63;}
.phone-camera{flex:1; margin:10px 14px 0; border-radius:16px; background:linear-gradient(160deg,#EFE9CF,#D9E3C4); position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center;}
.scan-frame{position:absolute; inset:14px; border:2px dashed rgba(43,75,31,0.55); border-radius:12px;}
.scan-line{position:absolute; left:14px; right:14px; height:2px; background:var(--ochre); box-shadow:0 0 10px 1px rgba(201,130,26,0.7); animation:scan 2.6s ease-in-out infinite;}
@keyframes scan{0%,100%{top:16px;} 50%{top:calc(100% - 30px);}}
.leaf-icon-lg{width:64px; height:64px; color:var(--moss-dark); opacity:0.55;}
.phone-result{margin:12px 14px 16px; background:var(--paper); border:1px solid var(--line); border-radius:14px; padding:12px 14px;}
.phone-result .tag{display:inline-block; font-family:var(--font-mono); font-size:0.6rem; letter-spacing:0.08em; text-transform:uppercase; background:var(--moss); color:var(--white); padding:3px 8px; border-radius:5px; margin-bottom:6px;}
.phone-result strong{display:block; font-family:var(--font-display); font-size:1rem; color:var(--ink);}
.phone-result small{color:#6B6B54; font-size:0.72rem;}
.phone-badge{
  position:absolute; right:-14px; top:26%; background:var(--white); border:1px solid var(--line);
  border-radius:14px; padding:10px 12px; box-shadow:var(--shadow-2); display:flex; gap:8px; align-items:center;
  font-family:var(--font-mono); font-size:0.68rem;
}
.phone-badge svg{width:16px; height:16px; color:var(--ochre); flex:none;}
.phone-badge.b2{left:-18px; right:auto; top:auto; bottom:14%;}

@media (max-width:960px){
  .hero-grid{grid-template-columns:1fr; text-align:left;}
  .phone-wrap{margin-top:20px;}
  .phone-badge{display:none;}
}

/* ---------- Section shells ---------- */
.section{padding:96px 0;}
.section-tight{padding:72px 0;}
.section-head{max-width:640px; margin-bottom:52px;}
.section-head .h2{margin-top:14px;}
.section-head .lede{margin-top:14px;}
.section-dark{background:var(--night); color:var(--paper);}
.section-dark h2, .section-dark h3, .section-dark h4{color:var(--paper);}
.section-dark .lede{color:#C9CBAE;}
.section-dark .eyebrow{color:#9FCB7E;}

.reveal{opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease;}
.reveal.is-visible{opacity:1; transform:translateY(0);}

/* ---------- Feature "specimen" grid ---------- */
.feature-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(270px,1fr)); gap:20px;}
.spec-card{
  position:relative; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-m);
  padding:26px 24px 24px; box-shadow:var(--shadow-1); transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.spec-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-2); border-color:var(--moss);}
.spec-card::before{
  content:''; position:absolute; top:0; left:22px; width:34px; height:10px; background:var(--paper);
  border-left:1px solid var(--line); border-right:1px solid var(--line); border-radius:0 0 4px 4px;
}
.spec-top{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px;}
.spec-code{font-family:var(--font-mono); font-size:0.72rem; color:var(--ochre-dark); letter-spacing:0.05em;}
.spec-icon{width:38px; height:38px; border-radius:10px; background:var(--paper-2); display:flex; align-items:center; justify-content:center; color:var(--moss-dark);}
.spec-icon svg{width:20px; height:20px;}
.spec-card h3{margin-bottom:8px;}
.spec-card p{color:#4B4E3C; font-size:0.94rem;}

/* ---------- Spotlight (Smart Scan) ---------- */
.spotlight{display:grid; grid-template-columns:0.95fr 1.05fr; gap:60px; align-items:center;}
.steps{list-style:none; margin:30px 0 0; padding:0; display:flex; flex-direction:column; gap:22px;}
.steps li{display:flex; gap:16px;}
.step-num{font-family:var(--font-mono); font-size:0.85rem; color:var(--night); background:#9FCB7E; width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex:none;}
.step-body h4{color:var(--paper); font-size:1.05rem; margin-bottom:4px;}
.step-body p{color:#C9CBAE; font-size:0.92rem;}

.result-card{background:#1E2C15; border:1px solid rgba(159,203,126,0.28); border-radius:var(--radius-l); padding:30px; }
.result-row{display:flex; justify-content:space-between; align-items:baseline; padding-block:14px; border-bottom:1px dashed rgba(201,203,174,0.22);}
.result-row:last-child{border-bottom:none;}
.result-row span{font-family:var(--font-mono); font-size:0.72rem; text-transform:uppercase; letter-spacing:0.08em; color:#8FAE73;}
.result-row strong{color:var(--paper); font-weight:500; text-align:right; max-width:60%;}

@media (max-width:900px){
  .spotlight{grid-template-columns:1fr;}
}

/* ---------- Exam badges ---------- */
.badge-row{display:flex; flex-wrap:wrap; gap:12px;}
.exam-badge{
  display:flex; flex-direction:column; gap:2px; padding:16px 20px; border:1px solid var(--line); border-radius:var(--radius-m);
  background:var(--white); min-width:170px;
}
.exam-badge b{font-family:var(--font-display); font-size:1.05rem;}
.exam-badge span{font-size:0.78rem; color:#5A5B45;}

/* ---------- Notes strip ---------- */
.notes-strip{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
.note-card{background:var(--paper-2); border-radius:var(--radius-m); padding:24px; border:1px solid var(--line);}
.note-card .h3{margin-bottom:6px;}
.note-card p{font-size:0.88rem; color:#4B4E3C;}
@media (max-width:760px){.notes-strip{grid-template-columns:1fr;}}

/* ---------- Founder ---------- */
.founder{display:grid; grid-template-columns:auto 1fr; gap:28px; align-items:center; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-l); padding:34px; box-shadow:var(--shadow-1);}
.founder-avatar{
  width:84px; height:84px; border-radius:50%; background:var(--moss-dark); display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); color:var(--paper); font-size:1.9rem;
}
.founder h3{margin-bottom:4px;}
.founder .role{font-family:var(--font-mono); font-size:0.75rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--moss); margin-bottom:10px; display:block;}
.founder p{color:#4B4E3C; font-size:0.95rem; max-width:60ch;}
@media (max-width:560px){.founder{grid-template-columns:1fr; text-align:center;} .founder-avatar{margin-inline:auto;}}

/* ---------- Download band ---------- */
.download-band{
  background:linear-gradient(135deg, var(--moss-dark), #21391A);
  border-radius:var(--radius-l); padding:56px 44px; color:var(--paper);
  display:flex; align-items:center; justify-content:space-between; gap:30px; flex-wrap:wrap;
}
.download-band h2{color:var(--paper);}
.download-actions{display:flex; gap:14px; flex-wrap:wrap;}

/* ---------- Support / forms ---------- */
.support-grid{display:grid; grid-template-columns:1fr 1fr; gap:48px;}
.form-card{background:var(--white); border:1px solid var(--line); border-radius:var(--radius-l); padding:32px; box-shadow:var(--shadow-1);}
.field{margin-bottom:18px;}
.field label{display:block; font-size:0.82rem; font-weight:600; margin-bottom:7px; color:var(--moss-dark);}
.field input, .field select, .field textarea{
  width:100%; padding:12px 14px; border:1.5px solid var(--line); border-radius:10px; background:var(--paper);
  font-family:var(--font-body); font-size:0.96rem; color:var(--ink); transition:border-color .18s ease, background .18s ease;
}
.field input:focus, .field select:focus, .field textarea:focus{border-color:var(--moss); background:var(--white); outline:none;}
.field textarea{resize:vertical; min-height:110px;}
.field-check{display:flex; align-items:flex-start; gap:10px; font-size:0.86rem; color:#4B4E3C;}
.field-check input{width:auto; margin-top:3px;}
.form-note{font-size:0.8rem; color:#6B6B54; margin-top:14px;}
.form-status{margin-top:14px; font-size:0.88rem; font-weight:600; display:none;}
.form-status.show{display:block;}
.form-status.ok{color:var(--moss-dark);}
.form-status.err{color:var(--danger);}

.contact-info{display:flex; flex-direction:column; gap:22px;}
.info-row{display:flex; gap:14px; align-items:flex-start;}
.info-row .ic{width:40px; height:40px; border-radius:10px; background:var(--paper-2); display:flex; align-items:center; justify-content:center; flex:none; color:var(--moss-dark);}
.info-row .ic svg{width:20px; height:20px;}
.info-row h4{margin-bottom:3px; font-size:1rem;}
.info-row p, .info-row a{font-size:0.9rem; color:#4B4E3C; text-decoration:none;}
.info-row a:hover{color:var(--moss);}

@media (max-width:900px){.support-grid{grid-template-columns:1fr;}}

/* ---------- FAQ ---------- */
.faq{max-width:820px;}
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{
  width:100%; text-align:left; background:none; border:none; cursor:pointer;
  display:flex; justify-content:space-between; align-items:center; gap:20px;
  padding:20px 2px; font-family:var(--font-display); font-size:1.08rem; color:var(--ink);
}
.faq-q .plus{width:22px; height:22px; flex:none; position:relative;}
.faq-q .plus::before, .faq-q .plus::after{content:''; position:absolute; background:var(--moss-dark); transition:transform .25s ease;}
.faq-q .plus::before{left:0; top:50%; width:100%; height:2px; margin-top:-1px;}
.faq-q .plus::after{top:0; left:50%; width:2px; height:100%; margin-left:-1px;}
.faq-item.is-open .faq-q .plus::after{transform:rotate(90deg); opacity:0;}
.faq-a{max-height:0; overflow:hidden; transition:max-height .3s ease;}
.faq-a p{padding:0 2px 20px; color:#4B4E3C; font-size:0.94rem; max-width:70ch;}

/* ---------- Legal tabs ---------- */
.legal-shell{background:var(--white); border:1px solid var(--line); border-radius:var(--radius-l); overflow:hidden; box-shadow:var(--shadow-1);}
.legal-tabs{display:flex; flex-wrap:wrap; border-bottom:1px solid var(--line); background:var(--paper-2);}
.legal-tab{
  padding:16px 22px; font-family:var(--font-mono); font-size:0.78rem; letter-spacing:0.04em; text-transform:uppercase;
  background:none; border:none; cursor:pointer; color:#5A5B45; border-bottom:2px solid transparent; margin-bottom:-1px;
}
.legal-tab.is-active{color:var(--moss-dark); border-bottom-color:var(--ochre); background:var(--white);}
.legal-panel{padding:40px clamp(20px,4vw,56px) 56px; display:none;}
.legal-panel.is-active{display:block;}
.legal-updated{font-family:var(--font-mono); font-size:0.78rem; color:var(--moss); margin-bottom:28px; display:block;}
.legal-panel h3{font-size:1.25rem; margin-top:34px; margin-bottom:10px;}
.legal-panel h3:first-of-type{margin-top:0;}
.legal-panel h4{font-size:1.02rem; color:var(--ink); margin-top:20px; margin-bottom:6px; font-family:var(--font-body); font-weight:700;}
.legal-panel p{color:#3A4232; font-size:0.95rem; margin-bottom:12px; max-width:74ch;}
.legal-panel ul{margin:0 0 14px; padding-left:22px; color:#3A4232; font-size:0.95rem;}
.legal-panel li{margin-bottom:5px;}
.legal-panel a{color:var(--moss-dark); font-weight:600;}
.legal-intro{color:#3A4232; font-size:0.95rem; margin-bottom:20px; max-width:74ch;}

.delete-steps{list-style:none; margin:0 0 26px; padding:0; display:grid; gap:14px;}
.delete-steps li{display:flex; gap:14px; align-items:flex-start;}
.delete-steps .n{font-family:var(--font-mono); font-size:0.78rem; color:var(--white); background:var(--moss); width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex:none; margin-top:1px;}
.notice-box{background:var(--paper-2); border-left:3px solid var(--ochre); border-radius:0 10px 10px 0; padding:16px 18px; font-size:0.9rem; color:#3A4232; margin-bottom:26px;}

/* ---------- Footer ---------- */
.site-footer{background:var(--night); color:#C9CBAE; padding:64px 0 28px;}
.footer-grid{display:grid; grid-template-columns:1.4fr repeat(3,1fr); gap:40px;}
.footer-brand{max-width:280px;}
.footer-brand .brand-name{color:var(--paper);}
.footer-brand p{margin-top:14px; font-size:0.88rem; color:#9FA383;}
.footer-col h5{font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.1em; text-transform:uppercase; color:#9FCB7E; margin-bottom:16px;}
.footer-col ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px;}
.footer-col a{color:#C9CBAE; text-decoration:none; font-size:0.9rem;}
.footer-col a:hover{color:var(--paper);}
.footer-bottom{margin-top:56px; padding-top:24px; border-top:1px solid rgba(201,203,174,0.15); display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:0.8rem; color:#8B8F72;}
@media (max-width:820px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.footer-grid{grid-template-columns:1fr;}}

/* ---------- Back to top ---------- */
.to-top{
  position:fixed; right:20px; bottom:20px; z-index:90; width:46px; height:46px; border-radius:50%;
  background:var(--moss-dark); color:var(--paper); border:none; display:flex; align-items:center; justify-content:center;
  cursor:pointer; box-shadow:var(--shadow-2); opacity:0; pointer-events:none; transform:translateY(10px);
  transition:opacity .25s ease, transform .25s ease;
}
.to-top.show{opacity:1; pointer-events:auto; transform:translateY(0);}
.to-top svg{width:18px; height:18px;}

.visually-hidden{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap;}
.skip-link{position:absolute; left:-999px; top:0; background:var(--ochre); color:var(--white); padding:12px 18px; border-radius:0 0 8px 0; z-index:200; text-decoration:none; font-weight:600;}
.skip-link:focus{left:0;}

/* ---------- Standalone legal pages ---------- */
.legal-page-intro{margin-bottom:34px;}
.legal-shell .legal-panel{display:block;}
.form-status{min-height:1.3em;}