/* ===========================================================
   THE SEED EXCHANGE — visual redesign
   Palette (locked): Navy #1B2A4A · Teal #2AAFA9 · Burnt Orange #C8622A
   Copy: unchanged. Only the frame around it has moved.
=========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500;1,600&family=DM+Sans:ital,wght@0,400;0,500;0,700;1,400&family=Caveat:wght@500;600;700&display=swap');

:root{
  --navy:#1B2A4A;
  --navy-2:#12203A;
  --navy-soft:#243959;
  --teal:#2AAFA9;
  --teal-2:#1E8F8A;
  --burnt:#C8622A;
  --burnt-2:#A94F20;
  --cream:#FBF7F0;
  --ivory:#F3EEE4;
  --paper:#FFFDF9;
  --line: rgba(27,42,74,0.14);
  --line-light: rgba(255,255,255,0.18);
  --shadow-soft: 0 30px 60px -30px rgba(27,42,74,0.35);
  --shadow-card: 0 20px 40px -20px rgba(27,42,74,0.25);
  --radius-lg: 28px;
  --radius-md: 18px;
  --radius-pill: 999px;
  --serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --sans: 'DM Sans', -apple-system, system-ui, sans-serif;
  --hand: 'Caveat', cursive;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--sans);
  color:var(--navy);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
.container{
  width:100%;
  max-width:1240px;
  margin:0 auto;
  padding:0 32px;
}
section{position:relative;}
.eyebrow{
  font-family:var(--sans);
  font-size:12px;
  font-weight:700;
  letter-spacing:.22em;
  text-transform:uppercase;
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.eyebrow::before{
  content:"";
  width:26px;height:1px;
  background:currentColor;
  opacity:.6;
}
.eyebrow.teal{color:var(--teal-2);}
.eyebrow.burnt{color:var(--burnt);}
.eyebrow.cream{color:rgba(255,255,255,.7);}

h1,h2,h3,h4{
  font-family:var(--serif);
  font-weight:500;
  line-height:1.05;
  margin:0;
  letter-spacing:-.01em;
}
h1{font-size:clamp(2.6rem,6vw,4.6rem);}
h2{font-size:clamp(2.2rem,4.4vw,3.4rem);}
h3{font-size:clamp(1.5rem,2.6vw,2rem);}
em, .italic{font-style:italic;color:var(--teal-2);}
p{font-size:17px;line-height:1.7;color:rgba(27,42,74,0.72);margin:0;}
.lede{font-size:clamp(1.05rem,1.4vw,1.25rem);color:rgba(27,42,74,0.68);}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:var(--sans);
  font-size:13px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:16px 28px;
  border-radius:var(--radius-pill);
  border:1px solid transparent;
  cursor:pointer;
  transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease, background .3s ease, color .3s ease, border-color .3s ease;
  white-space:nowrap;
}
.btn .arrow{transition:transform .3s ease;}
.btn:hover .arrow{transform:translateX(4px);}
.btn:hover{transform:translateY(-2px);}
.btn-burnt{background:var(--burnt);color:#fff;box-shadow:0 16px 30px -12px rgba(200,98,42,0.55);}
.btn-burnt:hover{background:var(--burnt-2);}
.btn-teal{background:var(--teal);color:#fff;box-shadow:0 16px 30px -12px rgba(42,175,169,0.5);}
.btn-teal:hover{background:var(--teal-2);}
.btn-ghost-light{border-color:rgba(255,255,255,0.35);color:#fff;background:transparent;}
.btn-ghost-light:hover{border-color:#fff;background:rgba(255,255,255,0.08);}
.btn-ghost-dark{border-color:rgba(27,42,74,0.25);color:var(--navy);background:transparent;}
.btn-ghost-dark:hover{border-color:var(--navy);background:rgba(27,42,74,0.05);}
.link-arrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  border-bottom:1px solid currentColor;
  padding-bottom:3px;
  transition:gap .3s ease, opacity .3s ease;
}
.link-arrow:hover{gap:13px;}
.link-arrow.teal{color:var(--teal-2);}
.link-arrow.burnt{color:var(--burnt);}
.link-arrow.cream{color:#fff;}

/* ---------- announcement bar ---------- */
.announce{
  background:var(--burnt);
  color:#fff;
  font-size:13px;
  padding:11px 0;
  position:relative;
  z-index:60;
}
.announce .container{
  display:flex;
  align-items:center;
  gap:18px;
  flex-wrap:wrap;
}
.announce strong{font-weight:700;letter-spacing:.04em;}
.announce .sep{opacity:.55;}
.announce-links{margin-left:auto;display:flex;gap:22px;align-items:center;flex-wrap:wrap;}
.announce a{font-weight:700;text-underline-offset:3px;text-decoration:underline;text-decoration-color:rgba(255,255,255,.5);}
.announce a:hover{text-decoration-color:#fff;}
.announce-close{
  background:rgba(255,255,255,0.16);
  border:none;color:#fff;width:22px;height:22px;border-radius:50%;
  cursor:pointer;font-size:12px;line-height:1;
}

/* ---------- nav ---------- */
.nav-wrap{
  position:sticky;top:0;z-index:50;
  background:rgba(251,247,240,0.78);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.nav{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 0;
}
.brand{display:flex;align-items:center;gap:12px;}
.brand-mark{height:40px;width:auto;flex-shrink:0;}
.brand-name{font-family:var(--serif);font-size:20px;letter-spacing:.01em;}
.brand-name .exchange{color:var(--teal-2);font-style:italic;}
.nav-links{
  display:flex;align-items:center;gap:38px;
  list-style:none;margin:0;padding:0;
}
.nav-links a{
  font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  position:relative;padding:6px 0;color:var(--navy);
}
.nav-links a::after{
  content:"";position:absolute;left:0;bottom:0;height:2px;width:0;
  background:var(--teal);transition:width .3s ease;
}
.nav-links a:hover::after,
.nav-links a.active::after{width:100%;}
.nav-links a.active{color:var(--teal-2);}

/* ---------- nav dropdown (Our Work > Capacity) ---------- */
.nav-links li.has-dropdown{position:relative;}
.dropdown-toggle{display:inline-flex;align-items:center;gap:5px;}
.dropdown-caret{width:9px;height:9px;transition:transform .25s ease;color:currentColor;}
.nav-links li.has-dropdown:hover .dropdown-caret,
.nav-links li.has-dropdown:focus-within .dropdown-caret{transform:rotate(180deg);}
.nav-dropdown{
  position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(6px);
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-md);
  box-shadow:var(--shadow-card);padding:10px;min-width:190px;
  list-style:none;margin:0;padding-left:10px;
  opacity:0;pointer-events:none;transition:opacity .25s ease, transform .25s ease;
  z-index:60;
}
.nav-links li.has-dropdown:hover .nav-dropdown,
.nav-links li.has-dropdown:focus-within .nav-dropdown{
  opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0);
}
.nav-dropdown li{width:100%;}
.nav-dropdown a{
  display:block;padding:10px 14px;border-radius:8px;
  font-size:12px;letter-spacing:.05em;text-transform:uppercase;font-weight:700;color:var(--navy);
  white-space:nowrap;position:static;
}
.nav-dropdown a::after{content:none;}
.nav-dropdown a:hover{background:rgba(42,175,169,0.12);color:var(--teal-2);}
.nav-dropdown a.active{color:var(--teal-2);background:rgba(42,175,169,0.08);}

