/*
 * Homepage section styles. In the original Shopify sections these lived
 * inline as {% stylesheet %} blocks inside each .liquid file (hero, marquee,
 * categories, lore, email, grid) — consolidated here into one file per the
 * migration plan, copied verbatim (plain CSS, nothing to translate).
 */

/* ===== hero (sections/carpcore-hero.liquid) ===== */
.cc-herb--hero{ display:flex; align-items:center; justify-content:center; }
.cc-herb--hero:not(.cc-herb--hero-photo){ min-height:clamp(220px,38svh,420px); }
.cc-hero__seo{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0; }

/* framed plate: contained photo in the herbiary frame, taps through to shop */
.cc-herb--hero-photo{ padding-block:clamp(22px,3.5vw,44px); }
.cc-hero__photo{ position:relative; display:block; width:min(1400px,100%); margin-inline:auto;
  aspect-ratio:16/9; overflow:hidden;
  border:3px solid var(--ink); border-radius:14px 10px 16px 11px;
  box-shadow:var(--sh-lg); filter:url(#rough2); background:var(--paper-d);
  transition:transform .15s, box-shadow .15s; }
.cc-hero__photo:hover{ transform:translate(-2px,-3px); box-shadow:var(--sh-hover); }
.cc-hero__photo picture{ display:block; width:100%; height:100%; }
.cc-hero__img{ width:100%; height:100%; object-fit:cover; display:block; }

.cc-hero__carp{ position:absolute; right:-6%; bottom:-12%; width:54%; max-width:760px; aspect-ratio:256/128; opacity:.06; z-index:0; }
.cc-hero__carp--big{ left:50%; right:auto; top:50%; bottom:auto; transform:translate(-50%,-50%); width:60%; opacity:.13; }
@media (max-width:760px){
  .cc-hero__carp{ width:90%; bottom:-6%; }
  .cc-hero__photo--has-mobile{ aspect-ratio:4/5; }
  .cc-hero__photo{ filter:none; }
}

/* ===== marquee (sections/carpcore-marquee.liquid) ===== */
.cc-herb--marq{ padding:clamp(12px,2.2vw,20px) clamp(16px,4vw,64px); }
.cc-herb--marq .marq{ display:flex; align-items:stretch; color:var(--paper-l); }
.cc-herb--marq .marq__cap{ flex:none; display:flex; align-items:center; background:var(--ink); color:var(--paper-l);
  font-family:'Dela Gothic One',sans-serif; font-size:11px; letter-spacing:1.5px; text-transform:uppercase; padding:0 16px; }
.cc-herb--marq .marq__scroll{ flex:1; overflow:hidden; display:flex; align-items:center; }
.cc-herb--marq .track{ color:var(--paper-l); }
.cc-herb--marq .track span{ margin:0 16px; text-transform:uppercase; }

/* ===== categories (sections/carpcore-categories.liquid) ===== */
.cc-cats__head{ margin-bottom:clamp(1.4rem,3vw,2.4rem); display:flex; flex-direction:column; gap:.7rem; align-items:flex-start; }
.cc-cats__rack{ display:flex; flex-wrap:wrap; justify-content:center; align-items:flex-end; gap:clamp(18px,3vw,40px); }
.cc-cat .specimg{ width:140px; }
.cc-cat__carp{ width:120px; height:78px; background:var(--ink); opacity:.45;
  -webkit-mask:url("carp-silhouette.svg") center/contain no-repeat; mask:url("carp-silhouette.svg") center/contain no-repeat; }
.cc-cats__rack .cc-cat:nth-child(odd){ transform:rotate(-2deg); }
.cc-cats__rack .cc-cat:nth-child(even){ transform:rotate(2deg); margin-top:10px; }
.cc-cats__rack .cc-cat:nth-child(3n) .photo{ filter:url(#rough2); }
.cc-cats__rack .cc-cat:nth-child(3n+1) .photo{ filter:url(#rough3); }
.cc-cat .tag .sp{ color:var(--coral); }
@media (max-width:760px){
  .cc-cats__rack{
    flex-wrap:nowrap; justify-content:flex-start;
    overflow-x:auto; overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory; scroll-padding-inline:16px;
    gap:24px; padding:14px 6px 18px;
    scrollbar-width:none;
  }
  .cc-cats__rack::-webkit-scrollbar{ display:none; }
  .cc-cats__rack .cc-cat{ flex:0 0 auto; scroll-snap-align:center; }
}

/* ===== lore (sections/carpcore-lore.liquid) ===== */
.cc-lore{ display:flex; flex-direction:column; gap:clamp(1.6rem,3.5vw,2.6rem); max-width:1180px; margin-inline:auto; }
.cc-lore__top{ display:flex; flex-direction:column; gap:.9rem; align-items:flex-start; max-width:26ch; }
.cc-lore__carp{ position:absolute; left:-6%; bottom:-10%; width:48%; max-width:640px; aspect-ratio:256/128; opacity:.06; z-index:0; transform:scaleX(-1); }
.cc-lore__minrow{ display:flex; flex-wrap:wrap; align-items:center; gap:clamp(1.6rem,4vw,3rem); }
.cc-lore__fig{ flex:0 0 auto; align-items:flex-start; }
.cc-lore__fig .photo{ transform:rotate(-1.5deg); }
.cc-lore__fig .specimg{ width:clamp(150px,18vw,200px); }
.cc-lore__fig-carp{ display:block; width:160px; height:90px; background:var(--ink); opacity:.5;
  -webkit-mask:url("carp-silhouette.svg") center/contain no-repeat; mask:url("carp-silhouette.svg") center/contain no-repeat; }
.cc-lore__statpanel{ flex:1 1 340px; filter:url(#rough2); border-radius:7px 12px 6px 11px; }
.cc-lore__stats{ display:grid; grid-template-columns:1fr 1fr; gap:.85rem; margin:0; }
.cc-lore__stat{ border-top:4px solid var(--acc); background:var(--paper); border:2px solid var(--ink); padding:.6rem .65rem; box-shadow:var(--sh-sm); }
.cc-lore__stat-key{ font-family:'Dela Gothic One',sans-serif; font-size:8px; letter-spacing:1px; text-transform:uppercase; color:var(--ink); opacity:.65; }
.cc-lore__stat-val{ font-family:'VT323',monospace; font-size:1.05rem; line-height:1.1; margin:.15rem 0 0; color:var(--navy); }
.cc-lore__cta-wrap{ display:flex; flex-direction:column; gap:.6rem; margin-top:.2rem; align-items:flex-start; }
@media (max-width:760px){ .cc-lore__stat-key{ font-size:10px; } }
@media (max-width:560px){ .cc-lore__statpanel{ flex:1 1 100%; } }
.cc-herb.cc-herb--lore{ background:var(--navy); color:var(--paper-l); }
.cc-herb.cc-herb--lore::after{ mix-blend-mode:screen; opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='7'%3E%3Ccircle cx='1.3' cy='1.3' r='1' fill='%23F4EFE1' fill-opacity='0.07'/%3E%3C/svg%3E");
  background-size:7px 7px; }
.cc-herb.cc-herb--lore .carp-print{ background:var(--paper-l); opacity:.05; }
.cc-herb.cc-herb--lore .btn--navy{ background:var(--coral); }
.cc-herb.cc-herb--lore .panel h3{ color:var(--ink); }

/* ===== email signup (sections/carpcore-email.liquid) ===== */
.cc-email{ display:flex; align-items:center; justify-content:space-between; gap:clamp(1.4rem,4vw,3rem); flex-wrap:wrap; }
.cc-email__text{ flex:1 1 320px; min-width:0; display:flex; flex-direction:column; gap:.7rem; align-items:flex-start; }
.cc-herb--email .cc-email__heading{ font-size:clamp(28px,4.4vw,52px); text-shadow:3px 3px 0 var(--coral), -2px -2px 0 rgb(var(--color-brand-cerulean-rgb) / .32); }
.cc-email__sub{ max-width:44ch; color:var(--ink); }
.cc-email__card{ flex:1 1 380px; max-width:540px; width:100%; }
.cc-email__badge{ position:absolute; top:-15px; right:-11px; z-index:3; background:var(--coral); color:var(--paper-l);
  border:3px solid var(--ink); font-family:'Dela Gothic One',sans-serif; font-size:13px; letter-spacing:1px;
  padding:6px 12px; box-shadow:var(--sh-sm); transform:rotate(6deg); border-radius:6px 5px 8px 5px; }
.cc-email__lbl{ display:block; font-family:'Dela Gothic One',sans-serif; font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--ink); margin-bottom:.6rem; }
.cc-email__row{ display:flex; gap:10px; flex-wrap:wrap; }
.cc-email__input{ flex:1 1 200px; min-width:0; background:var(--paper); border:3px solid var(--ink); color:var(--ink);
  font-family:'VT323',monospace; font-size:1.2rem; padding:.55rem .7rem; min-height:48px; letter-spacing:.04em; border-radius:7px 5px 8px 6px; }
.cc-email__input::placeholder{ color:rgb(var(--color-foreground-rgb) / .55); }
.cc-email__input:focus-visible{ outline:3px solid var(--cer); outline-offset:2px; }
.cc-email__submit{ flex:none; min-height:48px; }
.cc-email__fine{ font-family:'VT323',monospace; font-size:1rem; color:var(--ink); opacity:.55; margin:.7rem 0 0; letter-spacing:.04em; }
@media (max-width:560px){
  .cc-herb--email{ padding-top:clamp(20px,4vw,34px); padding-bottom:clamp(20px,4vw,34px); }
  .cc-herb--email .cc-email__heading{ font-size:clamp(18px,5.6vw,24px); }
  .cc-email__sub{ font-size:.95rem; }
  .cc-email__lbl{ font-size:9px; letter-spacing:.5px; }
  .cc-email__card{ padding:14px 14px; }
  .cc-email__text,.cc-email__card{ flex:1 1 100%; }
  .cc-email__row{ flex-direction:column; gap:8px; }
  .cc-email__submit{ width:100%; justify-content:center; }
}
.cc-herb.cc-herb--email{ background:var(--navy); color:var(--paper-l); }
.cc-herb.cc-herb--email::after{ mix-blend-mode:screen; opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='7'%3E%3Ccircle cx='1.3' cy='1.3' r='1' fill='%23F4EFE1' fill-opacity='0.07'/%3E%3C/svg%3E");
  background-size:7px 7px; }
.cc-herb.cc-herb--email .cc-email__heading{ color:var(--paper-l); }
.cc-herb.cc-herb--email .cc-email__sub{ color:var(--paper-l); opacity:.85; }
.cc-herb--lore + .cc-herb--email::before{ border-top-color:rgb(var(--color-brand-paper-light-rgb) / .16); }

/* Catalogue grid (.cc-herb--shop / .shopgrid) is shared with the
   WooCommerce shop/category archive — see carpcore-herbiary.css, which
   loads on both instead of just the homepage. */
