/* Shared navigation and utility controls */
.ambient-waves{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse 52% 45% at 5% 80%,rgba(14,115,68,.075),transparent),radial-gradient(ellipse 52% 45% at 95% 18%,rgba(194,47,42,.07),transparent)}
.ambient-waves canvas{display:block;width:100%;height:100%;opacity:.16}
body>.flag-line,body>.site-header,body>main,body>.site-footer{position:relative;z-index:1}
.site-header{background:rgba(245,240,230,.93)}
.hero-copy,.collection,.order-section{background:rgba(245,240,230,.78)}
.story{background:transparent}
.story-copy{background:rgba(232,229,218,.83)}
.intro-band{display:grid;grid-template-columns:1fr;justify-items:center;gap:17px;padding:45px 7vw 52px;text-align:center}
.intro-band p{max-width:1100px;line-height:1.2;overflow-wrap:anywhere}
@media(max-width:510px){.intro-band{gap:13px;padding:33px 6vw 39px}.intro-band p{font-size:clamp(24px,6vw,30px)}}
.hero-visual:focus-visible{outline:3px solid var(--red);outline-offset:-5px}
.hero-visual>.hero-morph-canvas{position:absolute;inset:0;display:block;width:100%;height:100%;opacity:0;transition:opacity .45s}
.hero-visual.is-webgl>.hero-morph-canvas{opacity:1}
.hero-slider-arrows{position:absolute;z-index:3;inset:50% 16px auto;display:none;justify-content:space-between;transform:translateY(-50%);pointer-events:none}
.hero-slider-arrow{pointer-events:auto;display:grid;place-items:center;width:43px;height:43px;padding:0;border:1px solid #ffffff55;border-radius:50%;background:#12251ba8;color:#fff;cursor:pointer;backdrop-filter:blur(6px);transition:background .2s,transform .2s}
.hero-slider-arrow:hover{background:#12251be8;transform:scale(1.07)}
.hero-slider-arrow:focus-visible,.hero-slider-dots button:focus-visible{outline:2px solid #fff;outline-offset:3px}
.hero-slider-arrow svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hero-slider-dots{position:absolute;z-index:3;left:28px;bottom:27px;display:none;align-items:center;gap:8px}
.hero-slider-dots button{width:9px;height:9px;padding:0;border:0;border-radius:99px;background:#ffffff80;cursor:pointer;transition:width .35s,background .35s}
.hero-slider-dots button.is-active{width:26px;background:#fff}
.hero-visual.is-ready .hero-slider-arrows,.hero-visual.is-ready .hero-slider-dots{display:flex}
.hero-visual{touch-action:pan-y}
.order-topline{justify-content:flex-end}
.steps .step-icon{display:grid;place-items:center;width:66px;height:66px;border:1px solid #b7a99b;border-radius:50%;background:#faf7ef;color:var(--red);font-size:0;line-height:0}
.steps .step-icon svg{display:block;width:35px;height:35px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.steps h3{margin-top:24px}
.skip-link{position:absolute;left:18px;top:-80px;z-index:1000;background:var(--ink);color:#fff;padding:12px 18px}
.skip-link:focus{top:12px}
.site-header{justify-content:space-between}
.main-nav{margin:0 0 0 auto;gap:32px}
.main-nav a{padding:8px 0;border-bottom:2px solid transparent}
.main-nav a[aria-current="page"]{color:var(--green);border-bottom-color:var(--red)}
.footer-bottom nav{display:flex;gap:18px;flex-wrap:wrap}
.footer-location{font-size:11px;line-height:1.7;color:#b6c6b8;margin:8px 0 0}
.floating-whatsapp{position:fixed;right:23px;bottom:24px;z-index:50;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;color:#fff;background:#1d794b;box-shadow:0 8px 24px #14291c50;transition:transform .2s,background .2s}
.floating-whatsapp:hover{transform:translateY(-4px);background:#14623b}
.floating-whatsapp:focus-visible{outline:3px solid #fff;outline-offset:3px}
.product-meta>.product-order{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px 11px;background:#e4ede4;color:var(--green);font-size:12px;font-weight:750;line-height:1;white-space:nowrap;text-align:left;transition:background .2s,color .2s}
.product-order svg{width:18px;height:18px;flex:none}
.product-card:hover .product-order{background:var(--green);color:#fff}

/* Editorial content on the homepage */
.seo-editorial{background:#f0ede3}
.editorial-lead{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr);gap:18px 8vw;align-items:end;margin:65px 0 56px}
.editorial-lead .kicker{grid-column:1/-1}
.editorial-lead h2,.about-prose h2,.about-values h2,.contact-details h2,.contact-note h2,.contact-faq h2{font:400 clamp(47px,5.2vw,82px)/1.04 var(--serif);letter-spacing:-.065em;margin:0}
.editorial-lead em,.about-prose em,.about-values em,.contact-details em,.contact-note em,.contact-faq em,.page-hero h1 em,.wholesale-band h2 em{color:var(--red);font-weight:400}
.editorial-lead p,.about-prose p{max-width:510px;font-size:15px;line-height:1.85;color:#4c564b;margin:0}
.editorial-grid,.guide-grid,.contact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.editorial-grid article,.guide-grid article,.contact-grid article{padding:38px;background:var(--paper);border-top:3px solid var(--green)}
.editorial-grid article{display:flex;flex-direction:column;align-items:flex-start}
.editorial-grid article:nth-child(2),.guide-grid article:nth-child(2),.contact-grid article:nth-child(2){border-top-color:var(--red)}
.editorial-grid article>span,.guide-grid article>span,.contact-grid article>span{font-size:10px;letter-spacing:.17em;color:var(--green);font-weight:750}
.editorial-grid h3,.guide-grid h3,.contact-grid h3{font:400 31px/1.12 var(--serif);letter-spacing:-.045em;margin:35px 0 14px}
.editorial-grid p,.guide-grid p,.contact-grid p{font-size:14px;line-height:1.8;color:var(--muted);max-width:480px;margin:0 0 25px}
.editorial-grid a,.contact-grid a{font-size:12px;font-weight:750;border-bottom:1px solid var(--ink);padding-bottom:7px}
.editorial-grid a{margin-top:auto}

/* Interior pages */
.page-hero{display:grid;grid-template-columns:54% 46%;min-height:590px;background:#eee9dd}
.page-hero-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:70px 8vw 75px 7vw}
.page-hero h1{font:400 clamp(60px,6vw,96px)/.99 var(--serif);letter-spacing:-.075em;margin:28px 0}
.page-hero-copy>p{font-size:16px;line-height:1.78;color:#4c564b;max-width:520px;margin:0 0 18px}
.page-hero-image{position:relative;min-height:590px;overflow:hidden;background:#cec3aa}
.page-hero-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 55%}
.page-hero .text-link{margin-top:22px}
.contact-hero .button{margin-top:25px}
.shop-guide{background:#eeeadf}
.guide-grid article{background:#f9f6ef}
.wholesale-band{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center;padding:85px 7vw;background:var(--green);color:#fff}
.wholesale-band .kicker{color:#e1bfb4}
.wholesale-band h2{font:400 clamp(45px,5vw,75px)/1.05 var(--serif);letter-spacing:-.06em;margin:18px 0 0}
.wholesale-band h2 em{color:#f1d1bb}
.wholesale-band p{font-size:16px;line-height:1.8;max-width:490px;margin:0 0 26px;color:#e7ede3}
.faq-section h2,.contact-faq h2{font:400 clamp(47px,5vw,75px)/1.05 var(--serif);letter-spacing:-.06em;margin:55px 0 35px}
.faq-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px}
.faq-list article{border-top:1px solid var(--line);padding:22px 0 26px}
.faq-list h3{font:400 26px/1.2 var(--serif);letter-spacing:-.03em;margin:0 0 10px}
.faq-list p{font-size:14px;line-height:1.75;color:var(--muted);margin:0;max-width:600px}
.about-intro{background:var(--paper)}
.about-prose{max-width:850px;margin:60px auto 0}
.about-prose h2{margin:16px 0 30px}
.about-prose p{max-width:770px;margin:0 0 20px;font-size:16px}
.about-photo-grid{display:grid;grid-template-columns:1fr 1fr;height:540px;overflow:hidden}
.about-photo-grid img{width:100%;height:100%;object-fit:cover;object-position:center 50%}
.about-values h2{margin:60px 0 42px}
.values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.values-grid article{border-top:1px solid var(--line);padding:24px 22px 0 0}
.values-grid span{font:italic 35px var(--serif);color:var(--red)}
.values-grid h3{font:400 28px var(--serif);letter-spacing:-.03em;margin:25px 0 12px}
.values-grid p{font-size:14px;line-height:1.75;color:var(--muted);margin:0}
.contact-details h2,.contact-faq h2{margin:55px 0 38px}
.contact-grid article{background:var(--paper)}
.contact-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.contact-grid h3{font-size:35px}
.contact-note{display:grid;grid-template-columns:1fr 1fr;gap:8vw;background:#eee9dd}
.contact-note h2{margin:17px 0 0}
.contact-note ul{margin:0;padding:0;list-style:none}
.contact-note li{display:flex;gap:18px;align-items:center;border-bottom:1px solid var(--line);padding:17px 0;font-size:15px;line-height:1.6}
.contact-faq .text-link{margin-top:28px}

@media(max-width:1000px){.main-nav{gap:18px}.editorial-lead{gap:18px 4vw}.page-hero-copy{padding-left:5vw;padding-right:5vw}.wholesale-band{gap:4vw}.contact-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-grid article:last-child{grid-column:1/-1}}
@media(max-width:760px){.main-nav{margin:4px 0 0}.page-hero{grid-template-columns:1fr}.page-hero-copy{padding:65px 6vw}.page-hero-image{min-height:0;height:65vw;max-height:560px}.editorial-lead{display:block}.editorial-lead h2{margin:16px 0 25px}.editorial-grid,.guide-grid,.contact-grid,.faq-list,.wholesale-band,.contact-note{grid-template-columns:1fr}.contact-grid article:last-child{grid-column:auto}.wholesale-band{gap:30px;padding:70px 6vw}.about-photo-grid{height:420px}.values-grid{gap:15px}.footer-bottom nav{order:3;width:100%}}
@media(max-width:510px){.main-nav{justify-content:space-between}.main-nav a{font-size:11px}.page-hero h1{font-size:clamp(55px,13vw,72px)}.page-hero-copy>p{font-size:14px}.page-hero-image{height:85vw}.editorial-lead h2,.about-prose h2,.about-values h2,.contact-details h2,.contact-note h2,.contact-faq h2{font-size:48px}.editorial-grid article,.guide-grid article,.contact-grid article{padding:27px}.about-photo-grid{height:350px}.values-grid{grid-template-columns:1fr}.values-grid article{padding:22px 0}.floating-whatsapp{width:54px;height:54px;right:15px;bottom:15px}.footer-bottom nav{gap:12px;line-height:1.8}.hero-slider-dots{left:20px;bottom:22px}.hero-slider-arrow{width:38px;height:38px}.hero-caption{bottom:25px;font-size:8px}.steps .step-icon{width:58px;height:58px}.steps .step-icon svg{width:31px;height:31px}}
@media(prefers-reduced-motion:reduce){.floating-whatsapp,.hero-visual>.hero-morph-canvas,.hero-slider-arrow,.hero-slider-dots button{transition:none}}

/* Number-free icons for the site's short information lists. */
.feature-icon,.list-icon{display:grid;place-items:center;flex:none;width:56px;height:56px;border:1px solid #d5c8b9;border-radius:50%;background:#f8f4e9;color:var(--red)}
.feature-icon svg,.list-icon svg{display:block;width:29px;height:29px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.values-grid .feature-icon{font:normal 16px var(--sans);color:var(--red)}
.values-grid h3{margin-top:20px}
.contact-grid .feature-icon{margin-bottom:19px}
.contact-grid .contact-method{display:block;font-size:10px;letter-spacing:.17em;color:var(--green);font-weight:750}
.contact-grid h3{margin-top:17px}
.contact-note .list-icon{width:44px;height:44px;border-color:#d6cabe;background:#faf7ef}
.contact-note .list-icon svg{width:23px;height:23px}
.guide-marker{display:flex;align-items:center;gap:16px}
.guide-marker>span:last-child{font-size:10px;letter-spacing:.17em;color:var(--green);font-weight:750}
.guide-grid h3{margin-top:25px}
@media(min-width:761px){.story,.story-image-main{min-height:660px}}
.story-copy{justify-content:center}
@media(max-width:760px){.story-copy{min-height:0}}

/* React Bits Accordion Gallery behavior, adapted to the existing PHP site. */
.shop-hero .page-hero-image{background:#193b2a}
.accordion-gallery{position:absolute;inset:0;display:flex;gap:7px;padding:10px;overflow:hidden;background:#193b2a}
.accordion-panel{position:relative;flex:1 1 0;min-width:0;overflow:hidden;border:0;border-radius:7px;padding:0;background:#7b916d;color:#fff;cursor:pointer;isolation:isolate;transition:flex-grow .7s cubic-bezier(.22,1,.36,1)}
.accordion-panel.is-active{flex-grow:5}
.accordion-panel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 48%;transform:scale(1.16) translateX(-2%);transition:transform .9s cubic-bezier(.22,1,.36,1),filter .5s;filter:saturate(.84)}
.accordion-panel.is-active img{transform:scale(1.03) translateX(0);filter:saturate(1)}
.accordion-panel:nth-child(2) img{object-position:53% 48%}
.accordion-panel:nth-child(4) img{object-position:56% 50%}
.accordion-panel:after{content:"";position:absolute;inset:48% 0 0;background:linear-gradient(transparent,#102319b8);opacity:.55;transition:opacity .5s;pointer-events:none}
.accordion-panel.is-active:after{opacity:1}
.accordion-caption{position:absolute;z-index:1;left:22px;right:12px;bottom:24px;display:block;overflow:hidden;color:#fff;text-align:left;white-space:nowrap;font-size:10px;font-weight:750;letter-spacing:.14em;text-transform:uppercase;opacity:0;transform:translateY(12px);transition:opacity .45s,transform .5s;pointer-events:none}
.accordion-caption strong{display:block;margin-top:5px;font:italic 28px/1.05 var(--serif);letter-spacing:-.04em;text-transform:none}
.accordion-panel.is-active .accordion-caption{opacity:1;transform:translateY(0)}
.accordion-panel:focus-visible{outline:3px solid #fff;outline-offset:-6px;z-index:2}
@media(max-width:760px){.shop-hero .page-hero-image{height:72vw;min-height:350px;max-height:520px}}
@media(max-width:510px){.accordion-gallery{gap:4px;padding:6px}.accordion-panel{border-radius:4px}.accordion-panel.is-active{flex-grow:5.6}.accordion-caption{left:12px;bottom:16px;font-size:8px}.accordion-caption strong{font-size:21px}.shop-hero .page-hero-image{height:95vw;min-height:330px;max-height:440px}}
@media(prefers-reduced-motion:reduce){.accordion-panel,.accordion-panel img,.accordion-panel:after,.accordion-caption{transition:none!important}}

/* Keep the flag-colored motion behind the copy at a reading-safe opacity. */
.seo-editorial{background:rgba(240,237,227,.84)}
.page-hero,.shop-guide,.contact-note{background:rgba(238,233,221,.84)}
.about-intro{background:rgba(251,248,241,.86)}

/* Electric outlines frame every sales card on the home and shop pages. */
.product-grid{gap:24px}
.product-card{position:relative;isolation:isolate;display:flex;flex-direction:column;padding:10px 10px 20px;border:1px solid #25744d70;border-radius:15px;background:var(--paper);box-shadow:0 14px 32px #172a1e0d;transition:transform .3s,box-shadow .3s}
.product-card:nth-child(even){border-color:#aa413d78}
.product-card:hover,.product-card:focus-visible{transform:translateY(-7px);box-shadow:0 20px 38px #172a1e1c}
.product-card:focus-visible{outline:3px solid var(--red);outline-offset:7px}
.product-electric{position:absolute;inset:-16px;z-index:2;display:block;pointer-events:none}
.product-electric canvas{display:block;width:100%;height:100%}
.product-image{border-radius:9px}
.product-info{position:relative;z-index:1;display:flex;flex:1;flex-direction:column;padding:22px 11px 0}
.product-meta{margin-top:auto;padding-top:16px}
.product-info>p{margin-bottom:20px}

/* A perspective photo wall, inspired by React Bits Drift Wall. */
.drift-gallery{position:relative;overflow:hidden;background:#153426;color:#f8f5ed}
.drift-gallery-heading{display:flex;align-items:end;justify-content:space-between;gap:5vw;padding-top:86px;padding-bottom:44px}
.drift-gallery-heading .kicker{color:#e7b9a5}
.drift-gallery-heading h2{font:400 clamp(50px,5.3vw,82px)/1.04 var(--serif);letter-spacing:-.065em;margin:16px 0 0}
.drift-gallery-heading h2 em{color:#e7b9a5;font-weight:400}
.drift-gallery-heading p{max-width:390px;margin:0 0 7px;color:#d9e4d7;font-size:15px;line-height:1.8}
.drift-wall-stage{height:530px;overflow:hidden;perspective:1200px;position:relative;background:radial-gradient(ellipse 65% 65% at 48% 45%,#3b624835,transparent)}
.drift-wall-stage:before,.drift-wall-stage:after{content:"";position:absolute;z-index:2;left:0;right:0;height:60px;pointer-events:none}
.drift-wall-stage:before{top:0;background:linear-gradient(#153426,transparent)}
.drift-wall-stage:after{bottom:0;background:linear-gradient(transparent,#153426)}
.drift-wall{--gallery-tilt-x:10deg;--gallery-tilt-y:-11deg;position:relative;left:50%;display:flex;justify-content:center;gap:17px;width:max-content;min-width:100%;height:100%;transform-style:preserve-3d;transform:translateX(-50%) rotateX(var(--gallery-tilt-x)) rotateY(var(--gallery-tilt-y)) translateZ(-42px) scale(1.055);transition:transform .35s ease-out}
.drift-column{flex:0 0 clamp(205px,18vw,250px);height:100%;overflow:visible;transform-style:preserve-3d}
.drift-track{display:flex;flex-direction:column;animation:drift-up 34s linear infinite;will-change:transform;transform-style:preserve-3d}
.drift-column:nth-child(2) .drift-track{animation-name:drift-down;animation-duration:39s}
.drift-column:nth-child(3) .drift-track{animation-duration:31s}
.drift-column:nth-child(4) .drift-track{animation-name:drift-down;animation-duration:36s}
.drift-column:nth-child(5) .drift-track{animation-duration:42s}
.drift-set{display:flex;flex-direction:column;gap:16px;padding-bottom:16px;transform-style:preserve-3d}
.drift-tile{position:relative;display:block;width:100%;height:174px;overflow:hidden;padding:0;border:1px solid #ffffff33;border-radius:12px;background:#2d4a36;color:#fff;cursor:zoom-in;box-shadow:0 12px 25px #0003;transform:translateZ(0);transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease}
.drift-tile img{width:100%;height:100%;object-fit:cover;object-position:center 55%;filter:saturate(.9);transition:filter .35s ease,transform .5s ease}
.drift-tile:hover,.drift-tile:focus-visible{z-index:3;transform:translateZ(56px) scale(1.07);border-color:#f8efe2;box-shadow:0 20px 45px #0007}
.drift-tile:hover img,.drift-tile:focus-visible img{filter:saturate(1.1);transform:scale(1.04)}
.drift-tile:focus-visible{outline:3px solid #fff;outline-offset:4px}
.drift-wall-stage:hover .drift-track,.drift-wall-stage:focus-within .drift-track,.drift-wall-stage.is-paused .drift-track,.drift-wall-stage.is-offscreen .drift-track{animation-play-state:paused}
.drift-gallery-foot{display:flex;justify-content:space-between;gap:20px;padding:21px 7vw 30px;color:#b8d0bc;font-size:9px;font-weight:700;letter-spacing:.18em}
@keyframes drift-up{from{transform:translateY(0)}to{transform:translateY(-50%)}}
@keyframes drift-down{from{transform:translateY(-50%)}to{transform:translateY(0)}}

/* Full-size viewing stays separate from the moving wall. */
.gallery-dialog{width:min(1100px,94vw);max-width:94vw;max-height:90vh;margin:auto;padding:0;border:1px solid #d8d2c46b;border-radius:15px;background:#142b20;color:#fff;box-shadow:0 30px 90px #0009;overflow:hidden}
.gallery-dialog[open]{animation:gallery-open .3s ease-out both}
.gallery-dialog::backdrop{background:#07120cdb;backdrop-filter:blur(7px)}
.gallery-dialog-bar{height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 18px 0 25px;border-bottom:1px solid #ffffff24;font-size:10px;font-weight:700;letter-spacing:.2em}
.gallery-dialog-close{width:39px;height:39px;border:1px solid #ffffff55;border-radius:50%;background:transparent;color:#fff;font-size:25px;line-height:1;cursor:pointer}
.gallery-dialog-body{display:grid;grid-template-columns:65px minmax(0,1fr) 65px;align-items:center;min-height:0;padding:10px 20px 18px}
.gallery-dialog figure{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;margin:0}
.gallery-dialog figure img{width:auto;max-width:100%;max-height:calc(90vh - 135px);object-fit:contain;border-radius:4px}
.gallery-dialog figcaption{padding:14px 0 0;color:#e9e1d2;font:italic 18px var(--serif);text-align:center}
.gallery-dialog-nav{width:44px;height:44px;justify-self:center;border:1px solid #ffffff6b;border-radius:50%;background:#ffffff18;color:#fff;font:30px/1 var(--serif);cursor:pointer;transition:background .2s,transform .2s}
.gallery-dialog-nav:hover,.gallery-dialog-close:hover{background:#ffffff32;transform:scale(1.05)}
.gallery-dialog button:focus-visible{outline:2px solid #fff;outline-offset:4px}
@keyframes gallery-open{from{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}

@media(max-width:760px){.product-grid{gap:25px 16px}.drift-gallery-heading{display:block;padding-top:65px;padding-bottom:26px}.drift-gallery-heading p{margin-top:23px}.drift-wall-stage{height:440px}.drift-gallery-foot{padding-left:6vw;padding-right:6vw}.drift-column{flex-basis:200px}.drift-tile{height:158px}}
@media(max-width:510px){.product-grid{gap:35px}.drift-gallery-heading h2{font-size:51px}.drift-gallery-heading p{font-size:14px}.drift-wall-stage{height:400px}.drift-gallery-foot span:last-child{display:none}.gallery-dialog{width:100vw;max-width:100vw;max-height:100vh;border-radius:0}.gallery-dialog-body{grid-template-columns:42px minmax(0,1fr) 42px;padding:8px 3px 18px}.gallery-dialog figure img{max-height:calc(100vh - 160px)}.gallery-dialog-nav{width:35px;height:35px;font-size:25px}.gallery-dialog figcaption{font-size:15px}}
@media(prefers-reduced-motion:reduce){.drift-track{animation:none!important}.drift-wall,.drift-tile,.drift-tile img,.gallery-dialog[open]{transition:none!important;animation:none!important}}