.nav-cta{display:flex;align-items:center;gap:18px;}
.nav-burger{display:none;}

/* ---------- hero ---------- */
.hero{
  background:radial-gradient(1200px 700px at 85% -10%, rgba(42,175,169,0.28), transparent 60%),
             radial-gradient(900px 500px at 10% 110%, rgba(200,98,42,0.18), transparent 55%),
             linear-gradient(180deg, var(--navy) 0%, var(--navy-2) 100%);
  color:#fff;
  padding:120px 0 90px;
  overflow:hidden;
}
.hero .container{position:relative;}
.hero-grain{
  position:absolute;inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
  pointer-events:none;
  mix-blend-mode:overlay;
}
.hero-top{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;flex-wrap:wrap;}
.hero-copy{max-width:820px;}
.hero-copy h1{margin-top:22px;color:#fff;}
.hero-copy h1 .accent{color:var(--teal);font-style:italic;}
.hero-lede{max-width:560px;margin-top:26px;color:rgba(255,255,255,0.72);font-size:clamp(1.05rem,1.4vw,1.25rem);}
.hero-cta-row{display:flex;align-items:center;gap:26px;margin-top:40px;flex-wrap:wrap;}
.badge-float{
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.16);
  border-radius:20px;
  padding:22px 24px;
  min-width:200px;
  backdrop-filter:blur(6px);
  transform:rotate(2deg);
  box-shadow:var(--shadow-soft);
}
.badge-float .num{font-family:var(--serif);font-size:2.4rem;color:var(--teal);display:block;line-height:1;}
.badge-float .cap{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,0.6);display:block;margin-top:8px;}
.scroll-cue{
  margin-top:70px;display:flex;align-items:center;gap:14px;
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,0.45);
}
.scroll-cue .line{width:1px;height:38px;background:linear-gradient(180deg, rgba(255,255,255,.6), transparent);animation:pulse-line 2.4s ease-in-out infinite;}
@keyframes pulse-line{0%,100%{opacity:.4;}50%{opacity:1;}}

