/* Green Nestling's presentation layer. The registered ThreeUI files are unchanged. */
:root { --brand-ink:#203a30; --brand-muted:#57695d; --brand-paper:#f6f7f1; --brand-line:#d9dfd5; --brand-accent:#dcebaf; }
:root[data-theme="dark"] { --brand-ink:#edf1e5; --brand-muted:#b8c7b8; --brand-paper:#17271f; --brand-line:#35483c; }
body { background:var(--brand-paper); background-image:none; font-size:16px; }
html[data-theme="dark"] body { background:var(--brand-paper); background-image:none; }
.skip-link { position:fixed; top:8px; left:16px; transform:translateY(-150%); z-index:100; background:white; color:#203a30; padding:12px 20px; }
.skip-link:focus { transform:none; }
header.site-header { background:var(--brand-paper); border-bottom:1px solid var(--brand-line); box-shadow:none; }
header.site-header .container { max-width:1440px; padding:0 4.5%; }
header.site-header .nav { min-height:92px; }
.brand { font-size:22px; font-weight:650; letter-spacing:-.8px; color:var(--brand-ink); white-space:nowrap; }
.brand span { color:inherit; }
.nav-links { gap:26px; }
.nav-links a { padding:9px 0; border-radius:0; font-size:14px; font-weight:500; }
.nav-links a.is-active,html[data-theme="dark"] .nav-links a.is-active { background:none; color:inherit; box-shadow:none; }
.nav-links a:hover { background:none; text-decoration:underline; text-underline-offset:6px; }
.nav-community { border:1px solid var(--brand-line); border-radius:30px; padding:12px 18px; font-size:14px; white-space:nowrap; }
.theme-toggle { border-radius:50%; width:40px; height:40px; border-color:var(--brand-line); }
.brand-home header.brand-header { position:absolute; left:0; right:0; top:0; background:transparent; border-color:#ffffff25; backdrop-filter:none; color:#f7f8ee; }
.brand-home .brand-header .brand,.brand-home .brand-header .brand span,.brand-home .brand-header .nav-links a { color:#f7f8ee; }
.brand-home .brand-header .nav-community,.brand-home .brand-header .theme-toggle { border-color:#ffffff50; color:#f7f8ee; background:transparent; }
.brand-home .brand-header .hamburger .bar { background:#fff; }
.brand-home .brand-header .mobile-panel { background:#203a30; color:#f7f8ee; }
.brand-home .brand-header .mobile-list a { background:transparent; color:#f7f8ee; border-radius:0; border-bottom:1px solid #ffffff25; font-weight:500; }
.brand-home .brand-header .mobile-list a.is-active { background:#ffffff12; color:#e0ecbb; }
.site-header .mobile-panel { position:absolute; top:100%; }
.mobile-panel[aria-hidden="true"] { visibility:hidden; }
.mobile-panel[aria-hidden="false"] { visibility:visible; opacity:1; transform:none; pointer-events:auto; }
.brand-hero { height:min(960px,100svh); min-height:780px; position:relative; overflow:hidden; isolation:isolate; color:#f8f9ed; background:#4a4d44; }
.hero-visual,.hero-shade,#living-world,.scene-fallback { position:absolute; inset:0; width:100%; height:100%; }
.scene-fallback { object-fit:cover; }
#living-world .shader-frame { width:100%; height:100%; }
.hero-shade { pointer-events:none; background:linear-gradient(90deg,rgba(19,31,23,.47),rgba(19,31,23,.13) 65%,transparent),linear-gradient(180deg,rgba(16,26,18,.16),transparent 62%,rgba(16,26,18,.45)); }
.brand-hero-copy { position:relative; z-index:2; padding:160px 4.5% 0; max-width:1440px; margin:0 auto; pointer-events:none; }
.eyebrow { font-size:12px; letter-spacing:2px; text-transform:uppercase; font-weight:600; margin:0 0 30px; line-height:1.6; }
.hero-eyebrow { color:#e3ebce; }
.brand-hero h1 { color:#f8f9ed; font-family:Georgia,'Times New Roman',serif; font-weight:400; font-size:clamp(56px,6.1vw,96px); line-height:1.08; letter-spacing:-3.6px; margin:0; max-width:1040px; }
.brand-hero h1 em { font-weight:400; color:#e0ecbb; }
.hero-description { max-width:480px; line-height:1.8; color:#f0f3e6; margin:28px 0 30px; font-size:17px; }
.hero-actions { display:flex; align-items:center; gap:30px; pointer-events:auto; width:fit-content; }
.brand-button { display:inline-flex; align-items:center; justify-content:center; gap:26px; border-radius:40px; padding:16px 24px; background:#e0ecbb; color:#24372b; font-weight:600; font-size:14px; min-height:52px; transition:background .2s,transform .2s; }
.brand-button:hover { background:#f0f8d9; transform:translateY(-2px); }
.brand-button span { font-size:22px; line-height:1; }
.hero-secondary { font-size:14px; color:#f7f8ee; padding:12px 0; border-bottom:1px solid #ffffff70; }
.hero-bottom { position:absolute; z-index:3; bottom:28px; left:4.5%; right:4.5%; display:flex; justify-content:space-between; align-items:center; gap:20px; pointer-events:none; }
.hero-bottom a,.hero-bottom button { pointer-events:auto; }
.scroll-story { display:flex; gap:14px; align-items:center; font-size:12px; letter-spacing:.6px; }
.scroll-story span { font-size:22px; }
.scene-control { border:1px solid #ffffff50; border-radius:30px; background:#1f2e24a6; padding:10px 16px; color:#f9faef; font-size:12px; cursor:pointer; }
.scene-control[hidden] { display:none; }
#home > .brand-section { padding:96px 0; margin:0; }
.brand-home .section-inner { width:calc(100% - 12%); max-width:1280px; margin-inline:auto; min-width:0; }
.brand-section { color:var(--brand-ink); }
.brand-section h2,.brand-products h2,.brand-connect h2 { font-family:Georgia,'Times New Roman',serif; font-weight:400; font-size:clamp(34px,3.7vw,56px); line-height:1.15; letter-spacing:-1.7px; margin:0 0 28px; }
.brand-section h2 em { font-weight:400; color:#637e55; }
html[data-theme="dark"] .brand-section h2 em { color:#b8ce96; }
.story-inner { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:9%; }
.story-body { padding-top:46px; }
.story-body p { color:var(--brand-muted); line-height:1.85; max-width:540px; margin:0 0 20px; }
.story-body .story-lead { font-size:22px; line-height:1.5; color:var(--brand-ink); }
.text-link { display:inline-flex; align-items:center; gap:24px; font-size:14px; border-bottom:1px solid currentColor; padding:9px 0; color:var(--brand-ink); }
.approach-inner { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:8%; }
.approach-image { margin:0; position:relative; }
.approach-image img { width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:2px; }
.approach-image figcaption { font-size:12px; margin-top:14px; color:var(--brand-muted); letter-spacing:.4px; }
.approach-copy .eyebrow { margin-bottom:22px; }
.principle { display:flex; gap:22px; padding:22px 0; border-top:1px solid var(--brand-line); }
.principle-number { font-family:Georgia,serif; font-style:italic; color:var(--brand-muted); font-size:20px; }
.principle h3 { font-size:18px; font-weight:500; margin:0 0 8px; }
.principle p { color:var(--brand-muted); margin:0; line-height:1.75; }
.sustainability-inner { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:10%; }
.brand-sustainability p { color:var(--brand-muted); line-height:1.8; max-width:530px; }
.sustainability-notes article { padding:0 0 18px; margin:0 0 22px; border-bottom:1px solid #becab4; }
.sustainability-notes h3 { font-size:18px; font-weight:500; margin:0 0 10px; }
.sustainability-notes p { margin:0; }


.brand-products > .container { padding:0; }
.brand-products .lead { max-width:650px; color:var(--brand-muted); font-size:17px; }
.brand-products .category h3 { margin-top:40px; font-size:18px; font-weight:500; }
.brand-products .product-card { border:1px solid var(--brand-line); border-radius:2px; background:var(--brand-paper); box-shadow:none; }
.brand-products .product-media { border-radius:0; }
.brand-products .product-media img { height:320px!important; object-fit:cover; border-radius:0!important; }
.brand-products .product-body { padding:24px; }
.brand-products .btn { background:transparent; padding:8px 0; min-height:44px; border:0; border-radius:0; border-bottom:1px solid var(--brand-line); box-shadow:none; }

.brand-connect > .container { padding:0; }
.brand-connect .duo { gap:clamp(40px,5vw,60px) 8%; grid-template-columns:minmax(0,1fr); }
.brand-connect .panel { background:transparent; border:0; box-shadow:none; padding:0; }
.brand-connect .panel h2 { font-size:42px; }
.brand-connect .lead { color:var(--brand-muted); font-size:17px; }
.brand-connect .form { margin-top:30px; }
.brand-connect input,.brand-connect textarea { border:1px solid var(--brand-line); background:var(--brand-paper); border-radius:4px; color:var(--brand-ink); font-size:16px; }
.brand-connect .btn-primary { background:#294935; color:#fff; box-shadow:none; border-radius:30px; padding:14px 24px; font-size:14px; }
.brand-connect .faq-item { background:transparent; border-color:var(--brand-line); border-radius:0; }

.footer { background:#182e23; color:#dfe8db; padding:40px 0 24px; }
.footer .container { max-width:1320px; padding:0 4.5%; }
.footer .logo { font-size:24px; font-weight:500; letter-spacing:-.6px; color:#f7f8ef; }
.footer p,.footer .lead { font-size:14px; line-height:1.6; margin:.5rem 0; color:#b9cbbb; }
.footer strong { font-size:13px; text-transform:uppercase; letter-spacing:1.4px; color:#e6eddc; }
.footer-links a { font-size:14px; }
.footer .chip { background:transparent; border:1px solid #ffffff25; color:#e4eddc; }
.cookie-banner { left:auto; right:20px; bottom:20px; width:380px; max-width:calc(100% - 40px); border:1px solid var(--brand-line); border-radius:8px; background:var(--brand-paper); color:var(--brand-ink); box-shadow:0 8px 28px #0002; }
.cookie-banner-inner { padding:18px; display:block; }
.cookie-banner p { font-size:13px; line-height:1.65; margin:0 0 12px; }
.cookie-banner a { color:inherit; text-decoration:underline; }
.cookie-banner button { background:#294935; color:white; border-radius:30px; min-height:44px; padding:8px 22px; }
.brand-home .reveal { opacity:1; transform:none; }
.brand-home #home > section { content-visibility:visible; contain-intrinsic-size:none; }
.collection-details { margin-top:30px; border-top:1px solid var(--brand-line); border-bottom:1px solid var(--brand-line); }
.collection-details > summary { padding:22px 0; display:flex; justify-content:space-between; align-items:center; cursor:pointer; font-size:17px; list-style:none; color:var(--brand-ink); }
.collection-details > summary::-webkit-details-marker { display:none; }
.collection-details > summary span { font-size:26px; font-weight:300; }
.collection-details[open] > summary span { transform:rotate(45deg); }
.collection-details[open] { padding-bottom:30px; }
@media(max-width:1150px) {
  .nav-community { display:none; }
  .nav-links { gap:20px; }
  .brand-hero h1 { font-size:72px; }
  #home > .brand-section { padding-block:72px; }
}
@media(max-width:900px) {
  .brand-hero { min-height:860px; height:100svh; max-height:1100px; }
  .brand-hero-copy { padding:145px 6% 0; }
  .brand-hero h1 { font-size:clamp(45px,7.8vw,70px); letter-spacing:-2px; }
  .hero-shade { background:linear-gradient(180deg,#1b2a2199,transparent 70%,#1b2a2155); }
  .hero-description { font-size:16px; }
  .story-inner { gap:6%; }
  .approach-inner { gap:5%; }
  .brand-section h2 { font-size:38px; }
}
@media(max-width:640px) {
  header.site-header .nav { min-height:78px; }
  .brand { font-size:20px; }
  .brand-hero { height:920px; min-height:0; }
  .hero-visual { top:250px; height:calc(100% - 250px); }
  .brand-hero-copy { padding:132px 6% 0; }
  .eyebrow { font-size:11px; letter-spacing:1.5px; margin-bottom:24px; }
  .brand-hero h1 { font-size:clamp(39px,8.5vw,53px); letter-spacing:-1.7px; line-height:1.16; }
  .hero-description { margin:24px 0; font-size:15px; max-width:310px; }
  .hero-actions { gap:22px; flex-wrap:wrap; }
  .brand-button { padding:14px 20px; gap:18px; }
  .hero-bottom { left:6%; right:6%; bottom:24px; }
  .scroll-story { font-size:11px; letter-spacing:0; gap:8px; }
  .scene-control { font-size:11px; padding:10px 12px; }
  #home > .brand-section { padding-block:64px; }
  .story-inner,.approach-inner,.sustainability-inner { grid-template-columns:1fr; gap:30px; }
  .story-body { padding:0; }
  .brand-section h2 { font-size:38px; }
  .story-body .story-lead { font-size:20px; }
  .approach-copy { padding-top:12px; }
  .approach-image img { aspect-ratio:1; }
  
  .brand-connect .duo { grid-template-columns:1fr; gap:60px; }
  .brand-connect .panel h2 { font-size:36px; }
  .cookie-banner { right:12px; bottom:12px; max-width:calc(100% - 24px); }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto!important; }
  .brand-home *, .brand-home *::before, .brand-home *::after { animation:none!important; transition:none!important; }
}

/* Keep desktop navigation available across the site. */
@media (min-width:1100px) {
  header.site-header, .brand-home header.brand-header {
    position:fixed; inset:0 0 auto; z-index:50;
    background:var(--brand-paper); color:var(--brand-ink);
    border-bottom:1px solid var(--brand-line);
  }
  body:not(.brand-home) { padding-top:92px; }
  .brand-home .brand-header .brand,
  .brand-home .brand-header .brand span,
  .brand-home .brand-header .nav-links a,
  .brand-home .brand-header .nav-community,
  .brand-home .brand-header .theme-toggle { color:var(--brand-ink); }
  .brand-home .brand-header .nav-community,
  .brand-home .brand-header .theme-toggle { border-color:var(--brand-line); }
  main [id] { scroll-margin-top:110px; }
}
@keyframes home-section-enter {
  from { opacity:.35; transform:translateY(18px); }
  to { opacity:1; transform:translateY(0); }
}
@media (prefers-reduced-motion:no-preference) {
  .brand-home .home-section-enter { animation:home-section-enter .55s ease-out both; }
}

/* Compact footer: retain readable text and comfortable link targets. */
.footer-grid { grid-template-columns:minmax(0,2fr) repeat(2,minmax(0,1fr)); gap:1.25rem 2rem; }
.footer-grid > div { min-width:0; }
.footer p,.footer a { overflow-wrap:anywhere; }
.footer .lead { max-width:48ch; }
.footer .footer-logo-img { height:36px; max-width:100%; }
.footer-links { gap:0; margin-top:.35rem; }
.footer-links a { display:flex; align-items:center; min-height:36px; line-height:1.4; padding:.25rem 0; }
.footer-social { flex-wrap:wrap; margin-top:.75rem; }
@media(max-width:767px) {
  .footer-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.25rem 1rem; }
  .footer-grid > div:first-child { grid-column:1/-1; }
  .footer-links a { min-height:44px; }
}
