:root{
  --bg: #9fb6cd;
  --bg-soft: #b7c5d0;
  --surface: rgba(255,255,255,.58);
  --surface-strong: #f6f1e8;
  --surface-note: #efe3d1;
  --surface-note-2: #e8dcc8;
  --ink: #544941;
  --ink-soft: #6b625d;
  --line: rgba(84,73,65,.12);
  --accent: #e19063;
  --accent-strong: #e17648;
  --accent-soft: #d5b49f;
  --rose: #d5b49f;
  --sage: #b4c6b4;
  --cream: #f7efe0;
  --shadow-sm: 0 8px 24px rgba(61, 81, 103, .10);
  --shadow-md: 0 18px 40px rgba(61, 81, 103, .16);
  --shadow-lg: 0 30px 72px rgba(61, 81, 103, .22);
  --radius-sm: 16px;
  --radius-md: 24px;
  --radius-lg: 32px;
  --max: 1320px;
  --topbar: 78px;
  --font-ui: "Segoe UI", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  --font-accent: Georgia, "Times New Roman", serif;
  --focus: 0 0 0 4px rgba(225, 144, 99, .28);
}

*,
*::before,
*::after{box-sizing:border-box}

html{
  scroll-behavior:smooth;
  scroll-padding-top: calc(var(--topbar) + 24px);
}

body{
  margin:0;
  font-family: var(--font-ui);
  color: var(--ink);
  background:
    radial-gradient(circle at top left, rgba(247,239,224,.34), transparent 32%),
    radial-gradient(circle at 92% 14%, rgba(213,180,159,.18), transparent 24%),
    linear-gradient(180deg, #9fb6cd 0%, #a8bdd3 100%);
  min-height:100vh;
  line-height:1.6;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 8% 15%, rgba(255,255,255,.22) 0 2px, transparent 2.5px),
    radial-gradient(circle at 86% 30%, rgba(255,255,255,.16) 0 2px, transparent 2.5px),
    radial-gradient(circle at 20% 78%, rgba(255,255,255,.14) 0 2px, transparent 2.5px),
    radial-gradient(circle at 72% 88%, rgba(255,255,255,.14) 0 2px, transparent 2.5px);
  background-size: 220px 220px, 280px 280px, 310px 310px, 260px 260px;
  opacity:.55;
}

img, svg{max-width:100%; display:block}
a{color:inherit}
button,input,textarea,select{font:inherit}

.skip-link{
  position:absolute;
  left:12px;
  top:-60px;
  background:#fff;
  color:var(--ink);
  padding:10px 14px;
  border-radius:14px;
  z-index:2000;
  box-shadow:var(--shadow-sm);
  transition:top .2s ease;
}
.skip-link:focus{top:12px}

.site-header{
  position:sticky;
  top:0;
  z-index:1100;
  border-bottom:1px solid rgba(255,255,255,.28);
  background:rgba(244, 248, 252, .68);
  backdrop-filter: blur(18px) saturate(160%);
  -webkit-backdrop-filter: blur(18px) saturate(160%);
}

.topbar{
  max-width:var(--max);
  margin:0 auto;
  min-height:var(--topbar);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:14px 28px;
}

.brand{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
  text-decoration:none;
}

.brand-mark{
  width:48px;
  height:48px;
  border-radius:16px;
  display:grid;
  place-items:center;
  flex:none;
  background:linear-gradient(145deg, rgba(247,239,224,.95), rgba(239,227,209,.86));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    0 10px 24px rgba(61,81,103,.18);
  border:1px solid rgba(84,73,65,.09);
}

.brand-mark span{
  font-weight:800;
  font-size:1.05rem;
  color:var(--accent-strong);
  letter-spacing:.02em;
}

.brand-copy{
  min-width:0;
}