.seed-doodle{position:absolute;opacity:.5;}

/* ---------- page header (inner pages) ---------- */
.page-hero{
  background:linear-gradient(180deg, var(--navy) 0%, var(--navy-2) 100%);
  color:#fff;
  padding:90px 0 80px;
  position:relative;
  overflow:hidden;
}
.page-hero h1{color:#fff;margin-top:18px;}
.page-hero .lede{color:rgba(255,255,255,0.68);margin-top:24px;max-width:640px;}

/* ---------- generic sections ---------- */
.section{padding:120px 0;}
.section.tight{padding:90px 0;}
.section-cream{background:var(--cream);}
.section-ivory{background:var(--ivory);}
.section-navy{background:linear-gradient(180deg, var(--navy-2), var(--navy));color:#fff;}
.section-navy p{color:rgba(255,255,255,0.68);}
.section-navy h2,.section-navy h3{color:#fff;}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start;}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;}
.stack{display:flex;flex-direction:column;gap:22px;}

.kicker-block{max-width:760px;margin-bottom:60px;}
.kicker-block h2{margin-top:18px;}
.kicker-block .lede{margin-top:22px;}

/* quote / callout blocks */
.quote-card{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:56px;
  box-shadow:var(--shadow-card);
  position:relative;
}
.quote-card::before{
  content:"“";
  position:absolute;top:14px;left:36px;
  font-family:var(--serif);
  font-size:110px;
  color:var(--teal);
  opacity:.18;
  line-height:1;
}
.quote-card blockquote{
  font-family:var(--serif);
  font-size:clamp(1.5rem,2.6vw,2.1rem);
  font-style:italic;
  line-height:1.4;
  margin:0;
  color:var(--navy);
}
.quote-card cite{
  display:block;margin-top:24px;font-style:normal;
  font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--teal-2);font-weight:700;
}

/* pattern statement lines */
.pattern-lines{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:44px 0;
}
.pattern-line{
  font-family:var(--serif);
  font-style:italic;
  font-size:clamp(1.4rem,2.6vw,2rem);
  line-height:1.45;
  color:var(--navy);
  max-width:820px;
  margin:0;
}
.pattern-line + .pattern-line{margin-top:26px;}
.pattern-line.indent{margin-left:auto;text-align:right;color:var(--teal-2);}

/* handwritten Seed Theory callout (Kutcher-style) */
.theory-quote{
  position:relative;
  padding:36px 0 30px;
  margin:20px 0 40px;
  transform:rotate(-1.5deg);
  text-align:center;
}
.theory-quote p{
  font-family:var(--hand);
  font-weight:700;
  font-size:clamp(3rem,8vw,6.4rem);
  line-height:0.95;
  color:var(--burnt);
  margin:0;
}
.theory-quote p span{color:var(--teal-2);}
.theory-quote.compact{margin:0;padding:10px 0;}
.theory-quote.compact p{font-size:clamp(2rem,4.4vw,3.5rem);}

/* generic handwritten accent — for single words/short callouts anywhere on the site */
.hand-word{font-family:var(--hand);font-weight:700;font-style:normal;}

/* inline logo lockup — icon + wordmark, matches nav exactly, for use inside running text/headings */
.logo-lockup{display:inline-flex;align-items:center;gap:0.16em;vertical-align:-0.08em;}
.logo-lockup img{height:0.72em;width:auto;}
.logo-lockup .logo-lockup-text{font-family:var(--serif);}
.logo-lockup .exchange{font-style:italic;color:var(--teal-2);}

.theory-cite{
  display:inline-block;
  margin-top:20px;
  font-family:var(--sans);
  font-size:12px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--navy-soft);
}

/* card component */
.card{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:40px;
  transition:transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease, border-color .4s ease;
}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow-card);border-color:transparent;}
.card .num{
  font-family:var(--serif);font-style:italic;font-size:14px;color:var(--teal-2);
  display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border:1px solid var(--teal-2);border-radius:50%;
  margin-bottom:22px;
}
.card h3{margin-top:0;margin-bottom:14px;}
.card p{margin-bottom:20px;}
.tag-row{display:flex;flex-wrap:wrap;align-items:baseline;row-gap:6px;padding-top:4px;border-top:1px solid var(--line);}
.tag{
  font-family:var(--serif);font-style:italic;font-weight:500;
  font-size:15px;letter-spacing:.01em;text-transform:none;
  color:var(--navy-soft);
  background:none;border:none;padding:0;border-radius:0;
}
.tag + .tag::before{
  content:"·";display:inline-block;margin:0 11px;
  color:var(--teal-2);font-style:normal;
}
.tag-featured{color:var(--teal-2);font-weight:700;}

