/* ====================================================================
   Apin Organic — shared stylesheet (corporate site + product/academy pages)
   Brand: navy + lime · Nunito · pill buttons · rounded cards
==================================================================== */
:root{
  --navy:        oklch(0.32 0.13 268);
  --navy-deep:   oklch(0.30 0.12 268);
  --navy-footer: oklch(0.26 0.11 268);
  --lime:        oklch(0.80 0.19 128);
  --lime-tint:   oklch(0.94 0.09 128);
  --green-text:  oklch(0.55 0.16 145);
  --body:        oklch(0.48 0.05 268);
  --nav-text:    oklch(0.42 0.06 268);
  --pale:        oklch(0.98 0.014 268);
  --border:      oklch(0.92 0.02 268);
  --maxw: 1200px;
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; overflow-x:hidden; }
body{
  margin:0; font-family:'Nunito',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  background:#fff; color:var(--navy); overflow-x:hidden; line-height:1.5; max-width:100%;
}
a{ text-decoration:none; color:inherit; }
img,svg{ display:block; }
h1,h2,h3,h4,p{ margin:0; }
section{ scroll-margin-top:88px; }
::selection{ background:var(--lime); color:var(--navy); }
:focus-visible{ outline:3px solid var(--lime); outline-offset:2px; border-radius:4px; }

.container{ max-width:var(--maxw); margin:0 auto; padding:0 32px; }

/* ---------- buttons ---------- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-weight:800; font-size:16px; padding:15px 28px; border-radius:999px; cursor:pointer;
  border:2px solid transparent; transition:transform .18s ease, box-shadow .18s ease, background .18s ease; }
.btn:hover{ transform:translateY(-2px); }
.btn-sm{ font-size:14px; padding:11px 20px; }
.btn-lime{ background:var(--lime); color:var(--navy-deep); box-shadow:0 10px 24px -10px oklch(0.80 0.19 128 / .8); }
.btn-lime:hover{ box-shadow:0 16px 30px -12px oklch(0.80 0.19 128 / .9); }
.btn-navy{ background:var(--navy); color:#fff; box-shadow:0 10px 24px -12px var(--navy); }
.btn-ghost{ background:#fff; color:var(--navy); border-color:oklch(0.88 0.03 268); }
.btn-ghost:hover{ border-color:var(--navy); }

/* ---------- top utility bar ---------- */
.topbar{ background:var(--navy-footer); color:oklch(0.78 0.05 268); }
.topbar .row{ max-width:var(--maxw); margin:0 auto; padding:9px 32px; display:flex; align-items:center;
  justify-content:space-between; font-size:13px; font-weight:700; }