.brand-copy strong{
  display:block;
  font-size:.98rem;
  line-height:1.1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.brand-copy span{
  display:block;
  font-size:.84rem;
  color:var(--ink-soft);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.main-nav{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.main-nav a{
  text-decoration:none;
  color:var(--ink-soft);
  padding:10px 14px;
  border-radius:999px;
  border:1px solid transparent;
  transition:background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
  font-size:.95rem;
  font-weight:600;
  white-space:nowrap;
}

.main-nav a:hover{
  color:var(--ink);
  background:rgba(247,239,224,.52);
  border-color:rgba(84,73,65,.08);
  transform:translateY(-1px);
}

.main-nav a:focus-visible,
.button:focus-visible,
.card-link:focus-visible,
.page-nav a:focus-visible,
.toc a:focus-visible,
.video-slot:focus-visible{
  outline:none;
  box-shadow:var(--focus);
}

.main-nav a.is-current{
  color:var(--ink);
  background:rgba(247,239,224,.88);
  border-color:rgba(84,73,65,.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 8px 24px rgba(61,81,103,.10);
}

.page-shell{
  max-width:var(--max);
  margin:0 auto;
  padding:40px 28px 80px;
}

.hero{
  position:relative;
  overflow:hidden;
  border-radius:var(--radius-lg);
  padding: clamp(28px, 4vw, 48px);
  background:
    linear-gradient(180deg, rgba(255,255,255,.68), rgba(255,255,255,.42)),
    linear-gradient(145deg, rgba(247,239,224,.52), rgba(255,255,255,.10));
  border:1px solid rgba(255,255,255,.42);
  box-shadow: var(--shadow-lg);
  margin-bottom:32px;
}

.hero::after{
  content:"";
  position:absolute;
  inset:auto -90px -90px auto;
  width:360px;
  height:360px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(225,144,99,.22), transparent 68%);
  pointer-events:none;
}

.hero-grid{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap:28px;
  align-items:center;
  position:relative;
  z-index:1;
}

.hero-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(247,239,224,.92);
  border:1px solid rgba(84,73,65,.09);
  color:var(--ink);
  font-size:.86rem;
  font-weight:700;
  letter-spacing:.01em;
  margin-bottom:18px;
  box-shadow: var(--shadow-sm);
}

.hero-badge::before{
  content:"";
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 0 6px rgba(225,144,99,.18);
}

.hero h1{
  margin:0 0 10px;
  font-size:clamp(2.5rem, 6vw, 4.5rem);
  line-height:.98;
  letter-spacing:-.03em;
}

.hero h1 span{
  display:block;
  color:var(--accent-strong);
}

.hero .tagline{
  margin:0 0 18px;
  font-family: var(--font-accent);
  font-style:italic;
  font-size:clamp(1.2rem, 2.1vw, 1.8rem);
  color:var(--ink);
  opacity:.92;
}

.hero .lead{
  max-width:68ch;
  font-size:1.08rem;
  color:var(--ink-soft);
  margin:0 0 24px;
}

.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin:0 0 18px;
}

.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:48px;
  padding:0 18px;
  border-radius:999px;
  text-decoration:none;
  border:1px solid rgba(84,73,65,.1);
  font-weight:700;
  transition:transform .18s ease, background .2s ease, box-shadow .2s ease, border-color .2s ease;
  box-shadow:var(--shadow-sm);
}

.button:hover{transform:translateY(-1px)}
.button.primary{
  color:#fff;
  background:linear-gradient(135deg, var(--accent), var(--accent-strong));
  border-color:transparent;
}
.button.primary:hover{
  box-shadow:0 14px 28px rgba(225,118,72,.28);
}
.button.secondary{
  background:rgba(247,239,224,.92);
  color:var(--ink);
}
.button.ghost{
  background:rgba(255,255,255,.55);
  color:var(--ink);
}

.hero-meta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.pill{
  display:inline-flex;
  align-items:center;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.62);
  border:1px solid rgba(84,73,65,.08);
  color:var(--ink-soft);
  font-size:.92rem;
  font-weight:600;
}

.hero-visual{
  position:relative;
  padding:18px;
  border-radius:28px;
  background:
    linear-gradient(180deg, rgba(247,239,224,.6), rgba(255,255,255,.35)),
    rgba(255,255,255,.38);
  border:1px solid rgba(255,255,255,.35);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), var(--shadow-md);
}

