/* Shared public identity: water, warm materials and visible habits of reuse. */
:root {
    --eco-forest: #173e30;
    --eco-ink: #263f49;
    --eco-moss: #526c40;
    --eco-cream: #f7f7ef;
    --eco-sage: #e7ecdf;
    --eco-line: #d8e3e3;
    --eco-sky: #b9e1ef;
    --eco-sky-soft: #e8f5f8;
    --eco-water: #276680;
    --eco-deep: #19485d;
    --eco-kraft: #cdb18d;
}
body.sustainable-site {
    --blue: #276680;
    --blue-dark: #19485d;
    --blue-light: #b9e1ef;
    --gold: #527683;
    --gold-soft: #d6ecf3;
    --gold-glow: #b9e1ef55;
    --primary: #276680;
    --text: #263f49;
    --muted: #5f7177;
    --bg: #f7f7ef;
    --radius: 10px;
    --shadow: 0 6px 24px #19485d0a;
    --shadow-lg: 0 12px 35px #19485d12;
    font-family: 'DM Sans', system-ui, sans-serif;
    color: var(--eco-ink);
    background: var(--eco-cream);
    -webkit-font-smoothing: antialiased;
}
body.sustainable-site :is(h1,h2,h3,h4) { font-family: 'Manrope', system-ui, sans-serif; letter-spacing: -.04em; font-weight: 500; }
body.sustainable-site :is(input,select,textarea,button) { font-family: inherit; }
body.sustainable-site :is(h1,h2) { text-wrap: balance; }
body.sustainable-site :is(p,li) { text-wrap: pretty; }
body.sustainable-site .container { width: min(1280px, calc(100% - 96px)); }
body.sustainable-site :focus-visible { outline: 3px solid var(--eco-water); outline-offset: 4px; }
body.sustainable-site section[id] { scroll-margin-top: 110px; }
body.sustainable-site .preloader { display: none; }
body.sustainable-site :is(.reveal,.reveal-left,.reveal-right,.reveal-scale,.stagger,.stagger > *) { opacity: 1; transform: none; transition: none; }
body.sustainable-site .scroll-progress { height: 2px; background: var(--eco-sky); }
body.sustainable-site .header { background: #f7f7eff5; border-bottom: 1px solid var(--eco-line); box-shadow: none; }
body.sustainable-site .header.scrolled { box-shadow: 0 4px 16px #19485d0b; }
body.sustainable-site .nav-wrap { min-height: 86px; padding-block: 15px; }
body.sustainable-site .brand-logo { height: 42px; }
body.sustainable-site .nav-primary { background: transparent; border: 0; box-shadow: none; gap: 3px; }
body.sustainable-site .nav-link { color: var(--eco-ink); font-size: 13px; font-weight: 500; padding-inline: 9px; }
body.sustainable-site .nav-link__icon { display: none; }
body.sustainable-site .nav-link:hover, body.sustainable-site .nav-link.active { background: var(--eco-sky-soft); color: var(--eco-deep); }
body.sustainable-site .nav-contact-btn { background: var(--eco-sky); color: var(--eco-deep); box-shadow: none; border: 1px solid #a6d2e2; border-radius: 5px; font-size: 13px; }
body.sustainable-site .nav-contact-btn span { display: none; }
body.sustainable-site .nav-outlet-link { background: transparent; color: var(--eco-deep); border-color: var(--eco-line); box-shadow: none; }
body.sustainable-site .nav-action__icon { color: var(--eco-water); background: transparent; }
body.sustainable-site .nav-scopri-trigger { color: var(--eco-deep); }
body.sustainable-site .nav-scopri-menu, body.sustainable-site .nav-dropdown-menu { background: var(--eco-cream); border-color: var(--eco-line); box-shadow: var(--shadow-lg); }
body.sustainable-site .nav-scopri-item { color: var(--eco-ink); }
body.sustainable-site .nav-scopri-icon { color: var(--eco-water); background: var(--eco-sky-soft); }
body.sustainable-site .nav-scopri-item:hover { background: var(--eco-sky-soft); }
.site-skip-link { position: fixed; left: 15px; top: -100px; z-index: 10000; padding: 12px 20px; color: #19485d; background: #fff; }
.site-skip-link:focus { top: 15px; }
body.sustainable-site .btn, body.sustainable-site .eco-btn { border-radius: 5px; background: var(--eco-sky); color: var(--eco-deep); border: 1px solid #a6d2e2; box-shadow: none; font-weight: 600; gap: 16px; text-shadow: none; min-height: 46px; }
body.sustainable-site .btn:hover, body.sustainable-site .eco-btn:hover { background: #a5d6e8; color: #153e50; box-shadow: 0 5px 16px #19485d12; transform: translateY(-2px); }
body.sustainable-site :is(.btn-outline,.btn-outline-light,.hero-btn-secondary) { background: transparent; color: var(--eco-deep); border: 1px solid #8fb6c2; }
body.sustainable-site :is(.btn-outline,.btn-outline-light,.hero-btn-secondary):hover { background: var(--eco-sky-soft); color: var(--eco-deep); }
/* Legacy hero buttons used important declarations on their dark backgrounds. */
body.sustainable-site .hero-btn-secondary { background: transparent !important; color: var(--eco-deep) !important; border-color: #8fb6c2 !important; }
body.sustainable-site .hero-btn-secondary:hover { background: var(--eco-sky-soft) !important; }
body.sustainable-site :is(.eyebrow,.hero-eyebrow,.site-kicker) { color: var(--eco-water); font: 650 11px/1.6 'DM Sans',sans-serif; letter-spacing: .15em; text-transform: uppercase; }
body.sustainable-site .gold { color: var(--eco-water); background: none; -webkit-text-fill-color: currentColor; }
body.sustainable-site .section { padding-block: 80px; }
body.sustainable-site .section-alt { background: var(--eco-sky-soft); }
body.sustainable-site .section-head h2 { color: var(--eco-ink); font-size: clamp(28px,3.2vw,45px); }
body.sustainable-site .lead { color: #536c77; font-weight: 400; }
body.sustainable-site :is(.card,.info-box,.legal-page,.news-card,.feature-card,.benefit-card) { background: #fffefa; border: 1px solid var(--eco-line); border-radius: 8px; box-shadow: none; }
body.sustainable-site .card:hover { box-shadow: var(--shadow-lg); }
body.sustainable-site .card h3 { color: var(--eco-deep); }
body.sustainable-site :is(.contact-form,.career-form,.outlet-auth-card) { border-radius: 8px; box-shadow: none; border-color: var(--eco-line); background: #fffefa; }
body.sustainable-site :is(.contact-form,.career-form,.outlet-auth-card) :is(input,textarea,select) { color: var(--eco-ink); background: #fffefa; border-color: #bed2d7; border-radius: 5px; box-shadow: none; }
body.sustainable-site :is(.contact-form,.career-form,.outlet-auth-card) :is(input,textarea,select):focus { border-color: var(--eco-water); }
body.sustainable-site .faq-list details { border: 0; border-bottom: 1px solid #bfd7df; border-radius: 0; box-shadow: none; background: transparent; }
body.sustainable-site .faq-list summary { color: var(--eco-deep); }
body.sustainable-site .faq-list details p { color: #536c77; }
body.sustainable-site .site-reuse-note { background: #cdb18d url('/assets/images/sustainability/recycled-paper.webp') center / 1050px; padding: 30px 0; color: #263f49; }
body.sustainable-site .site-reuse-inner { display: grid; grid-template-columns: 135px minmax(0,1fr) auto; gap: 42px; align-items: center; }
body.sustainable-site .site-reuse-inner > img { width: 130px; height: 195px; object-fit: contain; transform: rotate(-10deg); }
body.sustainable-site .site-reuse-inner h2 { font-size: 31px; line-height: 1.16; margin: 12px 0; }
body.sustainable-site .site-reuse-inner p { max-width: 570px; font-size: 14px; line-height: 1.7; }
body.sustainable-site .site-reuse-inner .site-kicker { color: #294d56; font-size: 9px; }
body.sustainable-site .site-reuse-inner .btn { background: #fff9ed; border-color: #a99070; font-size: 13px; }
body.sustainable-site .footer, body.sustainable-site .footer-top { background: #e1f0f4; color: var(--eco-ink); }
body.sustainable-site .footer-top { padding: 58px 0; }
body.sustainable-site .footer-grid { grid-template-columns: 1.15fr .85fr 1fr 1fr; gap: 35px; }
body.sustainable-site .footer-logo { background: #fffaf0; padding: 10px 14px; border-radius: 4px; filter: none; height: 60px; width: auto; }
body.sustainable-site .footer-heading { color: var(--eco-deep); font-size: 14px; }
body.sustainable-site :is(.footer-tagline,.footer-links,.footer-links a,.footer-top-link) { color: #436573; font-size: 13px; }
body.sustainable-site .footer-links a:hover { color: #153e50; }
body.sustainable-site .footer-contacts li { color: #436573; }
body.sustainable-site .footer-social a { color: var(--eco-deep); background: #cbe4ed; border-color: #b5d5df; }
body.sustainable-site .footer-bottom { background: #d1e9f1; border-color: #c1dce4; color: #426572; }
body.sustainable-site .footer-bottom p { color: #426572; }
body.sustainable-site :is(.floating-cta,.chatbot-toggle,.spinner-fab,.back-to-top) { background: var(--eco-sky); color: var(--eco-deep); border-color: #aacfdc; box-shadow: 0 4px 18px #19485d18; }
body.sustainable-site .chatbot-header { background: #d2ebf4; color: var(--eco-deep); }
body.sustainable-site .chatbot-header :is(h3,p,button) { color: var(--eco-deep); }
body.sustainable-site .chatbot-form button { background: var(--eco-water); }
body.sustainable-site .cookie-consent { background: #fffefa; color: var(--eco-ink); border: 1px solid var(--eco-line); border-radius: 8px; box-shadow: var(--shadow-lg); }
body.sustainable-site .cookie-consent :is(strong,summary) { color: var(--eco-deep); }
body.sustainable-site .cookie-consent :is(p,li) { color: #536c77; }
body.sustainable-site .cookie-consent-details { border-color: var(--eco-line); background: var(--eco-sky-soft); border-radius: 5px; }
body.sustainable-site .cookie-consent-links a:hover { color: var(--eco-deep); text-decoration: underline; }
body.sustainable-site .cookie-btn { border-radius: 5px; box-shadow: none; }
body.sustainable-site .cookie-btn-reject { background: #fffefa; color: var(--eco-deep); border-color: #a6d2e2; }
body.sustainable-site .cookie-btn-reject:hover { background: var(--eco-sky-soft); }
body.sustainable-site .cookie-btn-accept { background: var(--eco-sky); color: var(--eco-deep); border-color: #a6d2e2; }
body.sustainable-site .floating-cta { font-size: 12px; }

/* Home: the materials tell the sustainability story; sky blue carries the brand. */
body.home-sustainable .eco-announcement { background: #cfeaf4; color: var(--eco-deep); }
body.home-sustainable .eco-hero h1 em { color: var(--eco-water); }
body.home-sustainable .eco-hero-note, body.home-sustainable .eco-hero-intro { color: #536c77; }
body.home-sustainable .eco-round-note { background: #e8f5f8; color: var(--eco-deep); }
body.home-sustainable .eco-round-note .eco-icon { color: var(--eco-moss); }
body.home-sustainable .eco-values .eco-icon { color: var(--eco-water); }
body.home-sustainable .eco-principles .eco-icon { color: #496343; }
body.home-sustainable .eco-product-visual { background: #e7f1f3; }
body.home-sustainable .eco-product-visual--sage { background: #dceff5; }
body.home-sustainable .eco-product-visual--sand { background: #eee8de; }
body.home-sustainable .eco-water { background: var(--eco-sky-soft); }
body.home-sustainable .eco-water-copy > p:not(.eco-eyebrow) { color: #536c77; }
body.home-sustainable .eco-water-image > span { color: var(--eco-deep); background: #f7faf1e8; }
body.home-sustainable .eco-refill { background: #d5edf5; color: var(--eco-deep); }
body.home-sustainable .eco-refill .eco-eyebrow, body.home-sustainable .eco-refill h2 em { color: var(--eco-water); }
body.home-sustainable .eco-refill-copy > p:not(.eco-eyebrow) { color: #496976; }
body.home-sustainable .eco-refill .eco-btn { background: #fffaf0; border-color: #b4cfd4; }
body.home-sustainable .eco-refill .eco-text-link:hover { color: #153e50; }
body.home-sustainable .eco-about { background: #f0eee5; }
body.home-sustainable .eco-contact { background: #e8f5f8; }
body.home-sustainable .eco-form label, body.home-sustainable .eco-form :is(input,textarea) { color: var(--eco-deep); }
body.home-sustainable .eco-outlet { background: #cce7f0; color: var(--eco-deep); border-color: #b8d7e1; }
body.home-sustainable .eco-text-link:hover { color: var(--eco-water); }
body.home-sustainable .eco-check-list .eco-icon { color: var(--eco-water); }
body.home-sustainable .eco-lightbox { background: #163744; }

/* Reusable editorial layouts, with actual photographs instead of simulated texture. */
.site-photo-hero { display: grid; grid-template-columns: 1fr 1fr; gap: 55px; align-items: center; }
.site-photo-hero > img { display: block; width: 100%; height: 420px; object-fit: cover; border-radius: 100px 5px 5px; }
.site-material-hero { background: var(--eco-sky-soft); padding: 65px 0; }
.site-material-hero h1 { font-size: clamp(37px,4.5vw,66px); line-height: 1.1; margin: 20px 0; color: var(--eco-deep); }
.site-material-hero h1 em { font-family: 'Playfair Display',Georgia,serif; font-weight: 600; color: var(--eco-water); }
.site-material-hero p:not(.site-kicker) { font-size: 16px; line-height: 1.8; color: #536c77; }
.site-material-hero .btn { margin-top: 28px; }
.site-habit-strip { background: var(--eco-cream); border-block: 1px solid var(--eco-line); padding: 22px 0; }
.site-habit-strip .container { display: flex; gap: 26px; justify-content: space-between; flex-wrap: wrap; }
.site-habit-strip span { display: flex; align-items: center; gap: 12px; font-size: 12px; color: var(--eco-deep); }
.site-symbol { width: 27px; height: 27px; stroke: currentColor; stroke-width: 1.5; fill: none; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.site-habit-strip .site-symbol { color: var(--eco-water); }
.site-habit-strip span:last-child .site-symbol { color: var(--eco-moss); }
.site-story-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 65px; align-items: center; }
.site-story-grid > img { width: 100%; height: 450px; object-fit: cover; border-radius: 5px; }
.site-story-grid h2 { font-size: clamp(30px,3.3vw,46px); line-height: 1.2; margin: 15px 0 22px; }
.site-story-grid p { font-size: 15px; line-height: 1.8; margin-bottom: 16px; }
.site-story-grid .btn { margin-top: 12px; }
.site-paper-section { background: #cdb18d url('/assets/images/sustainability/recycled-paper.webp') center / 1050px; padding: 80px 0; }
.site-paper-section h2 { color: #263f49; font-size: clamp(31px,3.5vw,48px); max-width: 700px; margin: 16px 0 30px; }
.site-habit-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 40px; }
.site-habit-grid article { border-top: 1px solid #294d5660; padding-top: 25px; }
.site-habit-grid .site-symbol { width: 38px; height: 38px; margin-bottom: 20px; }
.site-habit-grid h3 { font-size: 23px; margin-bottom: 15px; }
.site-habit-grid p { font-size: 14px; line-height: 1.8; }
.site-habit-grid a { display: inline-block; margin-top: 20px; font-size: 13px; text-underline-offset: 4px; }
.site-choice-list { list-style: none; margin: 25px 0; }
.site-choice-list li { border-bottom: 1px solid var(--eco-line); padding: 18px 0; font-size: 14px; line-height: 1.8; }
.site-choice-list strong { color: var(--eco-water); }

@media (max-width: 1120px) {
    body.sustainable-site .container { width: calc(100% - 64px); }
    body.sustainable-site .nav-wrap { min-height: 72px; }
    body.sustainable-site .nav-modern { background: #f7f7ef; border-color: var(--eco-line); }
    body.sustainable-site .nav-link { font-size: 15px; }
    body.sustainable-site .menu-toggle, body.sustainable-site .mobile-header-contact { color: var(--eco-deep); background: #e2f1f6; border-color: #c4dce4; }
    body.sustainable-site .menu-toggle__bar { background: var(--eco-deep); }
    body.sustainable-site .footer-grid { grid-template-columns: 1fr 1fr; }
    body.sustainable-site .site-reuse-inner { grid-template-columns: 110px 1fr; gap: 25px; }
    body.sustainable-site .site-reuse-inner .btn { grid-column: 2; justify-self: start; }
    body.sustainable-site .site-reuse-inner > img { grid-row: span 2; }
    .site-photo-hero { gap: 30px; }
    .site-story-grid { gap: 35px; }
}
@media (max-width: 760px) {
    body.sustainable-site .container { width: calc(100% - 40px); }
    body.sustainable-site .nav-wrap { min-height: 67px; padding-block: 12px; }
    body.sustainable-site .brand-logo { height: 37px; }
    body.sustainable-site .section { padding-block: 55px; }
    body.sustainable-site .footer-grid { grid-template-columns: 1fr 1fr; gap: 30px 22px; text-align: left; }
    body.sustainable-site .footer-brand-col { grid-column: 1 / -1; }
    body.sustainable-site .footer-contacts li { overflow-wrap: anywhere; }
    body.sustainable-site .footer-social { justify-content: flex-start; }
    body.sustainable-site .footer-top { padding-block: 40px; }
    body.sustainable-site .site-reuse-inner { grid-template-columns: 80px minmax(0,1fr); gap: 20px; }
    body.sustainable-site .site-reuse-inner > img { width: 80px; height: 180px; }
    body.sustainable-site .site-reuse-inner h2 { font-size: 27px; }
    body.sustainable-site .site-reuse-inner p { font-size: 12px; }
    body.sustainable-site .site-reuse-inner .btn { grid-column: 1 / -1; width: 100%; }
    body.sustainable-site .site-reuse-inner .site-kicker { font-size: 8px; }
    .site-photo-hero, .site-story-grid { grid-template-columns: 1fr; gap: 30px; }
    .site-material-hero { padding: 42px 0; }
    .site-photo-hero > img { height: 320px; border-top-left-radius: 75px; }
    .site-story-grid > img { height: 330px; }
    .site-habit-strip .container { gap: 20px; display: grid; grid-template-columns: 1fr 1fr; }
    .site-habit-strip span { font-size: 10px; gap: 8px; }
    .site-habit-grid { grid-template-columns: 1fr; gap: 30px; }
    .site-paper-section { padding-block: 55px; }
}
@media (prefers-reduced-motion: reduce) {
    body.sustainable-site *, body.sustainable-site *::before, body.sustainable-site *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