.topbar .left{ display:flex; gap:22px; }
.topbar .right{ display:flex; align-items:center; gap:18px; }
.lang{ display:flex; align-items:center; gap:8px; }
.lang span{ cursor:pointer; color:oklch(0.7 0.05 268); font-weight:600; transition:color .15s; }
.lang span:hover{ color:#fff; }
.lang span.lang-active{ color:#fff; font-weight:800; }
.portal-link{ color:var(--lime); font-weight:800; }

/* ---------- nav ---------- */
.nav{ position:sticky; top:0; z-index:50; background:rgba(255,255,255,.86);
  backdrop-filter:saturate(180%) blur(12px); -webkit-backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid transparent; transition:box-shadow .25s, border-color .25s; }
.nav.scrolled{ box-shadow:0 6px 24px -16px var(--navy); border-bottom-color:var(--border); }
.nav .row{ max-width:var(--maxw); margin:0 auto; padding:16px 32px; display:flex; align-items:center; justify-content:space-between; }
.brand{ position:relative; display:inline-flex; align-items:center; font-weight:900; font-size:42px;
  letter-spacing:-0.045em; color:var(--navy); line-height:1; }
.brand .leaf-i{ position:relative; display:inline-block; }
.brand .leaf-i svg{ width:0.46em; height:0.46em; position:absolute; left:50%; top:-0.06em;
  transform:translateX(calc(-50% + 0.07em)) rotate(40deg); color:var(--lime); }
.nav-links{ display:flex; align-items:center; gap:30px; font-size:15px; font-weight:700; }
.nav-links a{ color:var(--nav-text); transition:color .15s; }
.nav-links a:hover, .nav-links a.active{ color:var(--navy); }
.nav-cta{ font-size:15px; padding:11px 22px; }
.hamburger{ display:none; width:44px; height:44px; border:none; background:transparent; cursor:pointer;
  padding:10px; border-radius:10px; }
.hamburger:hover{ background:var(--pale); }
.hamburger span{ display:block; height:2.6px; background:var(--navy); border-radius:2px; margin:5px 0; transition:.25s; }
.hamburger.open span:nth-child(1){ transform:translateY(7.6px) rotate(45deg); }
.hamburger.open span:nth-child(2){ opacity:0; }
.hamburger.open span:nth-child(3){ transform:translateY(-7.6px) rotate(-45deg); }
.mobile-panel{ display:none; border-top:1px solid var(--border); background:#fff; }
.mobile-panel.open{ display:block; }
.mobile-panel .inner{ padding:14px 32px 22px; display:flex; flex-direction:column; gap:4px; }
.mobile-panel a{ font-weight:800; font-size:17px; color:var(--navy); padding:12px 4px; border-bottom:1px solid var(--pale); }
.mobile-panel .btn{ margin-top:14px; }

/* ---------- generic ---------- */
.eyebrow{ font-size:13px; font-weight:800; letter-spacing:0.24em; text-transform:uppercase; color:var(--green-text); }
.section-head{ text-align:center; max-width:680px; margin:0 auto 48px; }
.section-head h2{ font-weight:900; font-size:40px; line-height:1.1; letter-spacing:-0.025em; margin-top:12px; color:var(--navy); }
.section-head p{ font-size:16.5px; line-height:1.6; font-weight:600; color:var(--body); margin-top:14px; }
.lead{ font-size:16.5px; line-height:1.6; font-weight:600; color:var(--body); }
.link-more{ font-weight:800; font-size:14px; color:var(--green-text); display:inline-flex; gap:5px; align-items:center; transition:gap .15s; }
.link-more:hover{ gap:9px; }
.card{ background:#fff; border:1px solid var(--border); border-radius:20px; transition:transform .2s ease, box-shadow .2s ease; }
.card:hover{ transform:translateY(-4px); box-shadow:0 24px 44px -28px var(--navy); }

/* ---------- hero ---------- */
.hero{ position:relative; background:var(--pale); overflow:hidden; }
.hero .watermark{ position:absolute; right:-120px; top:-80px; width:560px; height:560px; color:var(--lime);
  opacity:.10; transform:rotate(28deg); pointer-events:none; }
.hero-grid{ display:grid; grid-template-columns:1.08fr 0.92fr; gap:48px; align-items:center;
  padding:70px 0 84px; position:relative; }
.hero .badge{ display:inline-flex; align-items:center; gap:8px; background:var(--lime-tint);
  color:oklch(0.34 0.12 150); font-weight:800; font-size:13px; padding:7px 14px; border-radius:999px; margin-bottom:22px; }
.hero h1{ font-weight:900; font-size:58px; line-height:1.04; letter-spacing:-0.03em; color:var(--navy); }
.hero .sub{ font-size:19px; line-height:1.55; font-weight:600; color:oklch(0.46 0.05 268); margin-top:22px; max-width:500px; }
.hero .actions{ display:flex; gap:14px; margin-top:34px; flex-wrap:wrap; }
.hero-visual{ position:relative; width:100%; aspect-ratio:42/34; }
.hero-visual img{ width:100%; height:100%; object-fit:cover; border-radius:24px;
  box-shadow:0 34px 60px -24px oklch(0.32 0.13 268 / .45); }
.hero-visual::after{ content:""; position:absolute; right:-22px; bottom:-22px; width:92px; height:92px;
  border-radius:24px; background:var(--lime); z-index:-1; }
.hero-visual::before{ content:""; position:absolute; left:-26px; top:-26px; width:120px; height:120px;
  border-radius:50%; background:var(--lime-tint); z-index:-1; }

/* ---------- overview ---------- */
.overview{ padding:90px 0 24px; }
.overview-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.ov-card{ padding:28px 24px; }
.ov-icon{ width:46px; height:46px; border-radius:12px; background:var(--lime-tint); display:flex;
  align-items:center; justify-content:center; margin-bottom:18px; }
.ov-card h3{ font-weight:800; font-size:18px; margin-bottom:8px; color:var(--navy); }
.ov-card p{ font-size:14.5px; line-height:1.55; font-weight:600; color:var(--body); margin-bottom:14px; }

/* ---------- counters ---------- */
.counters{ padding:70px 0 0; }
.counters-band{ background:var(--navy); border-radius:24px; padding:48px 40px;
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.counter{ text-align:center; }
.counter .num{ font-weight:900; font-size:46px; color:var(--lime); line-height:1; font-variant-numeric:tabular-nums; }
.counter .lbl{ font-weight:700; font-size:14.5px; color:oklch(0.86 0.04 268); margin-top:10px; }

/* ---------- about ---------- */
.about{ padding:90px 0; }
.two-col{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.figure{ position:relative; width:100%; border-radius:22px; overflow:hidden; border:1px solid var(--border);
  box-shadow:0 24px 44px -30px var(--navy); }
.figure img{ width:100%; height:100%; object-fit:cover; display:block; }
.about .figure{ aspect-ratio:11/9; }
.about h2{ font-weight:900; font-size:38px; line-height:1.12; letter-spacing:-0.025em; margin:12px 0 16px; color:var(--navy); }
.bullets{ display:flex; flex-direction:column; gap:12px; margin-top:24px; }
.bullet{ display:flex; align-items:center; gap:12px; }
.bullet .dot{ width:26px; height:26px; border-radius:50%; background:var(--lime-tint); display:flex;
  align-items:center; justify-content:center; flex:none; }
.bullet span{ font-size:15.5px; font-weight:700; color:oklch(0.34 0.08 268); }

/* ---------- products (home) ---------- */
.products{ background:var(--pale); }
.products .inner{ padding:90px 0; }
.products-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.prod-card{ overflow:hidden; display:flex; flex-direction:column; }
.prod-visual{ position:relative; aspect-ratio:3/2.3; overflow:hidden; background:var(--lime-tint); }
.prod-visual img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.prod-card:hover .prod-visual img{ transform:scale(1.05); }
.size-tag{ position:absolute; top:16px; right:16px; background:var(--navy); color:#fff; font-weight:800;
  font-size:13px; padding:6px 13px; border-radius:999px; letter-spacing:.02em; }
.badge-tag{ position:absolute; top:16px; left:16px; background:var(--lime); color:var(--navy-deep); font-weight:800;
  font-size:12px; padding:5px 12px; border-radius:999px; letter-spacing:.03em; text-transform:uppercase; }
.prod-body{ padding:26px 26px 30px; display:flex; flex-direction:column; flex:1; }
.prod-body h3{ font-weight:800; font-size:21px; margin-bottom:8px; color:var(--navy); }
.prod-body p{ font-size:15px; line-height:1.55; font-weight:600; color:var(--body); margin-bottom:18px; }
.prod-body .link-more{ margin-top:auto; }
.sizes-note{ text-align:center; margin-top:32px; font-size:15px; font-weight:800; color:var(--nav-text); letter-spacing:.02em; }

/* ---------- academy ---------- */
.academy{ padding:90px 0; }
.academy-band{ position:relative; background:var(--navy-deep); border-radius:28px; padding:64px 56px;
  overflow:hidden; display:grid; grid-template-columns:1.1fr 0.9fr; gap:48px; align-items:center; }
.academy-band .watermark{ position:absolute; right:-50px; top:-70px; width:320px; height:320px; color:var(--lime); opacity:.12; transform:rotate(20deg); }
.academy-band .eyebrow{ color:var(--lime); }
.academy-band h2{ font-weight:900; font-size:38px; line-height:1.12; letter-spacing:-0.025em; margin:12px 0 16px; color:#fff; position:relative; }
.academy-band p{ font-size:16.5px; line-height:1.6; font-weight:600; color:oklch(0.86 0.04 268); margin-bottom:26px; position:relative; }
.academy-figure{ position:relative; aspect-ratio:1/0.78; border-radius:18px; overflow:hidden;
  box-shadow:0 24px 44px -22px rgba(0,0,0,.55); outline:1px solid oklch(0.80 0.19 128 / .25); outline-offset:-1px; }
.academy-figure img{ width:100%; height:100%; object-fit:cover; display:block; }

/* ---------- blog ---------- */
.blog{ background:var(--pale); }
.blog .inner{ padding:90px 0; }
.blog-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.blog-card{ overflow:hidden; display:flex; flex-direction:column; }
.blog-visual{ position:relative; aspect-ratio:3/2; overflow:hidden; background:var(--lime-tint); }
.blog-visual img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.blog-card:hover .blog-visual img{ transform:scale(1.05); }
.blog-visual .date{ position:absolute; top:14px; left:14px; background:var(--lime); color:var(--navy-deep);
  font-size:12px; font-weight:800; padding:5px 11px; border-radius:999px; }
.blog-body{ padding:22px 24px 26px; display:flex; flex-direction:column; flex:1; }
.blog-body h3{ font-weight:800; font-size:18px; line-height:1.3; margin-bottom:8px; color:var(--navy); }
.blog-body p{ font-size:14.5px; line-height:1.55; font-weight:600; color:var(--body); margin-bottom:14px; }
.blog-body .link-more{ margin-top:auto; }

/* ---------- contact ---------- */
.contact{ padding:90px 0; }
.contact h2{ font-weight:900; font-size:38px; line-height:1.12; letter-spacing:-0.025em; margin:12px 0 16px; color:var(--navy); }
.portal{ background:var(--pale); border:1px solid oklch(0.9 0.02 268); border-radius:24px; padding:40px 38px; text-align:center; }
.portal .k{ font-size:13px; font-weight:800; letter-spacing:0.1em; text-transform:uppercase; color:var(--green-text); margin-bottom:10px; }
.portal .phone{ font-weight:900; font-size:32px; color:var(--navy); line-height:1; }
.portal .hours{ font-size:14px; font-weight:700; color:var(--body); margin-top:8px; }
.portal hr{ border:none; height:1px; background:oklch(0.9 0.02 268); margin:24px 0; }
.portal .meta{ font-size:14.5px; font-weight:700; color:var(--nav-text); line-height:1.7; }

/* ---------- footer ---------- */
.footer{ background:var(--navy-footer); color:oklch(0.86 0.04 268); }
.footer .grid{ max-width:var(--maxw); margin:0 auto; padding:60px 32px 40px;
  display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:40px; }
.footer .brand{ color:#fff; font-size:36px; }
.footer .tagline{ font-size:14.5px; line-height:1.6; font-weight:600; color:oklch(0.72 0.05 268); margin-top:16px; max-width:280px; }
.footer .col-title{ font-size:13px; font-weight:800; letter-spacing:0.1em; text-transform:uppercase; color:#fff; margin-bottom:16px; }
.footer .links{ display:flex; flex-direction:column; gap:11px; font-size:14.5px; font-weight:600; }
.footer .links a{ color:oklch(0.86 0.04 268); transition:color .15s; }
.footer .links a:hover{ color:var(--lime); }
.footer .bottom{ border-top:1px solid oklch(0.36 0.08 268); }
.footer .bottom .row{ max-width:var(--maxw); margin:0 auto; padding:22px 32px; font-size:13px; font-weight:600; color:oklch(0.66 0.05 268); }

/* ---------- reveal animation ---------- */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:none; }

/* ====================================================================
   PRODUCT / ACADEMY / ARTICLE — subpage components
==================================================================== */

/* breadcrumb */
.breadcrumb{ font-size:13.5px; font-weight:700; color:var(--nav-text); padding:22px 0 0; display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.breadcrumb a{ color:var(--green-text); }
.breadcrumb a:hover{ text-decoration:underline; }
.breadcrumb .sep{ opacity:.5; }
.breadcrumb .cur{ color:var(--navy); }

/* subpage hero */
.subhero{ background:var(--pale); position:relative; overflow:hidden; }
.subhero .watermark{ position:absolute; right:-90px; top:-70px; width:420px; height:420px; color:var(--lime); opacity:.10; transform:rotate(24deg); pointer-events:none; }
.subhero-grid{ display:grid; grid-template-columns:1.05fr 0.95fr; gap:48px; align-items:center; padding:40px 0 70px; position:relative; }
.subhero .cat{ display:inline-block; background:var(--lime-tint); color:oklch(0.34 0.12 150); font-weight:800; font-size:12.5px; letter-spacing:.06em; text-transform:uppercase; padding:7px 14px; border-radius:999px; margin-bottom:18px; }
.subhero h1{ font-weight:900; font-size:46px; line-height:1.06; letter-spacing:-0.028em; color:var(--navy); }
.subhero .tagline{ font-size:18.5px; line-height:1.5; font-weight:700; color:var(--green-text); margin-top:14px; }
.subhero .intro{ font-size:16.5px; line-height:1.62; font-weight:600; color:var(--body); margin-top:18px; max-width:540px; }
.subhero .actions{ display:flex; gap:14px; margin-top:28px; flex-wrap:wrap; }
.subhero-visual{ position:relative; width:100%; aspect-ratio:5/4; }
.subhero-visual img{ width:100%; height:100%; object-fit:cover; border-radius:24px; box-shadow:0 30px 56px -26px oklch(0.32 0.13 268 / .45); }
.subhero-visual::after{ content:""; position:absolute; right:-20px; bottom:-20px; width:84px; height:84px; border-radius:22px; background:var(--lime); z-index:-1; }

/* product detail layout */
.pd{ padding:72px 0 90px; }
.pd-grid{ display:grid; grid-template-columns:1fr 340px; gap:54px; align-items:start; }
.pd-main > section{ margin-bottom:52px; }
.pd-main > section:last-child{ margin-bottom:0; }
.block-title{ font-weight:900; font-size:26px; letter-spacing:-0.02em; color:var(--navy); margin-bottom:20px; }
.block-title.sm{ font-size:22px; }
.prose{ font-size:16px; line-height:1.7; font-weight:600; color:var(--body); }
.prose p{ margin-bottom:14px; }

/* composition / crops tag list */
.tag-list{ display:flex; flex-wrap:wrap; gap:10px; }
.tag{ background:var(--pale); border:1px solid var(--border); border-radius:999px; padding:9px 16px;
  font-size:14px; font-weight:700; color:oklch(0.36 0.07 268); }
.tag .lt{ color:var(--green-text); }

/* spec / data tables */
.tbl-wrap{ overflow-x:auto; border:1px solid var(--border); border-radius:16px; }
table.data{ width:100%; border-collapse:collapse; font-size:14.5px; min-width:520px; }
table.data caption{ caption-side:top; text-align:left; padding:0 0 12px; }
table.data th, table.data td{ text-align:left; padding:13px 18px; border-bottom:1px solid var(--border); vertical-align:top; }
table.data thead th{ background:var(--navy); color:#fff; font-weight:800; font-size:13px; letter-spacing:.02em; text-transform:uppercase; }
table.data thead th:first-child{ border-top-left-radius:15px; }
table.data thead th:last-child{ border-top-right-radius:15px; }
table.data tbody tr:last-child td{ border-bottom:none; }
table.data tbody tr:nth-child(even){ background:var(--pale); }
table.data td.k{ font-weight:800; color:var(--navy); }
table.data td .em{ color:var(--green-text); font-weight:800; }
.spec-table{ min-width:auto; }

/* benefits grid */
.benefit-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.benefit{ background:#fff; border:1px solid var(--border); border-radius:16px; padding:22px 22px; }
.benefit .bi{ width:38px; height:38px; border-radius:10px; background:var(--lime-tint); display:flex; align-items:center; justify-content:center; margin-bottom:14px; }
.benefit h4{ font-weight:800; font-size:16.5px; color:var(--navy); margin-bottom:7px; }
.benefit p{ font-size:14.5px; line-height:1.55; font-weight:600; color:var(--body); }

/* FAQ accordion */
.faq{ display:flex; flex-direction:column; gap:12px; }
.faq-item{ border:1px solid var(--border); border-radius:14px; overflow:hidden; background:#fff; }
.faq-q{ width:100%; text-align:left; background:none; border:none; cursor:pointer; font-family:inherit;
  font-weight:800; font-size:16px; color:var(--navy); padding:18px 20px; display:flex; justify-content:space-between; gap:16px; align-items:center; }
.faq-q .chev{ flex:none; transition:transform .25s; color:var(--green-text); font-weight:900; }
.faq-item.open .faq-q .chev{ transform:rotate(45deg); }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .3s ease; }
.faq-a .inner{ padding:0 20px 18px; font-size:15px; line-height:1.6; font-weight:600; color:var(--body); }

/* aside spec/cta card */
.pd-aside{ position:sticky; top:96px; display:flex; flex-direction:column; gap:20px; }
.aside-card{ border:1px solid var(--border); border-radius:20px; padding:26px 24px; background:#fff; box-shadow:0 18px 40px -30px var(--navy); }
.aside-card .ac-title{ font-weight:900; font-size:18px; color:var(--navy); margin-bottom:14px; }
.aside-card .kv{ display:flex; justify-content:space-between; gap:14px; padding:9px 0; border-bottom:1px solid var(--pale); font-size:14px; }
.aside-card .kv:last-of-type{ border-bottom:none; }
.aside-card .kv .k{ font-weight:700; color:var(--nav-text); }
.aside-card .kv .v{ font-weight:800; color:var(--navy); text-align:right; }
.aside-cta{ background:var(--navy-deep); color:#fff; border:none; }
.aside-cta .ac-title{ color:#fff; }
.aside-cta p{ font-size:14.5px; line-height:1.55; font-weight:600; color:oklch(0.86 0.04 268); margin-bottom:18px; }
.note-box{ background:var(--lime-tint); border-radius:14px; padding:16px 18px; font-size:14px; line-height:1.55; font-weight:700; color:oklch(0.34 0.10 150); }

/* ---------- feeding chart ---------- */
.fc{ padding:64px 0 90px; }
.fc-controls{ display:flex; gap:14px; flex-wrap:wrap; align-items:center; margin-bottom:14px; }
.fc-search{ flex:1; min-width:220px; }
.fc-search input{ width:100%; font-family:inherit; font-size:15px; font-weight:600; color:var(--navy);
  padding:13px 18px; border:1px solid var(--border); border-radius:999px; background:#fff; }
.fc-search input:focus{ outline:none; border-color:var(--lime); box-shadow:0 0 0 3px oklch(0.80 0.19 128 / .25); }
.fc-filters{ display:flex; gap:8px; flex-wrap:wrap; }
.fc-chip{ font-family:inherit; cursor:pointer; border:1px solid var(--border); background:#fff; color:var(--nav-text);
  font-weight:800; font-size:13.5px; padding:10px 16px; border-radius:999px; transition:.15s; }
.fc-chip:hover{ border-color:var(--navy); color:var(--navy); }
.fc-chip.active{ background:var(--navy); color:#fff; border-color:var(--navy); }
.fc-count{ font-size:13.5px; font-weight:700; color:var(--nav-text); margin:6px 2px 20px; }
.fc-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.fc-card{ border:1px solid var(--border); border-radius:18px; padding:22px 22px; background:#fff; transition:transform .18s ease, box-shadow .18s ease; }
.fc-card:hover{ transform:translateY(-3px); box-shadow:0 22px 40px -30px var(--navy); }
.fc-card .crop{ display:flex; align-items:baseline; gap:9px; flex-wrap:wrap; margin-bottom:4px; }
.fc-card .crop h3{ font-weight:900; font-size:19px; color:var(--navy); letter-spacing:-0.01em; }
.fc-card .crop .en{ font-size:13.5px; font-weight:700; color:var(--nav-text); }
.fc-card .catpill{ display:inline-block; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.05em;
  padding:3px 10px; border-radius:999px; background:var(--lime-tint); color:oklch(0.34 0.10 150); margin-bottom:14px; }
.fc-row{ font-size:14px; line-height:1.5; margin-top:10px; }
.fc-row .lab{ font-weight:800; color:var(--green-text); font-size:12px; text-transform:uppercase; letter-spacing:.04em; display:block; margin-bottom:2px; }
.fc-row .val{ font-weight:600; color:var(--body); }
.fc-row .dil{ font-weight:800; color:var(--navy); }
.fc-empty{ text-align:center; padding:60px 0; font-weight:700; color:var(--nav-text); }
.fc-groups{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; margin-top:8px; }
.fc-group{ background:var(--pale); border:1px solid var(--border); border-radius:16px; padding:20px; }
.fc-group h4{ font-weight:800; font-size:15.5px; color:var(--navy); margin-bottom:7px; }
.fc-group p{ font-size:14px; line-height:1.5; font-weight:600; color:var(--body); }

/* ---------- article ---------- */
.article{ padding:64px 0 90px; }
.article-wrap{ max-width:820px; margin:0 auto; }
.article-body{ font-size:17px; line-height:1.75; font-weight:600; color:var(--body); }
.article-body h2{ font-weight:900; font-size:26px; letter-spacing:-0.02em; color:var(--navy); margin:40px 0 14px; }
.article-body p{ margin-bottom:16px; }
.schedule-table{ margin:24px 0 8px; }
.takeaways{ background:var(--pale); border:1px solid var(--border); border-left:4px solid var(--lime); border-radius:16px; padding:26px 28px; margin-top:36px; }
.takeaways h3{ font-weight:900; font-size:18px; color:var(--navy); margin-bottom:14px; }
.takeaways ul{ margin:0; padding-left:20px; display:flex; flex-direction:column; gap:9px; }
.takeaways li{ font-size:15.5px; line-height:1.5; font-weight:700; color:oklch(0.36 0.07 268); }

/* article hero (compact) */
.subhero-article{ padding:36px 0 56px; }
.subhero-article .wrap{ max-width:820px; margin:0 auto; }
.subhero-article h1{ font-weight:900; font-size:42px; line-height:1.08; letter-spacing:-0.026em; color:var(--navy); margin-top:14px; }
.subhero-article .tagline{ font-size:18px; line-height:1.5; font-weight:700; color:var(--green-text); margin-top:12px; }

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .hero h1{ font-size:50px; }
  .academy-band{ padding:54px 44px; }
  .pd-grid{ grid-template-columns:1fr 300px; gap:40px; }
}
@media (max-width:880px){
  .nav-links, .nav .nav-cta{ display:none; }
  .hamburger{ display:block; }
  .hero-grid{ grid-template-columns:1fr; gap:36px; padding:48px 0 60px; }
  .hero-visual{ max-width:480px; margin:0 auto; }
  .two-col{ grid-template-columns:1fr; gap:36px; }
  .about .order-img{ order:-1; }
  .overview-grid{ grid-template-columns:repeat(2,1fr); }
  .products-grid, .blog-grid{ grid-template-columns:repeat(2,1fr); }
  .academy-band{ grid-template-columns:1fr; gap:34px; }
  .footer .grid{ grid-template-columns:1fr 1fr; gap:30px 40px; }
  .subhero-grid{ grid-template-columns:1fr; gap:30px; padding:30px 0 54px; }
  .subhero-visual{ max-width:480px; }
  .pd-grid{ grid-template-columns:1fr; gap:40px; }
  .pd-aside{ position:static; }
  .benefit-grid{ grid-template-columns:1fr 1fr; }
  .fc-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:640px){
  .container{ padding:0 20px; }
  .brand{ font-size:34px; }
  .topbar .left span:nth-child(2){ display:none; }
  .hero h1{ font-size:38px; }
  .hero .sub{ font-size:17px; }
  .section-head h2{ font-size:30px; }
  .overview, .about, .products .inner, .academy, .blog .inner, .contact{ padding-top:60px; padding-bottom:60px; }
  .overview-grid, .products-grid, .blog-grid{ grid-template-columns:1fr; }
  .counters-band{ grid-template-columns:repeat(2,1fr); gap:30px 16px; padding:40px 24px; }
  .counter .num{ font-size:40px; }
  .academy-band{ padding:40px 26px; border-radius:22px; }
  .academy-band h2, .about h2, .contact h2{ font-size:30px; }
  .footer .grid{ grid-template-columns:1fr; gap:28px; }
  .hero .actions{ flex-direction:column; align-items:stretch; }
  .hero .actions .btn{ width:100%; }
  .subhero h1{ font-size:34px; }
  .benefit-grid, .fc-grid{ grid-template-columns:1fr; }
  .block-title{ font-size:23px; }
}
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; transition:none; }
  .btn:hover{ transform:none; }
}