.hero-visual::before,
.hero-visual::after{
  content:"";
  position:absolute;
  border-radius:22px;
  background:rgba(255,255,255,.35);
  filter:blur(1px);
}

.hero-visual::before{
  width:120px;height:120px;right:-18px;top:-18px;opacity:.38;
}
.hero-visual::after{
  width:86px;height:86px;left:-16px;bottom:-14px;opacity:.28;
}

.page-intro{
  display:grid;
  grid-template-columns: minmax(0,1fr) 300px;
  gap:28px;
  align-items:start;
  margin-bottom:34px;
}

.content-stack > section + section{
  margin-top:24px;
}

.toc{
  position:sticky;
  top:calc(var(--topbar) + 18px);
  padding:18px;
  border-radius:24px;
  background:rgba(247,239,224,.92);
  border:1px solid rgba(84,73,65,.08);
  box-shadow:var(--shadow-sm);
}

.toc h2{
  margin:0 0 10px;
  font-size:1rem;
}

.toc ol,
.toc ul{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:8px;
}

.toc a{
  display:block;
  text-decoration:none;
  color:var(--ink-soft);
  border-radius:14px;
  padding:8px 10px;
  font-size:.95rem;
  transition:background .2s ease, color .2s ease;
}

.toc a:hover,
.toc a.is-active{
  background:rgba(159,182,205,.18);
  color:var(--ink);
}

.card,
.panel,
.note,
.metric,
.stat,
.chart-card,
.timeline-item,
.stakeholder,
.kpi,
.quote-card,
.video-card,
.feature-card,
.matrix-card{
  border-radius:var(--radius-md);
  border:1px solid rgba(84,73,65,.08);
  box-shadow:var(--shadow-sm);
}

.card,
.panel,
.chart-card,
.video-card,
.feature-card,
.matrix-card{
  background:
    linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.48)),
    rgba(247,239,224,.44);
}

.note,
.metric,
.stat,
.timeline-item,
.stakeholder,
.quote-card,
.kpi{
  background: linear-gradient(180deg, rgba(239,227,209,.96), rgba(231,221,208,.92));
}

.section-card{
  padding: clamp(22px, 2.2vw, 30px);
}

.section-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}

.section-header h2,
.section-header h3{
  margin:0;
  line-height:1.08;
  letter-spacing:-.02em;
}

.section-header p{
  margin:10px 0 0;
  max-width:68ch;
  color:var(--ink-soft);
}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(247,239,224,.88);
  border:1px solid rgba(84,73,65,.09);
  font-size:.8rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--ink-soft);
}

.grid{
  display:grid;
  gap:20px;
}

.grid-2{grid-template-columns: repeat(2, minmax(0,1fr))}
.grid-3{grid-template-columns: repeat(3, minmax(0,1fr))}
.grid-4{grid-template-columns: repeat(4, minmax(0,1fr))}

.feature-card{
  padding:22px;
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height:100%;
}

.feature-card h3,
.feature-card h4{
  margin:0;
  line-height:1.1;
}

.feature-card p{
  margin:0;
  color:var(--ink-soft);
}

.feature-card ul,
.note ul,
.panel ul,
.matrix-card ul,
.stakeholder ul{
  margin:0;
  padding-left:1.1rem;
}

.card-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--accent-strong);
  text-decoration:none;
  font-weight:700;
  margin-top:auto;
}

.card-link::after{content:"→"}

.video-card{
  padding:22px;
}

.video-layout{
  align-items:stretch;
}

.video-slot{
  width:100%;
  min-width:0;
}

.video-shell{
  height:100%;
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:16px;
  border-radius:28px;
  background:linear-gradient(180deg, rgba(255,255,255,.78), rgba(247,239,224,.58));
  border:1px solid rgba(84,73,65,.08);
  box-shadow:var(--shadow-md);
}