/* divider squiggle */
.squiggle{width:64px;height:14px;opacity:.8;}

/* footer */
footer{
  background:var(--navy-2);
  color:rgba(255,255,255,0.65);
  padding:90px 0 40px;
}
.footer-top{
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:50px;
  padding-bottom:70px;border-bottom:1px solid rgba(255,255,255,0.1);
}
.footer-brand .brand-name{color:#fff;}
.footer-brand p{color:rgba(255,255,255,0.55);margin-top:18px;max-width:280px;}
.footer-col h4{
  font-family:var(--sans);font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(255,255,255,0.4);font-weight:700;margin-bottom:20px;
}
.footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px;}
.footer-col a{font-size:14px;color:rgba(255,255,255,0.75);transition:color .2s ease;}
.footer-col a:hover{color:var(--teal);}
.footer-bottom{
  display:flex;justify-content:space-between;align-items:center;padding-top:34px;
  font-size:13px;color:rgba(255,255,255,0.4);flex-wrap:wrap;gap:16px;
}
.social-row{display:flex;gap:12px;}
.social-chip{
  width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,0.2);
  display:flex;align-items:center;justify-content:center;
  color:rgba(255,255,255,.72);
  transition:background .3s ease, border-color .3s ease, color .3s ease, transform .3s ease;
}
.social-chip svg{width:19px;height:19px;stroke:currentColor;fill:none;}
.social-chip:hover{background:var(--teal);border-color:var(--teal);color:#fff;transform:rotate(-6deg);}

/* newsletter block in footer — free-form, no card boundary */
.notes-card{
  padding:0;
  transform:rotate(-1deg);
}
.notes-card h4{
  color:var(--teal);
  font-family:var(--hand);
  font-weight:700;
  font-size:2.1rem;
  line-height:1;
  margin-bottom:14px;
}
.notes-card p{font-size:14px;margin-bottom:18px;}
.type-line{
  font-size:14px;
  color:rgba(255,255,255,0.75);
  min-height:20px;
}
.tw-word{
  color:var(--teal);
  font-weight:700;
}
.tw-cursor{
  color:var(--teal);
  font-weight:700;
  margin-left:1px;
  animation:tw-blink 1s steps(1) infinite;
}
@keyframes tw-blink{0%,49%{opacity:1;}50%,100%{opacity:0;}}

/* reveal-on-scroll */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease, transform .8s cubic-bezier(.2,.8,.2,1);}
.reveal.is-visible{opacity:1;transform:translateY(0);}

/* mobile */
@media (max-width: 920px){
  .grid-2{grid-template-columns:1fr;gap:40px;}
  .grid-3{grid-template-columns:1fr;}
  .footer-top{grid-template-columns:1fr 1fr;row-gap:40px;}
  .nav-links{display:none;}
  .hero{padding:150px 0 70px;}
}
@media (max-width: 640px){
  .container{padding:0 20px;}
  .footer-top{grid-template-columns:1fr;}
  .announce .container{flex-direction:column;align-items:flex-start;gap:8px;}
  .announce-links{margin-left:0;}
  .section{padding:80px 0;}
}