.video-frame{
  position:relative;
  width:100%;
  aspect-ratio:16 / 9;
  overflow:hidden;
  border-radius:22px;
  background:
    radial-gradient(circle at top left, rgba(255,255,255,.25), transparent 38%),
    linear-gradient(135deg, rgba(84,73,65,.12), rgba(84,73,65,.04));
  box-shadow:0 14px 34px rgba(61,81,103,.14);
}

.video-frame iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  display:block;
}

.video-caption{
  display:grid;
  gap:8px;
  padding:2px 2px 4px;
}

.video-caption h3{
  margin:0;
  line-height:1.1;
}

.video-caption p{
  margin:0;
  color:var(--ink-soft);
}

.video-badge{
  display:inline-flex;
  align-items:center;
  width:max-content;
  min-height:32px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(247,239,224,.92);
  border:1px solid rgba(84,73,65,.08);
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.03em;
  text-transform:uppercase;
  color:var(--accent-strong);
}

.note{
  position:relative;
  padding:24px;
}

.note::before{
  content:"";
  position:absolute;
  top:-10px;
  right:20px;
  width:76px;
  height:22px;
  border-radius:8px;
  background:rgba(213,180,159,.78);
  border:1px solid rgba(255,255,255,.38);
  box-shadow:0 6px 14px rgba(61,81,103,.08);
}

.note h3, .note h4, .panel h3, .metric h3, .quote-card h3, .stakeholder h3, .timeline-item h3{
  margin:0 0 10px;
  line-height:1.1;
}

.note p,
.panel p,
.metric p,
.stat p,
.kpi p,
.timeline-item p,
.stakeholder p,
.matrix-card p{
  margin:0;
  color:var(--ink-soft);
}

.note ul{display:grid; gap:10px}

.metric,
.stat,
.kpi{
  padding:22px;
  min-height:100%;
}

.metric .value,
.stat .value,
.kpi .value{
  display:block;
  font-size:2rem;
  font-weight:800;
  line-height:1;
  margin-bottom:8px;
  color:var(--accent-strong);
}

.metric .label,
.stat .label,
.kpi .label{
  display:block;
  font-size:1rem;
  font-weight:700;
  margin-bottom:6px;
}

.kpi .mini{
  display:inline-flex;
  margin-top:12px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.42);
  font-size:.82rem;
  font-weight:700;
  color:var(--ink-soft);
}

.chart-card{
  padding:22px;
  position:relative;
}

.chart-card canvas{
  width:100%;
  max-height:320px;
}

.chart-disclaimer{
  display:inline-flex;
  margin-top:14px;
  padding:8px 12px;
  border-radius:999px;
  font-size:.85rem;
  font-weight:700;
  color:var(--ink-soft);
  background:rgba(247,239,224,.9);
  border:1px solid rgba(84,73,65,.08);
}

.list-clean{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:14px;
}

.list-clean li{
  display:flex;
  gap:12px;
  align-items:flex-start;
}

.list-clean li::before{
  content:"✓";
  width:24px;
  height:24px;
  border-radius:50%;
  flex:none;
  display:grid;
  place-items:center;
  background:rgba(180,198,180,.8);
  color:var(--ink);
  font-weight:800;
  margin-top:1px;
}

.numbered{
  counter-reset:item;
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:14px;
}

.numbered li{
  display:flex;
  gap:14px;
  align-items:flex-start;
}
.numbered li::before{
  counter-increment:item;
  content: counter(item, decimal-leading-zero);
  width:40px;
  height:40px;
  border-radius:14px;
  flex:none;
  display:grid;
  place-items:center;
  background:rgba(247,239,224,.95);
  border:1px solid rgba(84,73,65,.08);
  font-weight:800;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}

.timeline{
  display:grid;
  gap:16px;
}

.timeline-item{
  padding:22px;
  display:grid;
  grid-template-columns: 90px 1fr;
  gap:18px;
  align-items:flex-start;
}
.timeline-phase{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:72px;
  border-radius:20px;
  background:rgba(255,255,255,.36);
  border:1px solid rgba(84,73,65,.08);
  font-weight:800;
  color:var(--accent-strong);
  text-transform:uppercase;
  letter-spacing:.04em;
  text-align:center;
}

.stakeholder{
  padding:22px;
}

.stakeholder .role{
  display:inline-flex;
  margin-bottom:10px;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.42);
  border:1px solid rgba(84,73,65,.08);
  font-size:.84rem;
  font-weight:800;
  color:var(--ink-soft);
}

.quote-card{
  padding:26px;
  position:relative;
}
.quote-card blockquote{
  margin:0;
  font-size:1.14rem;
  line-height:1.6;
  font-family: var(--font-accent);
  font-style:italic;
}
.quote-card footer{
  margin-top:14px;
  color:var(--ink-soft);
  font-weight:700;
}

.matrix{
  display:grid;
  gap:18px;
  grid-template-columns: repeat(2, minmax(0,1fr));
}
.matrix-card{
  padding:20px;
}

.page-nav{
  display:flex;
  justify-content:space-between;
  gap:16px;
  margin-top:28px;
}

.page-nav a{
  text-decoration:none;
  display:flex;
  align-items:center;
  gap:10px;
  min-height:52px;
  padding:0 18px;
  border-radius:999px;
  background:rgba(247,239,224,.92);
  border:1px solid rgba(84,73,65,.08);
  box-shadow:var(--shadow-sm);
  font-weight:700;
  transition:transform .18s ease, background .2s ease;
}
.page-nav a:hover{transform:translateY(-1px)}
.page-nav .next{margin-left:auto}

.poster-cta{
  text-align:center;
  padding:30px 24px;
  border-radius:28px;
  background:
    linear-gradient(180deg, rgba(247,239,224,.88), rgba(239,227,209,.86));
  border:1px solid rgba(84,73,65,.08);
  box-shadow:var(--shadow-md);
}

.poster-cta p{
  margin:0;
  font-size:clamp(1.3rem, 3vw, 2.3rem);
  line-height:1.18;
  letter-spacing:-.03em;
}
.poster-cta p em{
  display:block;
  font-family: var(--font-accent);
  font-style:italic;
  color:var(--accent-strong);
}

.site-footer{
  max-width:var(--max);
  margin:0 auto;
  padding:0 28px 44px;
}

.footer-card{
  border-radius:28px;
  padding:22px 24px;
  background:rgba(247,239,224,.86);
  border:1px solid rgba(84,73,65,.08);
  box-shadow:var(--shadow-sm);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}

.footer-card small{
  color:var(--ink-soft);
  display:block;
}

.footer-links{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.footer-links a{
  text-decoration:none;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.56);
  border:1px solid rgba(84,73,65,.08);
  font-weight:700;
}

.page-kicker{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:16px;
  flex-wrap:wrap;
}

.page-kicker .summary{
  max-width:64ch;
  color:var(--ink-soft);
}

.compact-hero{
  padding:28px;
}

.compact-hero h1{
  font-size:clamp(2rem, 5vw, 3.2rem);
  margin-bottom:12px;
}

.highlight-line{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:18px;
}

.highlight-chip{
  padding:8px 12px;
  border-radius:999px;
  background:rgba(247,239,224,.86);
  border:1px solid rgba(84,73,65,.08);
  font-weight:700;
  color:var(--ink-soft);
}

@media (max-width: 1100px){
  .hero-grid,
  .page-intro{
    grid-template-columns: 1fr;
  }
  .toc{
    position:static;
    order:-1;
  }
}

@media (max-width: 900px){
  .grid-4{grid-template-columns: repeat(2, minmax(0,1fr))}
  .grid-3{grid-template-columns: repeat(2, minmax(0,1fr))}
  .matrix{grid-template-columns:1fr}
  .timeline-item{grid-template-columns:1fr}
  .topbar{padding:14px 20px}
  .page-shell{padding:32px 20px 72px}
  .site-footer{padding:0 20px 36px}
}

@media (max-width: 640px){
  .main-nav{
    width:100%;
    justify-content:flex-start;
    overflow:auto;
    flex-wrap:nowrap;
    padding-bottom:4px;
    scrollbar-width:none;
  }
  .main-nav::-webkit-scrollbar{display:none}
  .topbar{
    flex-direction:column;
    align-items:flex-start;
    padding-block:14px 12px;
  }
  .brand{width:100%}
  .grid-4,.grid-3,.grid-2{grid-template-columns:1fr}
  .hero-actions,.page-nav{flex-direction:column; align-items:stretch}
  .page-nav .next{margin-left:0}
  .footer-card{align-items:flex-start}
  .hero{padding:24px}
  .compact-hero{padding:22px}
}

@media (max-width: 900px){
  .video-shell{
    padding:14px;
    border-radius:24px;
  }
}

@media (max-width: 640px){
  .video-card{
    padding:18px;
  }

  .video-shell{
    padding:12px;
    border-radius:20px;
    gap:12px;
  }

  .video-frame{
    border-radius:18px;
  }

  .video-caption{
    gap:6px;
  }
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,
  *::before,
  *::after{
    animation:none !important;
    transition:none !important;
  }
}

/* ==== OASIS PLANT GALLERY ==== */
.gallery-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  margin-bottom:22px;
}

.plant-gallery{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px;
}

.plant-card,
.illustration-panel{
  background:linear-gradient(180deg, rgba(255,255,255,.76), rgba(255,255,255,.52)), rgba(247,239,224,.48);
  border:1px solid rgba(84,73,65,.08);
  border-radius:28px;
  box-shadow:var(--shadow-sm);
}

.plant-card{
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(200px, 260px) 1fr;
  min-height:100%;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.plant-card:hover{
  transform:translateY(-3px);
  box-shadow:var(--shadow-md);
  border-color:rgba(84,73,65,.13);
}

.plant-illustration{
  padding:18px;
  background:linear-gradient(180deg, rgba(247,239,224,.92), rgba(255,255,255,.42));
  border-right:1px solid rgba(84,73,65,.08);
  display:grid;
  place-items:center;
}

.plant-svg{
  width:100%;
  height:auto;
  filter:drop-shadow(0 16px 28px rgba(61,81,103,.10));
}

.plant-card-body{
  padding:22px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.plant-family{
  margin:0;
  font-size:.82rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--ink-soft);
}

.plant-card-body h3{
  margin:0;
  line-height:1.05;
}

.plant-scientific,
.plant-summary{
  margin:0;
  color:var(--ink-soft);
}

.tag-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:2px;
}

.tag{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(247,239,224,.92);
  border:1px solid rgba(84,73,65,.08);
  font-size:.84rem;
  font-weight:700;
  color:var(--ink-soft);
}

.plant-detail-top{
  align-items:stretch;
}

.illustration-panel{
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:16px;
}

.illustration-frame{
  padding:10px;
  border-radius:24px;
  background:linear-gradient(180deg, rgba(247,239,224,.94), rgba(255,255,255,.52));
  border:1px solid rgba(84,73,65,.08);
}

.botanical-caption{
  padding:18px 20px;
  border-radius:22px;
  background:linear-gradient(180deg, rgba(239,227,209,.96), rgba(231,221,208,.92));
  border:1px solid rgba(84,73,65,.08);
}

.botanical-caption strong{
  display:block;
  margin-bottom:6px;
}

.botanical-caption p{
  margin:0;
  color:var(--ink-soft);
}

@media (max-width: 1080px){
  .gallery-stats,
  .plant-gallery,
  .plant-card{
    grid-template-columns:1fr;
  }

  .plant-illustration{
    border-right:none;
    border-bottom:1px solid rgba(84,73,65,.08);
  }
}

@media (max-width: 820px){
  .gallery-stats,
  .plant-gallery,
  .plant-detail-top{
    grid-template-columns:1fr;
  }
}

.feature-image{
  display:block;
  width:100%;
  max-width:260px;
  height:auto;
  margin:16px auto 0;
  border-radius:16px;
  object-fit:cover;
  }
}