@font-face{font-family:"Caveat";src:url("assets/fonts/Caveat-VariableFont-wght.woff2") format("woff2"),url("assets/fonts/Caveat-VariableFont-wght.ttf") format("truetype");font-style:normal;font-weight:500 700;font-display:swap}
@font-face{font-family:"Outfit";src:url("assets/fonts/Outfit-VariableFont-wght.woff2") format("woff2"),url("assets/fonts/Outfit-VariableFont-wght.ttf") format("truetype");font-style:normal;font-weight:100 900;font-display:swap}
:root{--flame:#fd932d;--glow:#fecf7a;--charcoal:#503f2e;--deep:#3a2c1f;--ivory:#fcf6ec;--dim:#f0e7d5;--white:#fff;--text:#7a6551;--muted:#9b8f7e;--caption:#b5aa9d;--border:#d7c5a8;--font-body:"Outfit","Segoe UI",system-ui,sans-serif;--font-script:"Caveat","Segoe Print",cursive;--shadow:0 10px 28px rgb(58 44 31 / .10);--ease:cubic-bezier(.16,1,.3,1)}
::placeholder{color:var(--caption);opacity:1}
:where(.caption, [class*="__caption"], [class*="__hint"], [class*="__placeholder"]) {color:var(--caption)}
html.fonts-loading .brand-copy,html.fonts-loading .hero-wordmark,html.fonts-loading h1,html.fonts-loading .facts strong{visibility:hidden}
html.fonts-loading .reveal-item,html.fonts-loading .reveal-fade-item{visibility:hidden}
html.fonts-ready .reveal-item:not(.is-revealed),html.fonts-ready .reveal-fade-item:not(.is-revealed){visibility:hidden}
html.fonts-ready .brand-copy{animation:font-ready-enter .3s ease-out both}
@keyframes font-ready-enter{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{hyphens:none;margin:0;background:var(--ivory);color:var(--charcoal);font:16px/1.5 var(--font-body)}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.container{width:min(1100px,calc(100% - 48px));margin-inline:auto}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.skip-link{background:var(--flame);color:#fff;left:16px;padding:10px 14px;position:fixed;top:-60px;z-index:200}.skip-link:focus{top:16px}
.site-header{background:rgb(255 255 255 / .96);border-bottom:1px solid var(--dim);box-shadow:0 1px 3px rgb(80 63 46 / .1);position:sticky;top:0;z-index:100}.header-inner{align-items:center;display:flex;height:68px;justify-content:space-between}.brand{align-items:center;display:flex;gap:12px}.brand img{height:40px;width:40px}.brand-copy{display:grid;line-height:1}.brand-copy b{color:var(--charcoal);font:600 1.35rem/.88 var(--font-script);letter-spacing:.04em}.brand-copy small{color:var(--flame);font-size:.5rem;font-weight:700;letter-spacing:.2em;margin-top:4px;text-align:center;text-transform:uppercase}.brand-copy small .brand-dot{display:inline-block;vertical-align:-0.08em}.site-nav{align-items:center;display:flex;gap:32px}.site-nav>a:not(.button){color:var(--text);font-weight:600;position:relative}.site-nav>a:not(.button)::after{background:var(--flame);bottom:-8px;content:"";height:2px;left:0;position:absolute;transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease);width:100%}.site-nav>a:not(.button):hover::after{transform:scaleX(1)}.menu-toggle{display:none}
.button{align-items:center;background:var(--flame);border:1.5px solid var(--flame);border-radius:999px;box-shadow:0 5px 14px rgb(253 147 45 / .26);color:#fff;cursor:pointer;display:inline-flex;font-size:16px;font-weight:700;justify-content:center;line-height:1;min-height:44px;padding:0 28px;transition:transform .25s var(--ease),background .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease)}.button:hover{background:#e17a16;border-color:#e17a16;box-shadow:0 7px 18px rgb(80 63 46 / .2);transform:translateY(-2px)}.button:active{transform:scale(.97)}.button--small{font-size:14px;min-height:36px;padding:0 18px}.button--light{background:var(--glow);border-color:var(--glow);box-shadow:none;color:var(--deep)}.button--light:hover{background:#fff;border-color:#fff;color:var(--deep)}.button--cream-outline{background:transparent;border-color:rgb(252 246 236 / .7);box-shadow:none}.button--cream-outline:hover{background:var(--ivory);border-color:var(--ivory);color:var(--charcoal)}
.hero{background:var(--charcoal);isolation:isolate;overflow:hidden;position:relative}.hero-glow{background:radial-gradient(circle,rgba(253,147,45,.26),transparent 65%);height:720px;left:48%;position:absolute;top:-230px;width:720px;z-index:-1}.hero-grid{align-items:center;display:grid;gap:70px;grid-template-columns:1.05fr .95fr;min-height:620px;padding-block:84px}.hero-wordmark{display:inline-grid;justify-items:center;margin-bottom:24px}.hero-wordmark>strong{color:var(--glow);font:600 clamp(4.5rem,9vw,7.4rem)/.8 var(--font-script)}.hero-wordmark>span{align-items:center;color:var(--flame);display:grid;font-size:.8rem;font-weight:700;gap:8px;grid-template-columns:minmax(0,1fr) auto auto auto minmax(0,1fr);letter-spacing:.3em;margin-top:18px;text-transform:uppercase;width:92%}.hero-wordmark i{background:currentColor;border-radius:99px;height:2px}.hero-wordmark em{background:currentColor;border-radius:50%;height:3px;width:3px}.hero-wordmark b{font:inherit;padding-left:.3em}.hero-intro{color:rgb(254 207 122 / .76);font-size:1rem;line-height:1.6;max-width:510px}.hero h1{color:var(--ivory);font-size:clamp(2.1rem,4vw,3.4rem);font-weight:500;letter-spacing:.02em;line-height:1.12;margin:28px 0}.hero h1 em{color:var(--glow);font-family:var(--font-script);font-size:1.15em;font-style:normal;font-weight:700}.hero-animation{align-items:center;background:rgb(252 246 236 / .045);border:1px solid rgb(254 207 122 / .18);border-radius:8px;display:flex;height:390px;justify-content:center;max-width:360px;justify-self:center;width:100%}.hero-animation svg{animation:logo-stage-float 5s ease-in-out infinite;border:0;filter:drop-shadow(0 14px 28px rgb(253 147 45 / .18));height:100%;transform:translateY(11px) rotate(-.6deg);transform-origin:center;width:100%}
.section{padding:96px 0}.section-heading{margin:0 auto 52px;text-align:center}.eyebrow{color:var(--flame);font-size:.74rem;font-weight:700;letter-spacing:.18em;margin:0 0 10px;text-transform:uppercase}.section h2,.shop-banner h2{font-size:clamp(2.25rem,4vw,3.4rem);line-height:1.05;margin:0 0 14px}.section-heading>p:not(.eyebrow):not(.product-note){color:var(--text);font-size:1.1rem}.product-note{color:var(--muted);font-size:.9rem;margin:12px auto 24px;max-width:640px}.product-note b{color:var(--text)}.product-note span{color:var(--flame);padding-inline:4px}.filter-bar{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.filter{background:transparent;border:1.5px solid var(--muted);border-radius:999px;color:var(--text);cursor:pointer;padding:7px 18px;transition:.3s var(--ease)}.filter:hover{background:var(--dim)}.filter.is-active{background:var(--flame);border-color:var(--flame);color:#fff;font-weight:600}.product-grid{display:grid;gap:24px;grid-template-columns:repeat(2,1fr)}.product-card{background:#fff;border:1px solid var(--border);border-radius:8px;box-shadow:var(--shadow);display:grid;grid-template-columns:minmax(180px,.95fr) 1.05fr;overflow:hidden;transition:box-shadow .3s var(--ease),transform .3s var(--ease)}.product-card:hover{box-shadow:0 14px 36px rgb(58 44 31 / .16);transform:translateY(-3px)}.product-card[hidden]{display:none}.product-image{background:var(--dim);min-height:290px;overflow:hidden}.product-image img{display:block;height:100%;object-fit:cover;transition:transform .45s var(--ease),opacity .12s var(--ease);width:100%}.product-card:hover .product-image img{transform:scale(1.035)}.product-body{align-self:center;padding:28px}.product-body h3{font-size:1.45rem;margin:0 0 8px}.product-body p{color:var(--text);font-size:.95rem;margin:0 0 18px}.swatches{display:flex;gap:9px;margin-bottom:15px}.swatch{background:var(--swatch);border:2px solid transparent;border-radius:50%;box-shadow:0 0 0 1px rgb(80 63 46 / .18);cursor:pointer;height:23px;padding:0;transition:transform .22s var(--ease),border-color .22s var(--ease);width:23px}.swatch:hover{transform:scale(1.12)}.swatch.is-active{border-color:var(--flame);box-shadow:0 0 0 1px var(--flame)}.scent-tags{display:flex;flex-wrap:wrap;gap:6px}.scent-tags .scent-tag{background:var(--dim);border:1px solid transparent;border-radius:999px;color:var(--charcoal);cursor:pointer;font-size:.72rem;font-weight:600;padding:4px 8px}.scent-tags .scent-tag:hover{border-color:var(--flame)}.scent-tags .scent-tag.is-active{background:var(--flame);border-color:var(--flame);color:#fff}.swatch:focus-visible,.scent-tags .scent-tag:focus-visible{outline:3px solid var(--charcoal);outline-offset:3px}
.about{background:#fffaf2;border-block:1px solid var(--dim)}.about-grid{align-items:center;display:grid;gap:50px;grid-template-columns:.72fr 1.28fr}.about-logo{filter:drop-shadow(0 12px 20px rgb(253 147 45 / .13));max-width:260px;width:100%}.about p{color:var(--text);line-height:1.7}.about .large-copy{font-size:1.1rem;margin-bottom:18px}.facts{display:grid;gap:12px;grid-column:2;grid-template-columns:repeat(3,1fr)}.facts div{background:#fff;border:1px solid var(--dim);border-radius:8px;padding:22px;text-align:center}.facts strong{color:var(--flame);display:block;font:700 2.2rem/1 var(--font-script)}.facts span{color:var(--muted);display:block;font-size:.82rem;margin-top:6px}
.shop-banner{background:var(--flame);color:#fff;padding:76px 0;text-align:center}.shop-banner .eyebrow{color:rgb(255 255 255 / .75)}.shop-banner h2{margin-bottom:12px}.shop-banner>div>p:not(.eyebrow){color:rgb(255 255 255 / .9);font-size:1.1rem}.shop-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:24px}.contact-inner{align-items:start;display:grid;gap:70px;grid-template-columns:.9fr 1.1fr}.contact p:not(.eyebrow){color:var(--text);font-size:1.05rem}.contact-form{background:#fff;border:1px solid var(--border);border-radius:8px;box-shadow:var(--shadow);display:grid;gap:16px;padding:28px}.contact-form label{color:var(--charcoal);display:grid;font-size:.9rem;font-weight:600;gap:6px}.contact-form input,.contact-form textarea{background:#fff;border:1.5px solid var(--muted);border-radius:8px;color:var(--charcoal);outline:0;padding:11px 14px;transition:border-color .2s var(--ease),box-shadow .2s var(--ease)}.contact-form textarea{resize:vertical}.contact-form input:focus,.contact-form textarea:focus{border-color:var(--flame);box-shadow:0 0 0 3px rgb(253 147 45 / .16)}.contact-form .button{justify-self:start}.form-response{color:var(--flame);font-weight:600;margin:0;min-height:1.5em}
.site-footer{background:var(--charcoal);color:rgb(252 246 236 / .72);padding:54px 0 26px}.footer-grid{display:grid;gap:48px;grid-template-columns:2fr 1fr 1fr}.footer-grid img{height:64px;width:auto}.footer-grid p{font-size:.9rem;line-height:1.7;max-width:300px}.footer-grid>div:not(:first-child){display:grid;align-content:start;gap:8px}.footer-grid b{color:rgb(254 207 122 / .6);font-size:.67rem;letter-spacing:.13em;margin-bottom:5px;text-transform:uppercase}.footer-grid a{font-size:.9rem;transition:color .2s}.footer-grid a:hover{color:var(--glow)}.copyright{border-top:1px solid rgb(255 255 255 / .1);display:flex;font-size:.75rem;gap:12px;justify-content:space-between;margin-top:36px;padding-top:22px}
@media(max-width:760px){.container{width:min(100% - 32px,1100px)}.site-nav{background:#fff;border-bottom:1px solid var(--dim);box-shadow:0 12px 18px rgb(58 44 31 / .08);display:none;gap:18px;left:0;padding:20px 16px 24px;position:fixed;top:68px;width:100%;z-index:101}.site-nav.is-open{display:grid}.site-nav .button{justify-self:start}.menu-toggle{background:transparent;border:0;cursor:pointer;display:grid;gap:5px;padding:8px}.menu-toggle span{background:var(--charcoal);display:block;height:2px;transition:.25s var(--ease);width:24px}.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.hero-grid{gap:40px;grid-template-columns:1fr;min-height:0;padding-block:64px}.hero-animation{height:280px}.hero-wordmark>strong{font-size:5.5rem}.product-grid{grid-template-columns:1fr}.product-card{grid-template-columns:.8fr 1.2fr}.about-grid{grid-template-columns:1fr}.about-logo{max-width:210px}.facts{grid-column:auto}.contact-inner{gap:32px;grid-template-columns:1fr}.footer-grid{gap:28px;grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}.copyright{align-items:start;flex-direction:column}.section{padding:70px 0}}@media(max-width:500px){.shop-actions{align-items:stretch;flex-direction:column}.shop-actions .button{width:100%}.hero-wordmark>strong{font-size:4.75rem}.product-card{grid-template-columns:1fr}.product-image{min-height:245px}.facts{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:auto}.section-heading{margin-bottom:34px}.filter{padding:6px 13px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
/* Hero animation caption */
.hero-visual{align-items:center;align-self:center;display:flex;flex-direction:column;justify-self:center;max-width:360px;width:100%}.hero-visual>.badge{margin:20px 0 0;width:max-content;max-width:100%}
.hero-copy>.badge{margin:20px 0 0;width:max-content;max-width:100%}
@media(max-width:760px){.hero-copy{align-items:center;display:flex;flex-direction:column;text-align:center}.hero-intro{margin-inline:auto}}
@media(min-width:761px){.site-nav{gap:27px}}
@media(min-width:761px){.hero-copy{align-items:flex-start;display:flex;flex-direction:column;height:390px;justify-content:center}}
@media(min-width:761px){.hero-wordmark{margin-bottom:14px}.hero h1{margin:20px 0}.hero-copy>.badge{margin-top:14px}}
.footer-grid a.footer-meska,.footer-grid .button[href="https://www.meska.hu/shop/CicaLang"]{background:transparent;border:0;box-shadow:none;color:inherit;font-size:.9rem;font-weight:400;justify-content:start;min-height:0;padding:0;line-height:1.5}.footer-grid a.footer-meska:hover,.footer-grid .button[href="https://www.meska.hu/shop/CicaLang"]:hover{background:transparent;color:var(--glow);transform:none}

/* Keep the desktop hero lockup aligned with the animation frame. */
@media(min-width:761px){
  .hero-copy{display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:390px;justify-content:normal}
  .hero-wordmark{margin-bottom:0}
  .hero-middle{align-self:center}
  .hero-copy>.badge{margin-top:0}
}

/* The larger submark keeps the lockup's horizontal rules intentionally shorter. */
.hero-wordmark>span{width:84%}
.hero-wordmark b{font-size:1.18em;line-height:1}

/* Make the submark span exactly the width of the CicaLáng wordmark. */
.hero-wordmark{justify-self:start;max-width:100%;width:max-content}
.hero-wordmark>strong{font-size:clamp(4.5rem,8vw,6.1rem)}
.hero-wordmark>span{font-size:clamp(1rem,1.6vw,1.25rem);width:100%}
.hero-wordmark b{font-size:1.3em}

/* Balanced desktop scale: let the supporting copy carry a little more weight. */
@media(min-width:761px){
  .hero-wordmark>strong{font-size:clamp(4.25rem,7vw,5.5rem)}
  .hero-wordmark>span{font-size:clamp(.9rem,1.35vw,1.1rem)}
  .hero-wordmark b{font-size:1.28em}
  .hero-intro{font-size:clamp(1rem,1.7vw,1.2rem)}
  .hero h1{font-size:clamp(2rem,3.4vw,3rem)}
}

@media(max-width:760px){
  .hero-middle{width:100%}
}
.footer-social-icons{display:flex;gap:8px;margin:13px 0 14px}.footer-social-icons a{align-items:center;background:var(--dim);border-radius:50%;display:flex;height:32px;justify-content:center;transition:background .25s var(--ease),transform .25s var(--ease);width:32px}.footer-social-icons a:hover{background:var(--flame);transform:translateY(-2px)}.footer-social-icons a:hover img{filter:brightness(0) invert(1)}.footer-social-icons img{height:16px;width:16px}.footer-grid .button[href="https://www.meska.hu/shop/CicaLang"]{background:var(--flame);border:1.5px solid var(--flame);box-shadow:0 5px 14px rgb(253 147 45 / .26);color:#fff;font-size:14px;font-weight:700;justify-content:center;min-height:36px;padding:0 18px}.footer-grid .button[href="https://www.meska.hu/shop/CicaLang"]:hover{background:#e17a16;border-color:#e17a16;color:#fff;transform:none}
.home-page main>.about,.home-page main>.shop-banner,.home-page main>.contact{display:none}.page-hero{background:var(--charcoal);color:var(--ivory);padding:88px 0 72px;text-align:center}.page-hero .eyebrow{color:var(--glow)}.page-hero h1{font-size:clamp(2.6rem,6vw,5rem);margin:0 auto 18px}.page-hero p:not(.eyebrow){color:rgb(254 207 122 / .78);font-size:1.1rem;margin:0 auto;max-width:650px}.content-narrow{margin-inline:auto;max-width:820px}.content-narrow p{color:var(--text);font-size:1.05rem;line-height:1.8}.content-narrow h2{font-size:clamp(1.8rem,3vw,2.5rem);margin:0 0 16px}.empty-blog{background:#fff;border:1px dashed var(--border);border-radius:8px;margin:0 auto;max-width:700px;padding:56px 28px;text-align:center}.empty-blog p{color:var(--text);margin:0}.subpage-main{min-height:calc(100vh - 300px)}
.button:hover,.product-card:hover,.product-card:hover .product-image img{transform:none}
.product-image{position:relative}.product-image picture{display:contents}.product-image::after{background:var(--active-swatch,transparent);content:"";inset:0;mix-blend-mode:multiply;opacity:0;pointer-events:none;position:absolute;transition:opacity .25s var(--ease);z-index:1}.product-card:hover .product-image::after{opacity:.1}.product-image img{cursor:zoom-in}.product-card:hover .product-image img{transform:scale(1.1)}.image-lightbox{align-items:center;background:rgb(58 44 31 / .88);display:flex;inset:0;justify-content:center;padding:24px;position:fixed;z-index:300}.image-lightbox[hidden]{display:none}.image-lightbox img{border:2px solid rgb(254 207 122 / .5);border-radius:8px;box-shadow:0 20px 70px rgb(0 0 0 / .35);max-height:90vh;max-width:92vw;object-fit:contain}.image-lightbox-close{background:var(--flame);border:0;border-radius:50%;color:#fff;cursor:pointer;font-size:28px;height:44px;line-height:1;position:absolute;right:24px;top:24px;width:44px}.image-lightbox-close:hover{background:#e17a16}
.product-image::after{display:none}.product-body{align-self:stretch;background:#fff;display:flex;flex-direction:column;justify-content:center;transition:background-color .25s var(--ease)}.product-card:hover .product-body{background:color-mix(in srgb,var(--active-swatch,#fff) 30%,#fff)}
@media(min-width:761px) and (max-width:1500px){
  .product-card{grid-template-columns:1fr}
  .product-image{min-height:320px}
}

.image-lightbox{opacity:0;pointer-events:none;transition:opacity .28s ease,visibility 0s linear .28s;visibility:hidden}.image-lightbox.is-open{opacity:1;pointer-events:auto;transition-delay:0s;visibility:visible}.image-lightbox img{opacity:0;transform:scale(.92);transition:opacity .28s ease,transform .28s var(--ease)}.image-lightbox.is-open img{opacity:1;transform:scale(1)}
.site-header .header-inner{height:58px}.site-header .brand img{height:34px;width:34px}
.rolunk-page .page-hero{background:transparent;color:var(--charcoal)}.rolunk-page .page-hero .eyebrow{color:var(--flame)}.rolunk-page .page-hero p:not(.eyebrow){color:var(--text)}
.about-animation{height:260px;max-width:260px;width:100%}.about-animation svg{animation:logo-stage-float 5s ease-in-out infinite;background:transparent;border:0;display:block;height:100%;transform:translateY(11px) rotate(-.6deg);transform-origin:center;width:100%}
.legal-page h1{font-size:clamp(2.4rem,5vw,4.5rem);margin:0 0 12px}.legal-page h2{margin-top:36px}.legal-updated{color:var(--muted)!important;font-size:.9rem!important}
.workshop-page .page-hero{padding:44px 0 36px}
@media(max-width:760px){.site-nav{top:58px}}
@media(max-width:760px){.hero-visual{justify-self:center;margin-inline:auto;width:min(100%,360px)}.hero-animation{margin-inline:auto}}
@media(max-width:760px){.about-animation{height:170px;justify-self:center;margin-inline:auto;max-width:170px}}
.cookie-manager{bottom:18px;display:none;left:18px;max-width:620px;position:fixed;z-index:500}.cookie-manager.is-visible{display:block}.cookie-manager-panel{background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 14px 45px rgb(58 44 31 / .25);padding:16px 42px 16px 18px;position:relative}.cookie-manager-close{align-items:center;background:transparent;border:0;color:var(--muted);cursor:pointer;display:flex;font-size:22px;height:30px;justify-content:center;line-height:1;position:absolute;right:8px;top:7px;width:30px}.cookie-manager-close:hover{background:var(--dim);border-radius:50%;color:var(--charcoal)}.cookie-manager-copy{color:var(--text);max-width:540px}.cookie-manager-title{color:var(--charcoal);font-size:1.08rem;font-weight:700;margin:0 0 3px}.cookie-manager-copy p:not(.cookie-manager-title){font-size:.82rem;line-height:1.35;margin:0 0 4px}.cookie-manager-copy a{color:var(--flame);font-size:.76rem;font-weight:600;text-decoration:underline}.cookie-manager-actions{align-items:center;display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}.cookie-button{border:1px solid var(--flame);border-radius:999px;cursor:pointer;font-size:.78rem;font-weight:700;min-height:34px;padding:6px 13px;transition:background .2s ease,color .2s ease,transform .2s ease}.cookie-button:hover{transform:none}.cookie-button--secondary{background:transparent;color:var(--charcoal)}.cookie-button--secondary:hover{background:var(--dim)}.cookie-settings-trigger{background:var(--charcoal);border:1px solid var(--glow);border-radius:999px;bottom:18px;color:var(--ivory);cursor:pointer;display:none;font-size:.72rem;font-weight:600;padding:7px 11px;position:fixed;right:18px;z-index:499}.cookie-settings-trigger.is-visible{display:block}.cookie-settings-trigger:hover{background:var(--deep)}
.cookie-button.is-selected{background:var(--flame);border-color:var(--flame);box-shadow:0 4px 12px rgb(253 147 45 / .22);color:#fff}.cookie-button.is-selected:hover{background:#e17a16;border-color:#e17a16}
.footer-cookie-link,.footer-cookie-link.is-visible{background:transparent;border:0;border-radius:0;box-shadow:none;color:rgb(252 246 236 / .72);display:inline-flex!important;font-size:.9rem;font-weight:400;justify-content:start;min-height:0;padding:0;position:static;width:auto}.footer-cookie-link:hover,.footer-cookie-link.is-visible:hover{background:transparent;color:var(--glow)}
.footer-grid--compact{grid-template-columns:1fr 1fr}.footer-grid--compact>div:first-child{grid-column:auto}
.footer-grid--compact>div{align-content:start;display:grid;gap:8px}
.footer-grid .footer-meska{background:var(--flame);border:1.5px solid var(--flame);box-shadow:0 5px 14px rgb(253 147 45 / .26);color:#fff;display:inline-flex;font-size:.82rem;font-weight:700;justify-content:center;margin-top:4px;min-height:36px;padding:0 16px;width:max-content}.footer-grid .footer-meska:hover{background:#e17a16;border-color:#e17a16;color:#fff;transform:none}
@media(max-width:600px){.cookie-manager{bottom:10px;left:10px;max-width:none;right:10px}.cookie-manager-panel{padding:16px}.cookie-manager-actions{align-items:stretch;flex-direction:column}.cookie-button{width:100%}.cookie-settings-trigger{bottom:10px;right:10px}.footer-grid--compact{grid-template-columns:1fr 1fr}}
@media(max-width:500px){.footer-grid--compact{grid-template-columns:1fr}}
.copyright{margin-top:22px}
.contact-social-icons{display:flex;gap:12px;justify-content:center;margin-top:32px;width:100%}.contact-social-icons a{align-items:center;aspect-ratio:1;background:var(--dim);border:1px solid rgb(80 63 46 / .12);border-radius:50%;display:flex;flex:1 1 0;justify-content:center;max-height:64px;max-width:64px;min-width:0;transition:background .25s var(--ease),transform .25s var(--ease)}.contact-social-icons a:hover{background:var(--flame);transform:translateY(-2px)}.contact-social-icons a:hover img{filter:brightness(0) invert(1)}.contact-social-icons img{height:clamp(24px,4vw,36px);width:clamp(24px,4vw,36px)}
@media(max-width:500px){.contact-social-icons{gap:8px}.contact-social-icons img{height:22px;width:22px}}
.site-footer{margin-top:-20px;padding-top:34px}
.facts{grid-template-columns:repeat(4,1fr)}
@media(max-width:760px){.facts{grid-template-columns:repeat(2,1fr)}}
@media(max-width:500px){.facts{grid-template-columns:1fr}}
.facts>div{opacity:0;transform:translateY(18px)}.facts.is-visible>div{animation:fact-reveal .65s var(--ease) forwards;animation-delay:var(--fact-delay,0s)}
@keyframes fact-reveal{to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.facts.is-visible>div{animation-delay:0s}}

/* Final hover timing override for components defined later in this stylesheet. */
:where(
  .site-nav>a:not(.button)::after,
  .button,
  .filter,
  .product-card,
  .product-image img,
  .product-body,
  .swatch,
  .footer-grid a,
  .footer-social-icons a,
  .contact-social-icons a,
  .cookie-manager-close,
  .cookie-button,
  .cookie-settings-trigger,
  .image-lightbox-close
){transition-duration:.4s}
.product-body{transition:background-color .4s var(--ease)}
.footer-social-icons img,.contact-social-icons img{transition:filter .4s var(--ease)}
.cookie-manager-close,.cookie-settings-trigger,.image-lightbox-close{transition:background-color .4s var(--ease),color .4s var(--ease),border-color .4s var(--ease)}

/* Product card finish: keep the scent tags distinct and the card calm on hover. */
.scent-tags .scent-tag{background:#f7f3eb;border-color:#6d6b66;color:var(--charcoal)}
.product-body{background:#fff;position:relative}
.product-card:hover .product-body{background:color-mix(in srgb,var(--active-swatch,#fff) 30%,#fff)}
.product-body::before{background:linear-gradient(90deg,transparent,var(--glow) 22%,var(--flame) 50%,var(--glow) 78%,transparent);content:"";height:4px;left:28px;pointer-events:none;position:absolute;right:28px;top:0}
@media(min-width:1501px){.product-body::before{background:linear-gradient(180deg,transparent,var(--glow) 22%,var(--flame) 50%,var(--glow) 78%,transparent);bottom:28px;height:auto;left:0;right:auto;top:28px;width:4px}}
@media(min-width:501px) and (max-width:760px){.product-body::before{background:linear-gradient(180deg,transparent,var(--glow) 22%,var(--flame) 50%,var(--glow) 78%,transparent);bottom:28px;height:auto;left:0;right:auto;top:28px;width:4px}}

/* Keep animated counters from changing the layout while their values update. */
.facts>div{contain:layout paint;min-height:104px}
.facts strong{font-variant-numeric:tabular-nums;height:2.2rem;margin-inline:auto;min-width:4.5ch;text-align:center;white-space:nowrap}
.facts span{min-height:2.5em}
.rolunk-page .facts>div{transition:background-color .4s var(--ease)}
.rolunk-page .facts>div:hover{background-color:#f3f3f3}

/* Local-copy fallbacks: the cards and counters remain usable even before JS runs. */
.product-body{background:#fff}
.product-card:hover .product-body{background:color-mix(in srgb,var(--active-swatch,#fff) 30%,#fff)}
.product-body::after{background:var(--active-swatch,transparent);content:"";inset:0;opacity:0;pointer-events:none;position:absolute;transition:opacity .4s var(--ease);z-index:0}
.product-card:hover .product-body::after{opacity:.2}
.product-body::before{z-index:2}
.product-body>*{position:relative;z-index:1}
.facts>div{opacity:1;transform:none}

/* Keep the default product colour available before JavaScript starts. */
.product-card[data-active-color="barack"]{--active-swatch:#F3C99B}
.product-card[data-active-color="kek"]{--active-swatch:#9CB4D8}
.product-card[data-active-color="szurke"]{--active-swatch:#A9A9AD}
.swatch[data-color="barack"]{--swatch:#F3C99B}
.swatch[data-color="kek"]{--swatch:#9CB4D8}
.swatch[data-color="szurke"]{--swatch:#A9A9AD}

/* Keep the hero lockup from overpowering the longer introduction on wide screens. */
@media(min-width:761px){
  .hero-wordmark>strong{font-size:clamp(3.75rem,5.8vw,4.8rem)}
  .hero h1{font-size:clamp(1.9rem,2.8vw,2.6rem)}
}
@media(max-width:760px){
  .hero-wordmark>strong{font-size:clamp(3.6rem,14vw,5rem)}
  .hero h1{font-size:clamp(2rem,7vw,2.8rem)}
}
@media(max-width:500px){
  .hero-wordmark>strong{font-size:clamp(3.2rem,16vw,4.5rem)}
  .hero h1{font-size:clamp(1.9rem,8vw,2.4rem)}
}
.rolunk-page .about-grid > div:nth-child(2) > p:not(.eyebrow){font-size:1.1rem}

/* Keep the introduction evenly spaced between the wordmark and heading. */
.hero-copy{row-gap:28px}
.hero-wordmark{margin-bottom:0}
.hero-middle{display:flex;flex-direction:column;gap:28px}
.hero-intro,.hero h1{margin:0}
.hero-copy>.badge{margin-top:0}
@media(min-width:761px){
  .hero-copy{align-content:center;grid-template-rows:auto auto auto}
  .hero-middle{align-self:auto}
}
@media(max-width:760px){
  .hero-middle{align-items:center;text-align:center}
  .hero-intro{max-width:510px;text-align:center}
}

/* Desktop hero: the copy follows the full height of the logo frame. */
@media(min-width:761px){
  .hero-copy{display:flex;flex-direction:column;height:390px;justify-content:space-between;row-gap:0}
  .hero-wordmark{margin:0}
  .hero-middle{align-self:stretch}
  .hero-wordmark>strong{font-size:clamp(4rem,6vw,5rem)}
  .hero h1{font-size:clamp(2rem,3vw,2.8rem)}
}

/* Desktop hero balance: center the intro and bring the catalogue closer. */
@media(min-width:761px){
  .hero-grid{gap:64px;min-height:560px;padding-block:56px}
  .hero-copy{align-items:center;display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:330px;justify-items:center;text-align:center}
  .hero-visual,.hero-animation{max-width:320px}
  .hero-animation{height:330px}
  .hero-wordmark{align-self:center;grid-row:1;justify-self:center}
  .hero-middle{display:contents}
  .hero-intro{align-self:center;grid-row:2;text-align:center}
  .hero h1{align-self:end;grid-row:3;text-align:center}
}

/* Colour selection for the enlarged product image. */
.image-lightbox{flex-direction:column;gap:12px}
.image-lightbox img{max-height:calc(90vh - 80px);transition:opacity .4s var(--ease)}
.image-lightbox img.is-fading{opacity:0}
.image-lightbox-colors{align-items:center;background:#111;color:#fff;display:flex;gap:18px;padding:10px 16px}
.image-lightbox-colors-label{font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:lowercase}
.image-lightbox-colors .swatches{display:flex;gap:9px;margin:0}
.image-lightbox-colors .swatch{border-color:transparent;height:22px;width:22px}
.image-lightbox-colors .swatch.is-active{border-color:#fff;box-shadow:0 0 0 1px #fff,0 0 0 3px #111}
@media(max-width:500px){.image-lightbox-colors{gap:14px;padding:9px 12px}.image-lightbox-colors-label{font-size:.63rem}}

/* The logo floats upward on mobile; reserve that space above it without moving its bottom point. */
@media (max-width: 760px) {
  .hero-animation {
    align-items: flex-start;
    height: 294px;
    margin-top: -14px;
    padding-top: 14px;
  }
  .hero-animation svg {
    flex: 0 0 auto;
    height: 278px;
  }
}

/* The homepage visibility switch sits directly above the save button so
   publishing the finished page is a single, explicit admin action. */
.page-publication-control {
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: 8px;
  display: grid;
  gap: 9px;
  padding: 14px;
}

.page-publication-control > .field-label {
  color: var(--charcoal);
  font-size: .86rem;
  font-weight: 700;
}

.page-publication-toggle {
  align-items: center !important;
  cursor: pointer;
  display: flex !important;
  gap: 12px;
  position: relative;
}

.page-publication-toggle > input {
  height: 1px !important;
  margin: 0 !important;
  opacity: 0;
  position: absolute;
  width: 1px !important;
}

.page-publication-toggle__track {
  background: #d8cec3;
  border: 1px solid #b9aa9b;
  border-radius: 999px;
  flex: 0 0 auto;
  height: 28px;
  padding: 3px;
  transition: background .2s ease, border-color .2s ease;
  width: 52px;
}

.page-publication-toggle__track > span {
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgb(33 27 21 / .25);
  display: block;
  height: 20px;
  transform: translateX(0);
  transition: transform .2s ease;
  width: 20px;
}

.page-publication-toggle > input:checked + .page-publication-toggle__track {
  background: var(--flame);
  border-color: var(--flame);
}

.page-publication-toggle > input:checked + .page-publication-toggle__track > span {
  transform: translateX(24px);
}

.page-publication-toggle > input:focus-visible + .page-publication-toggle__track {
  box-shadow: 0 0 0 3px rgb(253 147 45 / .2);
}

.page-publication-toggle__copy {
  display: grid;
  gap: 2px;
}

.page-publication-toggle__copy strong {
  color: var(--charcoal);
  font-size: .9rem;
}

.page-publication-toggle__copy small {
  color: var(--caption);
  font-size: .74rem;
  font-weight: 400;
  line-height: 1.35;
}

/* Product colour changes: wait for the decoded image, then play one glow pulse. */
.swatch {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.swatch.is-loading {
  opacity: .55;
  transform: scale(.94);
}
.product-card.is-color-loading {
  cursor: progress;
}
.product-card.is-color-loading .product-body::after,
.product-card.is-color-loading:hover .product-body::after {
  opacity: 0 !important;
}
.product-card.is-color-changing .product-body::before {
  animation: product-color-glow .4s ease-out;
}
.product-card.is-color-changing .product-image img {
  animation: product-image-color-glow .4s ease-out;
}
.product-image img.is-fading {
  opacity: 0;
}
@keyframes product-color-glow {
  0% { filter: brightness(1); opacity: .55; }
  42% { filter: brightness(1.55) drop-shadow(0 0 10px var(--active-swatch, var(--glow))); opacity: 1; }
  100% { filter: brightness(1); opacity: 1; }
}
@keyframes product-image-color-glow {
  0% { filter: brightness(1); }
  42% { filter: brightness(1.45) drop-shadow(0 0 14px var(--glow)); }
  100% { filter: brightness(1); }
}
.image-lightbox.is-image-loading {
  cursor: progress;
}
.image-lightbox .swatch.is-loading {
  opacity: .55;
}
.image-lightbox img.is-color-changing {
  animation: lightbox-image-color-glow .4s ease-out;
}
@keyframes lightbox-image-color-glow {
  0% { filter: brightness(1); }
  42% { filter: brightness(1.5) drop-shadow(0 0 20px var(--glow)); }
  100% { filter: brightness(1); }
}
@media (hover: none) and (pointer: coarse) {
  .product-card.is-color-loading,
  .product-card.is-color-loading:hover {
    box-shadow: var(--shadow);
    transform: none;
  }
  .product-card.is-color-loading .product-image img,
  .product-card.is-color-loading:hover .product-image img {
    transform: none;
  }
  .product-card.is-color-loading .product-body,
  .product-card.is-color-loading:hover .product-body {
    background: #fff;
  }
}
@media (prefers-reduced-motion: reduce) {
  .product-card.is-color-changing .product-body::before,
  .product-card.is-color-changing .product-image img,
  .image-lightbox img.is-color-changing {
    animation: none;
  }
}

/* Mobile navigation entrance: the white panel drops in, then each item follows. */
@keyframes mobile-nav-item-in{
  from{opacity:0;transform:translateY(-12px)}
  to{opacity:1;transform:translateY(0)}
}

@media(max-width:760px){
  .site-nav{
    align-items:stretch;
    clip-path:inset(0 0 100% 0);
    display:grid;
    grid-template-columns:1fr;
    opacity:0;
    overflow:auto;
    pointer-events:none;
    transform:translateY(-10px);
    transform-origin:top center;
    transition:clip-path .42s var(--ease),opacity .25s ease,transform .42s var(--ease),visibility 0s linear .42s;
    visibility:hidden;
  }
  .site-nav.is-open{
    clip-path:inset(0);
    opacity:1;
    pointer-events:auto;
    transform:translateY(0);
    transition-delay:0s;
    visibility:visible;
  }
  .site-nav>a:not(.button){
    opacity:0;
    justify-self:start;
    max-width:100%;
    transform:translateY(-12px);
    width:max-content;
  }
  .site-nav.is-open>a{
    animation:mobile-nav-item-in .36s var(--ease) both;
  }
  .site-nav.is-open>a:nth-child(1){animation-delay:0s}
  .site-nav.is-open>a:nth-child(2){animation-delay:.1s}
  .site-nav.is-open>a:nth-child(3){animation-delay:.2s}
  .site-nav.is-open>a:nth-child(4){animation-delay:.3s}
  .site-nav.is-open>a:nth-child(5){animation-delay:.4s}
}

/* Main-page reveal: enter from 10px below with a short ease-out fade. */
.home-page .reveal-item,.rolunk-page .reveal-item,.workshop-page .reveal-item{transition:opacity .4s ease-out var(--reveal-delay,.1s),transform .4s ease-out var(--reveal-delay,.1s),box-shadow .3s var(--ease)}
.home-page .reveal-item.is-revealed,.rolunk-page .reveal-item.is-revealed,.workshop-page .reveal-item.is-revealed{animation:content-reveal .4s ease-out var(--reveal-delay,.1s) both;opacity:1;transform:translateY(0);visibility:visible}
.home-page .reveal-fade-item,.rolunk-page .reveal-fade-item,.workshop-page .reveal-fade-item{transition:opacity .4s ease-out var(--reveal-delay,.1s)}
.home-page .reveal-fade-item.is-revealed,.rolunk-page .reveal-fade-item.is-revealed,.workshop-page .reveal-fade-item.is-revealed{animation:content-fade .4s ease-out var(--reveal-delay,.1s) both;opacity:1;visibility:visible}
.contact-social-reveal.is-revealed{animation:contact-social-enter .4s ease-out both;visibility:visible}
@keyframes contact-social-enter{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.rolunk-page .facts > div{transition:opacity .4s ease-out var(--fact-delay,.1s),transform .4s ease-out var(--fact-delay,.1s)}
.rolunk-page .facts.is-revealed > div{animation:fact-content-reveal .4s ease-out var(--fact-delay,.1s) both;opacity:1;transform:translateY(0)}
@keyframes content-reveal{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes fact-content-reveal{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes content-fade{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.home-page .reveal-item,.rolunk-page .reveal-item,.workshop-page .reveal-item,.home-page .reveal-fade-item,.rolunk-page .reveal-fade-item,.workshop-page .reveal-fade-item{animation:none;opacity:1;transform:none;transition:none;visibility:visible}}
@media(prefers-reduced-motion:reduce){.rolunk-page .facts > div{opacity:1;transform:none;transition:none}}
@media(prefers-reduced-motion:reduce){.contact-social-reveal{animation:none;opacity:1;transform:none;visibility:visible}}

/* The loader is a visual progress hint only: it appears after first paint,
   stays translucent, and never captures input or hides page content. */
.page-loader{align-items:center;background:rgb(58 44 31 / .14);display:grid;inset:0;justify-items:center;opacity:0;pointer-events:none;position:fixed;transition:opacity .3s ease,visibility .3s ease;visibility:hidden;z-index:999}
.page-loader.is-visible{opacity:1;visibility:visible}
.page-loader.is-hidden{opacity:0;visibility:hidden}
.page-loader__inner{align-items:center;background:rgb(58 44 31 / .94);border:1px solid rgb(254 207 122 / .4);border-radius:14px;box-shadow:0 14px 45px rgb(0 0 0 / .22);display:flex;flex-direction:column;padding:22px 28px}
.page-loader__flame{animation:page-loader-flame 1.1s ease-in-out infinite;background:radial-gradient(circle at 50% 70%,var(--glow) 0%,var(--flame) 55%,transparent 80%);border-radius:50% 50% 50% 50% / 60% 60% 40% 40%;filter:drop-shadow(0 0 18px rgb(253 147 45 / .55));height:52px;transform-origin:50% 100%;width:36px}
.page-loader__percent{color:rgb(254 207 122 / .8);font-size:14px;font-weight:500;letter-spacing:.18em;margin-top:18px}
.page-loader__bar{background:rgb(255 255 255 / .18);border-radius:2px;height:2px;margin-top:10px;overflow:hidden;width:140px}
.page-loader__bar-fill{background:#fff;border-radius:2px;height:100%;transition:width .1s linear;width:0}
@keyframes page-loader-flame{0%,100%{transform:scale(1,1) rotate(-2deg)}25%{transform:scale(.94,1.05) rotate(2deg)}50%{transform:scale(1.05,.96) rotate(-1deg)}75%{transform:scale(.97,1.03) rotate(1deg)}}
@media(prefers-reduced-motion:reduce){.page-loader{transition:none}.page-loader__flame{animation:none}}

.product-note>span{color:var(--muted);display:block;padding:0}
.image-lightbox{margin:0}.image-lightbox-nav{align-items:center;background:var(--flame);border:0;border-radius:50%;box-shadow:0 5px 18px rgb(0 0 0 / .25);color:#fff;cursor:pointer;display:flex;font-size:3rem;height:50px;justify-content:center;line-height:1;position:absolute;top:50%;transform:translateY(-50%);width:50px;z-index:1}.image-lightbox-nav:hover{background:#e17a16}.image-lightbox-nav--previous{left:24px}.image-lightbox-nav--next{right:24px}.image-lightbox-count{background:rgb(33 27 21 / .72);border-radius:999px;bottom:22px;color:#fff;font-size:.78rem;font-weight:700;left:50%;padding:5px 10px;position:absolute;transform:translateX(-50%);z-index:1}.image-lightbox-caption{background:rgb(33 27 21 / .78);border:1px solid rgb(254 207 122 / .45);border-radius:7px;color:#fff;display:block;font-size:.9rem;line-height:1.5;margin:10px 0 0;max-width:min(760px,82vw);padding:10px 14px;text-align:center;white-space:pre-line}.image-lightbox-nav[hidden],.image-lightbox-count[hidden],.image-lightbox-caption[hidden]{display:none}figure>figcaption:not(.image-lightbox-caption),.blog-video>figcaption{background:var(--ivory);border:1px solid var(--border);border-left:4px solid var(--glow);border-radius:0 7px 7px 0;color:var(--text);font-size:.86rem;line-height:1.5;margin-top:10px;padding:10px 13px;white-space:pre-line}@media(max-width:560px){.image-lightbox-nav{font-size:2.4rem;height:42px;width:42px}.image-lightbox-nav--previous{left:10px}.image-lightbox-nav--next{right:10px}.image-lightbox-count{bottom:12px}}

/* Consolidated from rolunk.css. */
/* Match the Rólunk title block to the dark workshop page header. */
.rolunk-page .page-hero {
  background: var(--charcoal);
  color: var(--ivory);
  padding: 44px 0 36px;
}

.rolunk-page .page-hero .eyebrow {
  color: var(--glow);
}

/* The four fact cards enter one after another from 20px below. */
.rolunk-page .facts > div {
  transition:
    opacity .7s ease-out var(--fact-delay, 0s),
    transform .7s ease-out var(--fact-delay, 0s),
    background-color .4s var(--ease);
}

.rolunk-page .facts.is-revealed > div {
  animation: fact-content-reveal .4s ease-out var(--fact-delay, .1s) both;
  opacity: 1;
  transform: translateY(0);
}

/* Keep Rólunk and Kapcsolat paragraphs readable. */
.rolunk-page .about p:not(.eyebrow),
.rolunk-page .contact-inner > div > p:not(.eyebrow),
.rolunk-page .content-narrow p {
  overflow-wrap: break-word;
  text-wrap: pretty;
}

.rolunk-page .facts > div:hover {
  background-color: #f3f3f3;
}

@media (prefers-reduced-motion: reduce) {
  .rolunk-page .facts > div {
    opacity: 1;
    transform: none;
    transition: none;
  }
}


/* Consolidated from blog/blog.css. */
.blog-hero{padding:68px 0 56px}.blog-hero h1{font-size:clamp(2.5rem,6vw,4.7rem)}
.blog-list{padding-top:54px}.blog-filter{display:flex;flex-wrap:wrap;gap:9px;margin:0 0 42px}.blog-filter__link{align-items:center;border:1px solid var(--border);border-radius:999px;color:var(--text);display:inline-flex;font-size:.86rem;font-weight:600;gap:7px;padding:8px 14px;transition:background .2s ease,color .2s ease,border-color .2s ease}.blog-filter__link:hover,.blog-filter__link.is-active{background:var(--flame);border-color:var(--flame);color:#fff}.blog-filter__link span{font-size:.72rem;opacity:.7}
.post-grid{display:grid;gap:26px;grid-template-columns:repeat(2,minmax(0,1fr))}.post-card{background:#fff;border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow);display:flex;flex-direction:column;overflow:hidden;transition:box-shadow .25s ease,transform .25s ease}.post-card:hover{box-shadow:0 15px 35px rgb(58 44 31 / .16);transform:translateY(-3px)}.post-card__media{background:var(--dim);display:block;min-height:220px;overflow:hidden;position:relative}.post-card__media .post-cover{height:100%;min-height:220px;width:100%}.post-cover{display:block;object-fit:cover}.post-cover--empty{align-items:center;background:linear-gradient(135deg,#fffaf2,#f4dfba);color:var(--flame);display:flex;font-size:3rem;justify-content:center}.post-cover--empty span{filter:drop-shadow(0 8px 10px rgb(253 147 45 / .2))}.post-card__media .post-cover:not(.post-cover--empty){transition:transform .45s ease}.post-card:hover .post-card__media .post-cover:not(.post-cover--empty){transform:scale(1.035)}.post-card__video{align-items:center;background:var(--flame);border:2px solid #fff;border-radius:50%;bottom:14px;color:#fff;display:flex;height:42px;justify-content:center;position:absolute;right:14px;width:42px}
.post-grid--list{grid-template-columns:1fr}.post-grid--list .post-card{display:grid;grid-template-columns:minmax(220px,.42fr) 1fr}.post-grid--list .post-card__media,.post-grid--list .post-card__media .post-cover{min-height:260px}.blog-pagination{align-items:center;display:flex;flex-wrap:wrap;gap:7px;justify-content:center;margin-top:42px}.blog-pagination a{align-items:center;border:1px solid var(--border);border-radius:999px;color:var(--text);display:inline-flex;font-size:.82rem;font-weight:700;min-height:36px;padding:0 13px}.blog-pagination a:hover,.blog-pagination a.is-active{background:var(--flame);border-color:var(--flame);color:#fff}
.blog-pagination--top{margin-top:0;margin-bottom:32px}
.post-card__body{display:flex;flex:1;flex-direction:column;padding:25px 27px 22px}.post-card__meta{align-items:center;color:var(--muted);display:flex;flex-wrap:wrap;font-size:.77rem;gap:10px;margin-bottom:11px}.post-card h2{font-size:1.65rem;line-height:1.1;margin:0 0 10px}.post-card h2 a:hover{color:var(--flame)}.post-card__body>p{color:var(--text);line-height:1.65;margin:0}.post-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}.post-tags a{background:var(--dim);border-radius:999px;color:var(--text);font-size:.72rem;padding:5px 9px}.post-tags a:hover{background:var(--glow);color:var(--charcoal)}.post-card__footer{align-items:center;border-top:1px solid var(--dim);color:var(--muted);display:flex;font-size:.78rem;gap:12px;justify-content:space-between;margin-top:auto;padding-top:17px}.text-link{background:transparent;border:0;color:var(--flame);cursor:pointer;font-weight:700;padding:0}.text-link:hover{text-decoration:underline}.empty-blog{background:#fff;border:1px dashed var(--border);border-radius:10px;margin:0 auto;max-width:700px;padding:56px 28px;text-align:center}.empty-blog h2{margin:0 0 10px}.empty-blog>p:last-child{color:var(--text);margin:0}
.post-detail{padding-top:54px}.post-detail__container{max-width:880px}.post-detail__header{margin:0 auto 38px;max-width:760px}.post-detail__header h1{font-size:clamp(2.4rem,6vw,5rem);line-height:1.03;margin:0 0 18px}.post-detail__header .post-tags{margin-top:21px}.post-cover--article{border-radius:10px;max-height:560px;object-fit:cover;width:100%}.post-detail>.container>.post-cover--empty{border-radius:10px;height:250px;width:100%}.post-detail__actions{align-items:center;border-bottom:1px solid var(--border);border-top:1px solid var(--border);display:flex;flex-wrap:wrap;gap:12px;margin:28px auto 42px;max-width:760px;padding:15px 0}.post-detail__actions form{margin:0}.like-button,.share-button{background:#fff;border:1px solid var(--border);border-radius:999px;color:var(--charcoal);cursor:pointer;font-size:.9rem;font-weight:700;min-height:40px;padding:0 16px}.like-button:hover,.share-button:hover{background:var(--dim);border-color:var(--flame)}.like-button strong{color:var(--flame);margin-left:4px}.share-status{color:var(--muted);font-size:.82rem}.post-detail__body{color:var(--text);font-size:1.06rem;line-height:1.85;margin:0 auto;max-width:760px}.post-detail__body h2,.post-detail__body h3,.post-detail__body h4{color:var(--charcoal);line-height:1.2;margin:2.1em 0 .65em}.post-detail__body h2{font-size:2rem}.post-detail__body h3{font-size:1.5rem}.post-detail__body p{margin:0 0 1.25em}.post-detail__body a{color:var(--flame);text-decoration:underline}.post-detail__body ul,.post-detail__body ol{margin:0 0 1.25em;padding-left:1.4em}.post-detail__body li{padding-left:.25em}.post-detail__body blockquote{border-left:4px solid var(--glow);color:var(--charcoal);font-family:var(--font-script);font-size:1.6rem;line-height:1.3;margin:1.4em 0;padding:.2em 0 .2em 1em}.post-detail__body code{background:var(--dim);border-radius:4px;color:var(--charcoal);font-size:.87em;padding:.15em .35em}.post-detail__body pre{background:var(--charcoal);border-radius:8px;color:var(--ivory);overflow:auto;padding:18px 20px}.post-detail__body pre code{background:transparent;color:inherit;padding:0}.post-detail__body img{border-radius:8px;height:auto;max-width:100%}.post-gallery{display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr));margin:2em 0}.post-gallery figure{margin:0}.post-gallery img{aspect-ratio:1;display:block;object-fit:cover;width:100%}.post-gallery figcaption{color:var(--muted);font-size:.78rem;line-height:1.35;margin-top:7px}.short-video{background:#fff;border:1px solid var(--border);border-radius:10px;margin:2em 0;overflow:hidden;padding:14px}.short-video__embed{background:#211b15;border-radius:7px;overflow:hidden}.short-video__embed iframe{aspect-ratio:9 / 16;border:0;display:block;margin:auto;max-height:600px;max-width:100%;width:100%}.short-video__links{font-size:.82rem;margin:11px 4px 2px!important;text-align:center}.short-video__links a{font-weight:700}.post-detail__share{align-items:center;border-top:1px solid var(--border);display:flex;gap:14px;justify-content:space-between;margin:54px auto 0;max-width:760px;padding-top:20px}.post-detail__share strong{color:var(--charcoal);font-size:.9rem}.error-page{text-align:center}.error-page h1{font-size:clamp(2.3rem,5vw,4.5rem);margin:0 0 12px}.error-page p:not(.eyebrow){color:var(--text);margin:0 auto 24px}
.blog-video{background:#211b15;border-radius:10px;margin:2em 0;overflow:hidden}.blog-video iframe{aspect-ratio:16 / 9;border:0;display:block;width:100%}.blog-video:has(iframe[src*="tiktok.com"]){margin-inline:auto;max-width:420px}.blog-video:has(iframe[src*="tiktok.com"]) iframe{aspect-ratio:9 / 16;max-height:720px}
@media(max-width:760px){.post-grid,.post-grid--list{grid-template-columns:1fr}.post-grid--list .post-card{display:flex}.post-detail{padding-top:38px}.post-detail__header h1{font-size:clamp(2.35rem,12vw,4rem)}.post-detail__actions{margin-bottom:30px}.post-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.post-detail__share{align-items:flex-start;flex-direction:column}}
@media(max-width:500px){.blog-filter{gap:7px}.blog-filter__link{font-size:.78rem;padding:7px 10px}.post-card__media,.post-card__media .post-cover{min-height:190px}.post-card__body{padding:22px 20px 19px}.post-gallery{display:block}.post-gallery figure+figure{margin-top:14px}.post-detail__body{font-size:1rem}.short-video__embed iframe{max-height:520px}.post-detail__share{gap:8px}}
.post-detail__body figure{box-sizing:border-box;margin:2em 0;max-width:100%;width:100%}.post-detail__body figure.media-size-small{width:32%}.post-detail__body figure.media-size-medium{width:55%}.post-detail__body figure.media-size-large{width:75%}.post-detail__body figure.media-size-full{width:100%}.post-detail__body figure.media-size-custom{max-width:100%}.post-detail__body .post-image-link{color:inherit;display:block;text-decoration:none}.post-detail__body .post-image-link img{display:block;transition:box-shadow .2s ease,transform .2s ease;width:100%}.post-detail__body .post-image-link:hover img{box-shadow:0 12px 28px rgb(58 44 31 / .18);transform:translateY(-2px)}.post-detail__body figure figcaption{color:var(--muted);font-size:.8rem;line-height:1.4;margin-top:8px}.post-detail__body .post-gallery{width:100%}.post-detail__body .post-gallery.media-size-small{width:32%}.post-detail__body .post-gallery.media-size-medium{width:55%}.post-detail__body .post-gallery.media-size-large{width:75%}.post-detail__body .post-gallery.media-size-full{width:100%}.post-detail__body .post-gallery figure{margin:0;width:auto}.post-detail__body .post-gallery .post-image-link img{aspect-ratio:1;object-fit:cover}
@media(max-width:760px){.post-detail__body figure.media-size-small,.post-detail__body figure.media-size-medium,.post-detail__body figure.media-size-large,.post-detail__body .post-gallery.media-size-small,.post-detail__body .post-gallery.media-size-medium,.post-detail__body .post-gallery.media-size-large{width:100%}}
.post-detail__body .blog-video.blog-video--square iframe{aspect-ratio:1}.post-detail__body .blog-video iframe{aspect-ratio:16 / 9}
.post-detail__body .post-image-link{cursor:zoom-in}
.post-detail__body a:not(.post-image-link){color:var(--flame);font-weight:700;text-decoration-line:underline;text-decoration-color:var(--glow);text-decoration-thickness:2px;text-underline-offset:3px;transition:background-color .2s ease,color .2s ease}.post-detail__body a:not(.post-image-link):hover{background:var(--glow);color:var(--charcoal);text-decoration-color:var(--charcoal)}
.post-detail__body figure figcaption,.post-detail__body .blog-video figcaption{background:var(--ivory);border:1px solid var(--border);border-left:4px solid var(--glow);border-radius:0 7px 7px 0;color:var(--text);font-size:.86rem;line-height:1.5;margin-top:10px;padding:10px 13px;white-space:pre-line}.post-detail__body .blog-video figcaption{margin:0}
.post-card__media{aspect-ratio:16 / 9;min-height:0}.post-card__media .post-cover{min-height:0}.post-grid--list .post-card{grid-template-columns:minmax(280px,36%) 1fr}.post-grid--list .post-card__media,.post-grid--list .post-card__media .post-cover{min-height:0}.post-cover--article{aspect-ratio:3 / 2;max-height:none}.post-detail>.container>.post-cover--empty{aspect-ratio:3 / 2;height:auto}.post-card__media .post-cover--empty{height:100%;min-height:0;width:100%}
@media(max-width:500px){.post-card__media,.post-card__media .post-cover{min-height:0}}

/* The article view follows the same visual rhythm as the editor preview. */
.post-detail>.container>.post-cover--article{border-radius:10px;margin:0 auto 28px;max-height:560px;object-fit:cover;width:100%}
.post-detail__header{margin:0 auto 38px;max-width:760px}
.post-detail__header h1{margin:0 0 14px}
.post-detail__meta{align-items:center;border-bottom:1px solid var(--dim);color:var(--muted);display:flex;flex-wrap:wrap;font-size:.78rem;gap:8px 14px;margin:0 0 28px;padding:0 0 14px}
.post-detail__meta-item{align-items:baseline;display:inline-flex;gap:6px}
.post-detail__meta-label{color:var(--flame);font-size:.66rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.post-detail__body{font-size:1rem;line-height:1.8}
.post-detail__body>p{margin:0 0 1.65em}
.post-detail__body>p:last-child{margin-bottom:0}
.post-detail__body>br+br{content:"";display:block;margin-top:1.65em}
.post-detail__body h2,.post-detail__body h3,.post-detail__body h4{margin:2em 0 .75em}
.post-detail__share-actions{display:flex;flex-wrap:wrap;gap:8px}
.share-button{align-items:center;display:inline-flex;justify-content:center;text-decoration:none}
.share-button--facebook{background:#1877f2;border-color:#1877f2;color:#fff}
.share-button--facebook:hover{background:#0f66d2;border-color:#0f66d2;color:#fff}

.share-icon{display:block;fill:none;height:1.05em;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8;transform:translateY(1px);width:1.05em}.share-button--facebook .share-icon{fill:currentColor;stroke:none}.action-button,.share-button{align-items:center;gap:8px}.share-button--email:hover{border-color:#8b5cf6;background:#f3efff}.share-button--bookmark.is-saved{background:var(--glow);border-color:var(--flame);color:var(--charcoal)}.copy-fallback{border:1px solid var(--flame);border-radius:7px;box-sizing:border-box;color:var(--charcoal);font:inherit;margin-top:2px;min-height:38px;padding:8px 10px;width:min(100%,760px)}.copy-fallback:focus{outline:3px solid rgb(253 147 45 / .25);outline-offset:2px}.share-button[aria-pressed="true"] .share-icon{fill:currentColor}
.post-card__likes{align-items:center;color:var(--flame);display:inline-flex;font-weight:700;gap:4px;margin-left:auto;white-space:nowrap}.post-card__likes .share-icon{height:.95em;width:.95em}
.post-card .post-tags{margin-bottom:18px}
.post-grid--list .post-card{align-items:stretch}.post-grid--list .post-card__media{align-self:stretch;aspect-ratio:auto;height:100%;min-height:0}.post-grid--list .post-card__media .post-cover{height:100%;min-height:0;object-fit:cover;width:100%}
.action-button{display:inline-flex;justify-content:center;white-space:nowrap}
.like-button.is-liked{background:var(--glow);border-color:var(--flame)}.like-button:disabled{cursor:default}
.post-detail__share{align-items:center;justify-content:center}

/* A list item gets its own 3:2 image frame and focal point. */
.post-grid--list .post-card__media{align-self:center;aspect-ratio:1 / 1;height:auto;min-height:0;width:100%}
.post-grid--list .post-card__media .post-cover{aspect-ratio:1 / 1;height:100%;min-height:0;object-fit:cover;width:100%}

/* Article pages use a lighter, quieter H1 hero than the workshop landing page. */
.blog-article-page .article-hero{background:var(--ivory);border-bottom:1px solid var(--dim);color:var(--charcoal);padding:48px 0 40px}
.blog-article-page .article-hero .eyebrow{color:var(--muted);font-weight:800;margin-bottom:18px}
.blog-article-page .article-hero h1{color:var(--charcoal);font-size:clamp(2.5rem,4vw,3.2rem);font-weight:700;line-height:1.12;max-width:900px}
.blog-article-page .article-hero .article-hero__lead{border-left:3px solid var(--glow);border-right:3px solid var(--glow);color:var(--charcoal);font-size:1rem;font-weight:700;line-height:1.65;margin:28px auto 0;max-width:720px;overflow-wrap:break-word;padding:0 22px;text-wrap:pretty}
.blog-article-page .post-detail{padding-top:0}
.blog-article-page .post-detail__header{margin-bottom:28px}
.blog-article-page .post-detail__meta{font-size:.86rem;gap:4px 14px;line-height:1.35;margin-bottom:0}
.blog-article-page .post-detail__meta-label{font-size:.72rem}
.blog-article-page .post-detail__meta .post-tags{display:inline-flex;margin:0}
.blog-article-page .post-detail__meta .post-tags a{font-size:.78rem}
.blog-article-page .post-detail__actions{border-top:0;margin:-10px auto 42px}
.blog-article-page .post-detail__share{display:none}

/* Keep article body paragraphs comfortably justified without stretching the final line. */
.post-detail__body,.post-detail__body p{overflow-wrap:break-word;text-wrap:pretty}

/* Use the same calm paragraph wrapping for excerpts in both card layouts. */
.post-card__body p{overflow-wrap:break-word;text-wrap:pretty}

/* Keep the article actions in one compact row; share controls show icons only. */
.blog-article-page .post-detail__actions{flex-wrap:nowrap;gap:8px}
.blog-article-page .post-detail__actions form{flex:0 1 auto;min-width:0}
.blog-article-page .post-detail__actions .like-button{padding-inline:14px;white-space:nowrap}
.blog-article-page .post-detail__share-actions{display:flex;flex:0 0 auto;flex-wrap:nowrap;gap:8px;min-width:0}
.blog-article-page .post-detail__share-actions .share-button{flex:0 0 48px;height:40px;min-width:48px;padding:0}
.blog-article-page .post-detail__share-actions .share-icon{height:1.12em;width:1.12em}

@media(max-width:560px){
  .blog-article-page .post-detail__actions{align-items:center;display:grid;gap:8px;grid-template-columns:auto minmax(0,1fr)}
  .blog-article-page .post-detail__actions form{grid-column:1}
  .blog-article-page .post-detail__actions .like-button{font-size:.82rem;gap:5px;min-height:38px;padding-inline:9px}
  .blog-article-page .post-detail__share-actions{align-items:center;display:flex;flex:0 1 auto;gap:5px;grid-column:2;justify-content:flex-end;min-width:0;width:100%}
  .blog-article-page .post-detail__share-actions .share-button{flex:1 1 0;flex-basis:0;height:38px;min-width:0;padding:0}
  .blog-article-page .post-detail__actions .share-status{grid-column:1/-1;min-height:1.4em;overflow-wrap:anywhere;text-align:center;width:100%}
  .blog-article-page .post-detail__actions .copy-fallback{grid-column:1/-1;margin:0;width:100%}
}

@media(max-width:380px){
  .blog-article-page .post-detail__actions{grid-template-columns:1fr}
  .blog-article-page .post-detail__actions form,.blog-article-page .post-detail__share-actions{grid-column:1}
  .blog-article-page .post-detail__share-actions{justify-content:center}
  .blog-article-page .post-detail__actions .like-button{font-size:.75rem;gap:4px;padding-inline:6px}
  .blog-article-page .post-detail__share-actions{gap:3px}
  .blog-article-page .post-detail__share-actions .share-button{flex:0 0 34px;height:36px;min-width:34px}
}

/* Keep the title, intro, cover image, metadata and article text on one common width. */
.blog-article-page .article-hero>.container,
.blog-article-page .post-detail__container{max-width:760px}
.blog-article-page .article-hero h1,
.blog-article-page .article-hero .article-hero__lead{max-width:760px}

/* Also hide labels from older cached PHP markup; accessible labels remain available via title/ARIA. */
.blog-article-page .post-detail__share-actions .share-button>span{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}

.post-detail__back-link{color:var(--flame);display:inline-flex;font-weight:700;gap:8px;margin-top:42px}
.post-detail__back-link:hover{text-decoration:underline}

.share-button--native{background:var(--flame);border-color:var(--flame);color:#fff}
.share-button--native:hover{background:var(--charcoal);border-color:var(--charcoal);color:#fff}


/* Consolidated from blog/title.css. */
/* Keep article titles aligned with the site's standard page-title H1. */
.post-detail__header h1 {
  font-size: clamp(2.6rem, 6vw, 5rem);
}

/* Inactive copy, hints and captions should recede behind real content. */
:where(.caption, [class*="__caption"], [class*="__hint"], [class*="__placeholder"], .form-help, .editor-help) {
  color: var(--caption);
}

figure > figcaption:not(.image-lightbox-caption),
.blog-video > figcaption,
.post-gallery figcaption,
.post-detail__body figure figcaption,
.post-detail__body .blog-video figcaption {
  color: var(--caption);
}

.image-lightbox-caption {
  color: #fff;
}


/* Consolidated from blog/admin.css. */
.admin-page{background:var(--ivory);min-height:100vh}.admin-page .site-header{opacity:1;position:relative;transform:none}.admin-page .header-inner{height:72px}.admin-header-actions{align-items:center;display:flex;gap:10px}.admin-header-actions .button--cream-outline{border-color:var(--border);color:var(--charcoal)}.admin-header-actions .button--cream-outline:hover{background:var(--dim);border-color:var(--border);box-shadow:none;color:var(--charcoal)}.admin-logout{background:transparent;border:0;color:var(--flame);cursor:pointer;font-size:.88rem;font-weight:700;padding:8px}.admin-logout:hover{text-decoration:underline}.admin-main{min-height:calc(100vh - 180px);padding:58px 0 90px}.admin-alert{background:var(--charcoal);border-radius:8px;color:#fff;display:none;margin:0 auto 20px;max-width:1100px;padding:12px 16px}.admin-alert.is-visible{display:block}.admin-alert.is-error{background:#9f4f32}.admin-gate{background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow);margin:40px auto;max-width:620px;padding:48px}.admin-gate h1{font-size:clamp(2.1rem,5vw,3.6rem);line-height:1.05;margin:0 0 14px}.admin-lead{color:var(--text);line-height:1.7;margin:0 0 26px}.admin-hero{align-items:end;display:flex;gap:30px;justify-content:space-between;margin-bottom:34px}.admin-hero h1{font-size:clamp(2.6rem,6vw,4.8rem);line-height:.95;margin:0 0 12px}.admin-hero p:not(.eyebrow){color:var(--text);margin:0}.admin-tabs{border-bottom:1px solid var(--border);display:flex;gap:5px;margin-bottom:28px;overflow:auto}.admin-tabs button{background:transparent;border:0;border-bottom:3px solid transparent;color:var(--text);cursor:pointer;font-weight:700;padding:13px 14px;white-space:nowrap}.admin-tabs button:hover,.admin-tabs button.is-active{border-color:var(--flame);color:var(--flame)}.admin-tab{display:grid;gap:22px}.admin-stats{display:grid;gap:14px;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:2px}.admin-stat{background:#fff;border:1px solid var(--border);border-radius:9px;padding:20px}.admin-stat strong{color:var(--flame);display:block;font:700 2.35rem/1 var(--font-script)}.admin-stat span{color:var(--muted);display:block;font-size:.78rem;margin-top:7px}.admin-card{background:#fff;border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow);padding:28px}.admin-card__heading{align-items:start;display:flex;gap:18px;justify-content:space-between;margin-bottom:24px}.admin-card__heading h2{font-size:clamp(1.7rem,3vw,2.5rem);line-height:1;margin:0}.admin-form{display:grid;gap:18px}.admin-form label,.tag-create label{color:var(--charcoal);display:grid;font-size:.86rem;font-weight:700;gap:7px}.admin-form input,.admin-form textarea,.admin-form select,.tag-create input,.tag-add input{background:#fff;border:1.5px solid var(--muted);border-radius:7px;color:var(--charcoal);outline:0;padding:11px 13px;width:100%}.admin-form textarea{line-height:1.55;resize:vertical}.admin-form input:focus,.admin-form textarea:focus,.admin-form select:focus,.tag-create input:focus,.tag-add input:focus{border-color:var(--flame);box-shadow:0 0 0 3px rgb(253 147 45 / .15)}.admin-form small{color:var(--muted);font-size:.72rem;font-weight:400;line-height:1.35}.admin-form--narrow{max-width:420px}.form-grid{display:grid;gap:18px}.form-grid--two{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}.form-help{color:var(--text);font-size:.88rem;margin:0}.check-row{align-items:center!important;display:flex!important;gap:9px}.check-row input{accent-color:var(--flame);height:17px;width:17px}.check-row--field{align-self:end;border:1.5px solid var(--muted);border-radius:7px;min-height:45px;padding:0 12px}.form-actions{align-items:center;border-top:1px solid var(--dim);display:flex;flex-wrap:wrap;gap:10px;margin-top:6px;padding-top:20px}.button--ghost-dark{background:transparent;border-color:#b27863;box-shadow:none;color:#9f4f32}.button--ghost-dark:hover{background:#fff5f0;border-color:#9f4f32;color:#9f4f32}.admin-table-wrap{overflow:auto}.admin-table{border-collapse:collapse;min-width:680px;width:100%}.admin-table th{color:var(--muted);font-size:.7rem;letter-spacing:.1em;padding:0 12px 12px;text-align:left;text-transform:uppercase}.admin-table td{border-top:1px solid var(--dim);padding:14px 12px;vertical-align:middle}.admin-table td:first-child{color:var(--charcoal);font-weight:700}.admin-table__title{display:block}.admin-table__slug{color:var(--muted);display:block;font-size:.72rem;font-weight:400;margin-top:3px}.status-badge{border-radius:999px;display:inline-block;font-size:.7rem;font-weight:700;padding:5px 9px}.status-badge--published{background:#e3f0df;color:#39703a}.status-badge--draft{background:var(--dim);color:var(--text)}.status-badge--archived{background:#eee8e4;color:#806b5b}.table-actions{display:flex;gap:8px;justify-content:flex-end}.table-action{background:transparent;border:0;color:var(--flame);cursor:pointer;font-size:.82rem;font-weight:700;padding:4px}.table-action:hover{text-decoration:underline}.admin-empty{border:1px dashed var(--border);color:var(--text);padding:38px;text-align:center}.admin-empty p{margin:0 0 8px}.text-button{background:transparent;border:0;color:var(--flame);cursor:pointer;font-weight:700;padding:5px 0}.text-button:hover{text-decoration:underline}.tag-picker{border:1px solid var(--border);border-radius:8px;padding:16px}.tag-picker legend{color:var(--charcoal);font-size:.86rem;font-weight:700;padding:0 7px}.tag-options{display:flex;flex-wrap:wrap;gap:8px}.tag-option{align-items:center;background:var(--dim);border:1px solid transparent;border-radius:999px;color:var(--charcoal);cursor:pointer;display:inline-flex;font-size:.8rem;font-weight:600;gap:6px;padding:7px 10px}.tag-option:hover{border-color:var(--flame)}.tag-option input{accent-color:var(--flame);height:15px;margin:0;width:15px}.tag-option:has(input:checked){background:var(--glow);border-color:var(--flame)}.tag-add{display:flex;gap:8px;margin-top:13px}.tag-add .button{flex:none}.editor-field{display:grid;gap:8px}.editor-label-row{align-items:center;display:flex;justify-content:space-between}.editor-label-row label{display:block}.editor-toolbar{background:var(--dim);border:1px solid var(--border);border-bottom:0;border-radius:7px 7px 0 0;display:flex;flex-wrap:wrap;gap:5px;padding:8px}.editor-toolbar button{background:#fff;border:1px solid var(--border);border-radius:5px;color:var(--charcoal);cursor:pointer;font-size:.76rem;padding:6px 8px}.editor-toolbar button:hover,.editor-toolbar button.is-active{background:var(--flame);border-color:var(--flame);color:#fff}.html-editor,.html-source{background:#fff;border:1.5px solid var(--muted);border-radius:0 0 7px 7px;min-height:270px;outline:0;padding:16px;line-height:1.7}.html-editor:focus,.html-source:focus{border-color:var(--flame);box-shadow:0 0 0 3px rgb(253 147 45 / .15)}.html-editor:empty::before{color:var(--muted);content:attr(placeholder);pointer-events:none}.html-source{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.84rem;resize:vertical}.preview-card{align-self:start}.admin-preview{border:1px solid var(--dim);border-radius:8px;color:var(--text);line-height:1.7;min-height:180px;padding:24px}.admin-preview h2,.admin-preview h3{color:var(--charcoal);line-height:1.15}.admin-preview img{height:auto;max-width:100%}.admin-preview__empty{color:var(--muted);margin:0}.managed-tags{display:flex;flex-wrap:wrap;gap:10px}.managed-tag{align-items:center;background:var(--dim);border-radius:999px;display:flex;gap:9px;padding:7px 9px 7px 13px}.managed-tag small{color:var(--muted)}.managed-tag button{background:#fff;border:0;border-radius:50%;color:#9f4f32;cursor:pointer;height:22px;line-height:1;width:22px}.tag-create{display:flex;gap:10px;margin-bottom:25px}.tag-create input{flex:1}.admin-footer{padding:25px 0}.admin-footer .copyright{margin-top:0;padding-top:0;border:0}.admin-page [hidden]{display:none!important}
@media(max-width:800px){.admin-main{padding-top:38px}.admin-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-hero{align-items:start;flex-direction:column}.form-grid--three{grid-template-columns:1fr}.admin-card{padding:21px}.admin-gate{padding:32px 22px}.preview-card{margin-top:0}}
@media(max-width:560px){.admin-header-actions .button{font-size:.74rem;padding:0 10px}.admin-header-actions .admin-logout{font-size:.74rem;padding-inline:3px}.admin-page .brand-copy small{letter-spacing:.1em}.admin-stats{gap:9px}.admin-stat{padding:15px}.admin-stat strong{font-size:1.9rem}.form-grid--two{grid-template-columns:1fr}.form-actions{align-items:stretch;flex-direction:column}.form-actions .button{width:100%}.tag-add,.tag-create{align-items:stretch;flex-direction:column}.tag-add .button,.tag-create .button{width:100%}}
.admin-preview figure{margin:18px 0}.admin-preview figcaption{color:var(--muted);font-size:.8rem}.admin-preview .post-gallery{display:grid;gap:10px;grid-template-columns:repeat(3,minmax(0,1fr))}.admin-preview .post-gallery figure{margin:0}.admin-preview .post-gallery img{aspect-ratio:1;object-fit:cover;width:100%}.admin-preview .blog-video{background:var(--charcoal);border-radius:7px;overflow:hidden}.admin-preview .blog-video iframe{aspect-ratio:16 / 9;border:0;display:block;width:100%}.admin-preview .blog-video.blog-video--square iframe{aspect-ratio:1}
.html-editor figure,.admin-preview figure{box-sizing:border-box;margin:18px 0;max-width:100%;width:100%}.html-editor figure.media-size-small,.admin-preview figure.media-size-small{width:32%}.html-editor figure.media-size-medium,.admin-preview figure.media-size-medium{width:55%}.html-editor figure.media-size-large,.admin-preview figure.media-size-large{width:75%}.html-editor figure.media-size-full,.admin-preview figure.media-size-full{width:100%}.html-editor figure.media-size-custom,.admin-preview figure.media-size-custom{max-width:100%}.html-editor .post-image-link,.admin-preview .post-image-link{color:inherit;display:block;text-decoration:none}.html-editor figure img,.admin-preview figure img{display:block;height:auto;max-width:100%;width:100%}.html-editor .post-image-link img,.admin-preview .post-image-link img{transition:box-shadow .2s ease,transform .2s ease}.html-editor .post-image-link:hover img,.admin-preview .post-image-link:hover img{box-shadow:0 8px 22px rgb(58 44 31 / .18);transform:translateY(-1px)}.html-editor .post-gallery,.admin-preview .post-gallery{display:grid;gap:10px;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}.html-editor .post-gallery figure,.admin-preview .post-gallery figure{margin:0;width:auto}.html-editor .post-gallery img,.admin-preview .post-gallery img{aspect-ratio:1;object-fit:cover}.image-size-dialog{align-items:center;display:grid;inset:0;justify-items:center;padding:20px;position:fixed;z-index:30}.image-size-dialog__backdrop{background:rgb(33 27 21 / .55);inset:0;position:absolute}.image-size-dialog__panel{background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 22px 70px rgb(33 27 21 / .28);max-width:620px;padding:26px;position:relative;width:100%}.image-size-dialog__heading{align-items:start;display:flex;gap:16px;justify-content:space-between}.image-size-dialog__heading h2{font-size:clamp(1.6rem,4vw,2.3rem);line-height:1;margin:0}.image-size-dialog__close{background:transparent;border:0;color:var(--muted);cursor:pointer;font-size:1.5rem;line-height:1;padding:4px 0}.image-size-dialog__help{color:var(--text);font-size:.9rem;line-height:1.55;margin:17px 0}.image-size-options{display:grid;gap:9px;grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:18px}.image-size-options button{background:var(--ivory);border:1.5px solid var(--border);border-radius:8px;color:var(--charcoal);cursor:pointer;display:grid;gap:4px;padding:12px;text-align:left}.image-size-options button:hover,.image-size-options button.is-selected{background:var(--glow);border-color:var(--flame)}.image-size-options small{color:var(--muted);font-size:.74rem;font-weight:400}.image-size-dialog__fields{display:grid;gap:14px;margin-bottom:20px}.image-size-dialog__fields label{color:var(--charcoal);display:grid;font-size:.82rem;font-weight:700;gap:7px}.image-size-dialog__fields input[type=text]{background:#fff;border:1.5px solid var(--muted);border-radius:7px;color:var(--charcoal);padding:10px 12px;width:100%}.image-size-dialog__fields input[type=text]:focus{border-color:var(--flame);box-shadow:0 0 0 3px rgb(253 147 45 / .15);outline:0}.image-size-dialog__fields input[type=range]{accent-color:var(--flame);width:100%}.image-size-dialog__fields output{color:var(--flame);font-size:.9rem;margin-left:5px}.image-size-dialog__fields small{color:var(--muted);font-size:.72rem;font-weight:400;line-height:1.35}.image-size-dialog__actions{display:flex;flex-wrap:wrap;gap:9px}
@media(max-width:560px){.html-editor figure.media-size-small,.html-editor figure.media-size-medium,.html-editor figure.media-size-large,.admin-preview figure.media-size-small,.admin-preview figure.media-size-medium,.admin-preview figure.media-size-large{width:100%}.image-size-dialog{padding:12px}.image-size-dialog__panel{padding:21px}.image-size-options{grid-template-columns:1fr}}
.html-editor figure.media-size-small,.html-editor figure.media-size-medium,.html-editor figure.media-size-large,.html-editor figure.media-size-full,.html-editor figure.media-size-custom{margin:12px 0;width:min(280px,100%)!important}.html-editor figure .post-image-link{background:var(--ivory);border:1px dashed var(--border);max-width:280px;padding:8px}.html-editor figure img{max-height:120px;object-fit:contain;opacity:.82}.html-editor figure figcaption{color:var(--muted);font-size:.72rem;line-height:1.35}.html-editor .post-gallery{gap:7px;max-width:460px;width:min(460px,100%)!important}.html-editor .post-gallery figure{margin:0}.html-editor .post-gallery img{max-height:100px}.content-elements{background:var(--ivory);border:1px solid var(--border);border-radius:9px;margin-top:8px;padding:18px}.content-elements__heading{align-items:start;display:flex;gap:16px;justify-content:space-between;margin-bottom:13px}.content-elements__heading h3{color:var(--charcoal);font-size:1.35rem;line-height:1.1;margin:0}.content-elements__count{background:var(--glow);border-radius:999px;color:var(--text);font-size:.74rem;font-weight:700;padding:6px 9px;white-space:nowrap}.content-elements__list{display:grid;gap:9px}.content-elements__empty{color:var(--muted);font-size:.82rem;margin:0}.content-elements__empty[hidden]{display:none}.content-element-card{align-items:center;background:#fff;border:1px solid var(--border);border-radius:8px;display:grid;gap:12px;grid-template-columns:72px minmax(0,1fr) auto;padding:9px}.content-element-card__preview{align-items:center;background:var(--dim);border-radius:6px;display:flex;height:58px;justify-content:center;overflow:hidden;width:72px}.content-element-card__thumb-image{height:100%;object-fit:cover;width:100%}.content-element-card__thumb-grid{display:grid;gap:2px;grid-template-columns:repeat(2,1fr);height:100%;width:100%}.content-element-card__thumb-placeholder{color:var(--muted);font-size:.72rem}.content-element-card__video-mark,.content-element-card__link-mark{color:var(--flame);font-size:1.6rem;font-weight:800}.content-element-card__link-mark{font-size:1.9rem}.content-element-card__body{display:grid;gap:2px;min-width:0}.content-element-card__type{color:var(--flame);font-size:.65rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.content-element-card__body strong{color:var(--charcoal);font-size:.84rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.content-element-card__body span,.content-element-card__body small{color:var(--muted);font-size:.72rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.content-element-card__action{white-space:nowrap}.gallery-alt-fields{display:grid;gap:10px}.gallery-alt-fields label{color:var(--charcoal);display:grid;font-size:.82rem;font-weight:700;gap:7px}.gallery-alt-fields input{background:#fff;border:1.5px solid var(--muted);border-radius:7px;color:var(--charcoal);padding:10px 12px;width:100%}.content-element-dialog{align-items:center;display:grid;inset:0;justify-items:center;padding:20px;position:fixed;z-index:31}.content-element-dialog__backdrop{background:rgb(33 27 21 / .55);inset:0;position:absolute}.content-element-dialog__panel{background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 22px 70px rgb(33 27 21 / .28);max-width:620px;padding:26px;position:relative;width:100%}.content-element-dialog__heading{align-items:start;display:flex;gap:16px;justify-content:space-between}.content-element-dialog__heading h2{font-size:clamp(1.6rem,4vw,2.3rem);line-height:1;margin:0}.content-element-fields{display:grid;gap:14px;margin-bottom:20px}.content-element-fields label:not(.check-row){color:var(--charcoal);display:grid;font-size:.82rem;font-weight:700;gap:7px}.content-element-fields input,.content-element-fields select{background:#fff;border:1.5px solid var(--muted);border-radius:7px;color:var(--charcoal);padding:10px 12px;width:100%}.content-element-fields input:focus,.content-element-fields select:focus{border-color:var(--flame);box-shadow:0 0 0 3px rgb(253 147 45 / .15);outline:0}.content-element-dialog__actions{display:flex;flex-wrap:wrap;gap:9px}@media(max-width:560px){.content-element-card{align-items:stretch;grid-template-columns:58px minmax(0,1fr)}.content-element-card__preview{height:52px;width:58px}.content-element-card__action{grid-column:1 / -1;width:100%}.content-elements{padding:14px}.content-element-dialog{padding:12px}.content-element-dialog__panel{padding:21px}}
 .html-editor .post-gallery figure.media-size-small,.html-editor .post-gallery figure.media-size-medium,.html-editor .post-gallery figure.media-size-large,.html-editor .post-gallery figure.media-size-full,.html-editor .post-gallery figure.media-size-custom{width:auto!important}
.content-element-card__reference{align-items:center;display:flex;flex-wrap:wrap;gap:6px}.content-element-card__reference code{background:var(--dim);border-radius:4px;color:var(--charcoal);font-size:.72rem;padding:3px 5px}.content-element-card__reference button{background:transparent;border:0;color:var(--flame);cursor:pointer;font-size:.7rem;font-weight:700;padding:2px}.content-element-card__reference button:hover{text-decoration:underline}.content-element-reference-fields{display:grid;gap:14px;margin-bottom:20px}.content-element-reference-fields label{color:var(--charcoal);display:grid;font-size:.82rem;font-weight:700;gap:7px}.content-element-reference-fields input{background:#fff;border:1.5px solid var(--muted);border-radius:7px;color:var(--charcoal);padding:10px 12px;width:100%}.content-element-reference-fields input:focus{border-color:var(--flame);box-shadow:0 0 0 3px rgb(253 147 45 / .15);outline:0}.content-element-reference-fields small,.image-size-dialog__fields code{color:var(--muted);font-size:.72rem;font-weight:400}.content-element-reference-fields code,.image-size-dialog__fields code{color:var(--flame);font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.editor-help{display:block;margin-top:2px}.html-source:not([hidden]){border-radius:7px}.content-elements__intro{color:var(--text);font-size:.82rem;line-height:1.55;margin:0 0 14px}.content-elements__tools{background:#fff;border:1px solid var(--border);border-radius:8px;display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px;padding:11px}.content-elements__tool-group{align-items:center;display:flex;flex-wrap:wrap;gap:6px}.content-elements__tool-label{color:var(--muted);font-size:.7rem;font-weight:800;letter-spacing:.06em;margin-right:2px;text-transform:uppercase}.content-elements__tools button{background:var(--ivory);border:1px solid var(--border);border-radius:5px;color:var(--charcoal);cursor:pointer;font-size:.76rem;font-weight:700;padding:7px 9px}.content-elements__tools button:hover{background:var(--glow);border-color:var(--flame);color:var(--flame)}.file-input{height:1px;opacity:0;position:absolute;width:1px;z-index:-1}.file-input:focus{outline:2px solid var(--flame);outline-offset:3px}
.editor-toolbar{align-items:center}.editor-toolbar button{align-items:center;display:inline-flex;height:34px;justify-content:center;min-width:34px;padding:5px 8px}.toolbar-icon{display:inline-block;font-size:1.05rem;font-weight:700;line-height:1}.toolbar-icon--heading{font-size:.95rem}.toolbar-icon--bold{font-weight:900}.toolbar-icon--italic{font-family:Georgia,serif;font-size:1.2rem;font-style:italic}.toolbar-icon--clear{font-size:.8rem;letter-spacing:-.08em}
.image-size-dialog,.content-element-dialog{overflow-y:auto}.image-size-dialog__panel,.content-element-dialog__panel{max-height:calc(100vh - 40px);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}@supports (height:100dvh){.image-size-dialog__panel,.content-element-dialog__panel{max-height:calc(100dvh - 40px)}}
.content-elements__tools{display:grid;gap:0}.content-elements__tool-row{display:flex;flex-wrap:wrap;gap:10px}.content-elements__tool-row--upload{border-top:1px solid var(--dim);margin-top:10px;padding-top:10px}.content-elements__tool-row--upload .content-elements__tool-group{width:100%}
.html-editor [data-element-id]{display:none!important}.html-editor [data-element-id] *{display:none!important}
.admin-preview a:not(.post-image-link){color:var(--flame);font-weight:700;text-decoration-line:underline;text-decoration-color:var(--glow);text-decoration-thickness:2px;text-underline-offset:3px;transition:background-color .2s ease,color .2s ease}.admin-preview a:not(.post-image-link):hover{background:var(--glow);color:var(--charcoal);text-decoration-color:var(--charcoal)}
.image-size-dialog__fields textarea,.content-element-fields textarea,.gallery-alt-fields textarea{background:#fff;border:1.5px solid var(--muted);border-radius:7px;color:var(--charcoal);font:inherit;line-height:1.5;min-height:74px;padding:10px 12px;resize:vertical;width:100%}.image-size-dialog__fields textarea:focus,.content-element-fields textarea:focus,.gallery-alt-fields textarea:focus{border-color:var(--flame);box-shadow:0 0 0 3px rgb(253 147 45 / .15);outline:0}.gallery-media-fields{border-bottom:1px solid var(--dim);display:grid;gap:10px;padding-bottom:12px}.gallery-media-fields:last-child{border-bottom:0;padding-bottom:0}
.cover-editor{background:var(--ivory);border:1px solid var(--border);border-radius:9px;padding:16px}.cover-editor__heading{align-items:start;display:flex;gap:12px;justify-content:space-between;margin-bottom:12px}.cover-editor__heading strong{color:var(--charcoal);display:block;font-size:1.02rem}.cover-editor__status{color:var(--muted);font-size:.78rem;text-align:right}.cover-editor__preview{background:var(--dim);border-radius:7px;margin-bottom:12px;max-width:420px;overflow:hidden}.cover-editor__preview img{aspect-ratio:16 / 9;display:block;height:auto;object-fit:cover;width:100%}.cover-editor__actions{display:flex;flex-wrap:wrap;gap:9px}.cover-editor__help{color:var(--muted);display:block;font-size:.74rem;line-height:1.45;margin-top:11px}.cover-crop-dialog{align-items:center;display:grid;inset:0;justify-items:center;padding:20px;position:fixed;z-index:35}.cover-crop-dialog__backdrop{background:rgb(33 27 21 / .62);inset:0;position:absolute}.cover-crop-dialog__panel{background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 22px 70px rgb(33 27 21 / .3);max-height:calc(100vh - 40px);max-width:760px;overflow-y:auto;overscroll-behavior:contain;padding:26px;position:relative;width:100%;-webkit-overflow-scrolling:touch}.cover-crop-dialog__heading{align-items:start;display:flex;gap:16px;justify-content:space-between}.cover-crop-dialog__heading h2{font-size:clamp(1.6rem,4vw,2.3rem);line-height:1;margin:0}.cover-crop-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 17px}.cover-crop-tabs button{background:var(--ivory);border:1.5px solid var(--border);border-radius:999px;color:var(--charcoal);cursor:pointer;font-size:.8rem;font-weight:800;padding:9px 13px}.cover-crop-tabs button:hover,.cover-crop-tabs button.is-active{background:var(--glow);border-color:var(--flame);color:var(--charcoal)}.cover-crop-stage-wrap{align-items:center;background:var(--charcoal);border-radius:8px;display:flex;justify-content:center;min-height:180px;overflow:hidden;padding:12px}.cover-crop-stage{flex:none;position:relative}.cover-crop-stage img{display:block;height:100%;object-fit:fill;pointer-events:none;width:100%}.cover-crop-frame{align-items:center;border:3px solid #fff;box-shadow:0 0 0 9999px rgb(25 19 14 / .52),0 0 0 1px rgb(33 27 21 / .8);box-sizing:border-box;cursor:move;display:flex;justify-content:center;position:absolute;touch-action:none}.cover-crop-frame span{background:rgb(33 27 21 / .75);border-radius:999px;color:#fff;font-size:.7rem;font-weight:800;padding:5px 8px;pointer-events:none;white-space:nowrap}.cover-crop-alt{color:var(--charcoal);display:grid;font-size:.82rem;font-weight:700;gap:7px;margin-top:18px}.cover-crop-alt input{background:#fff;border:1.5px solid var(--muted);border-radius:7px;color:var(--charcoal);padding:10px 12px;width:100%}.cover-crop-alt input:focus{border-color:var(--flame);box-shadow:0 0 0 3px rgb(253 147 45 / .15);outline:0}.cover-crop-alt small{color:var(--muted);font-size:.72rem;font-weight:400;line-height:1.35}.cover-crop-dialog .content-element-dialog__actions{margin-top:20px}
@media(max-width:560px){.cover-editor__heading{display:block}.cover-editor__status{display:block;margin-top:5px;text-align:left}.cover-crop-dialog{padding:12px}.cover-crop-dialog__panel{padding:21px;max-height:calc(100vh - 24px)}.cover-crop-stage-wrap{padding:7px}.cover-crop-frame span{font-size:.64rem}}
.status-badge__pending{align-items:center;background:#b64032;border-radius:50%;color:#241b17;display:inline-flex;font-size:.55rem;height:14px;justify-content:center;margin-left:5px;vertical-align:-1px;width:14px}

/* Keep the status/date controls aligned while giving the native select a calmer custom arrow. */
.form-grid--status{align-items:start}
.form-grid--status .field-label{align-items:baseline;display:flex;flex-wrap:wrap;gap:5px;line-height:1.25;min-height:1.25em}
.form-grid--status .field-label small{font-size:.72rem;line-height:1.25}
.field-label--actions{align-items:center;display:flex;justify-content:space-between;line-height:1.25;min-height:1.25em}
.field-label--actions .text-button{font-size:.78rem;font-weight:700;padding:0}
.form-grid--status input,.form-grid--status select{border-width:1.5px;min-height:45px}
.form-grid--status select{appearance:none;padding-right:42px}
.select-wrap{display:block;position:relative}
.select-wrap::after{border-bottom:1.5px solid var(--charcoal);border-right:1.5px solid var(--charcoal);content:"";height:8px;pointer-events:none;position:absolute;right:16px;top:50%;transform:translateY(-65%) rotate(45deg);width:8px}
.form-grid--status .select-wrap select{width:100%}

.seo-fields{background:var(--ivory);border:1px solid var(--border);border-radius:9px;display:grid;gap:18px;padding:18px}
.seo-fields__title{color:var(--charcoal);font-size:1rem;font-weight:800;line-height:1.2;margin:0}
.seo-fields .form-help{line-height:1.55;margin:0}
.seo-fields .form-grid{align-items:start}
.seo-fields .form-grid>label{align-content:start;align-self:start}
.seo-fields [readonly]{background:#f4f0eb;color:var(--text);cursor:default}
.admin-form small,.form-help,.editor-help,.cover-editor__status,.cover-editor__help,.image-size-dialog__help,.image-size-dialog__fields small,.content-elements__intro,.content-elements__empty,.admin-preview__empty,.content-element-card__thumb-placeholder,.seo-indexable-field small,.social-export-box small{color:var(--caption)}
.editor-updated{color:var(--caption)}
.seo-fields input[data-canonical-url]{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.82rem;letter-spacing:-.02em;overflow-x:auto;text-overflow:clip;white-space:nowrap}
.seo-indexable-field{align-content:start;display:grid;gap:7px}
.seo-indexable-field .field-label{color:var(--charcoal);font-size:.86rem;font-weight:700}
.seo-indexable-field .check-row{align-items:center!important;display:flex!important;gap:9px;min-height:45px}
.seo-indexable-field .check-row input{accent-color:var(--flame);height:17px;width:17px}
.seo-indexable-field small{color:var(--muted);font-size:.72rem;font-weight:400;line-height:1.35}
.keyword-checker{display:grid;gap:9px}
.keyword-checker>label{align-content:start;display:grid;gap:7px}
.keyword-input{align-items:center;background:#fff;border:1.5px solid var(--muted);border-radius:7px;display:flex;flex-wrap:wrap;gap:7px;min-height:47px;padding:6px 9px;transition:border-color .2s ease,box-shadow .2s ease}
.keyword-input:focus-within{border-color:var(--flame);box-shadow:0 0 0 3px rgb(253 147 45 / .15)}
.keyword-input>input{background:transparent!important;border:0!important;box-shadow:none!important;flex:1 1 150px;min-width:150px;outline:0;padding:5px 3px!important;width:auto}
.keyword-chips{display:contents}
.keyword-chip{align-items:center;border:1px solid transparent;border-radius:999px;display:inline-flex;font-size:.78rem;font-weight:700;gap:7px;line-height:1.2;padding:7px 8px 7px 11px;transition:background .2s ease,border-color .2s ease,color .2s ease}
.keyword-chip--pending{background:var(--dim);border-color:var(--border);color:var(--charcoal)}
.keyword-chip--strong{background:#d9efd4;border-color:#5d9b58;color:#285f2d}
.keyword-chip--medium{background:#ffe0bd;border-color:#e28a2a;color:#914b0c}
.keyword-chip--neutral{background:#fff3a6;border-color:#c8ae00;color:#615500}
.keyword-chip--missing{background:#f6c3b8;border-color:#c85d49;color:#812b1d}
.keyword-chip button{background:transparent;border:0;border-radius:50%;color:inherit;cursor:pointer;font:inherit;height:20px;line-height:1;padding:0;width:20px}
.keyword-chip button:hover{background:rgb(255 255 255 / .72)}
.keyword-chip button:focus-visible{outline:2px solid currentColor;outline-offset:1px}
.keyword-checker__actions{align-items:center;display:flex;flex-wrap:wrap;gap:10px}
.keyword-checker__actions small{color:var(--text);font-size:.78rem}
.keyword-legend{display:flex;flex-wrap:wrap;gap:6px 12px}
.keyword-legend__item{border-radius:999px;font-size:.7rem;font-weight:700;padding:4px 8px}
.keyword-legend__item--strong{background:#d9efd4;color:#285f2d}
.keyword-legend__item--medium{background:#ffe0bd;color:#914b0c}
.keyword-legend__item--neutral{background:#fff3a6;color:#615500}
.keyword-legend__item--missing{background:#f6c3b8;color:#812b1d}
.social-export-box{background:#fff;border:1px solid var(--border);border-radius:8px;display:grid;gap:10px;padding:15px}
.social-export-box strong{color:var(--charcoal);display:block;font-size:1rem;margin-top:2px}
.social-export-box .eyebrow{margin:0}
.social-export-box .form-help{font-size:.82rem}
.social-export-box code{background:var(--dim);border-radius:3px;color:var(--charcoal);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.72rem;padding:2px 4px}

/* The editor uses tags as toggles; deletion stays available only in the tag manager. */
.tag-options .tag-option{appearance:none;background:transparent;border:1.5px solid var(--border);border-radius:999px;color:var(--charcoal);cursor:pointer;font:600 .8rem/1.2 var(--font-body);padding:9px 13px;text-align:left;transition:background .2s ease,border-color .2s ease,box-shadow .2s ease,color .2s ease}
.tag-options .tag-option:hover{background:var(--ivory);border-color:var(--flame)}
.tag-options .tag-option.is-selected{background:var(--glow);border-color:var(--flame);box-shadow:0 3px 10px rgb(253 147 45 / .18)}
.tag-options .tag-option:focus-visible{box-shadow:0 0 0 3px rgb(253 147 45 / .2);outline:2px solid var(--flame);outline-offset:2px}

.admin-table__likes{color:var(--flame);font-weight:800;white-space:nowrap}
.like-admin-settings{align-items:start}.like-admin-summary{align-self:start;background:var(--ivory);border:1px solid var(--border);border-radius:7px;color:var(--text);display:grid;gap:6px;min-height:45px;padding:11px 13px}.like-admin-summary strong{color:var(--charcoal)}
.admin-table{min-width:560px}.admin-sort-button{align-items:center;background:transparent;border:0;color:inherit;cursor:pointer;display:inline-flex;font:inherit;gap:5px;letter-spacing:inherit;padding:0;text-align:left;text-transform:inherit}.admin-sort-button:hover,.admin-sort-button[aria-pressed="true"]{color:var(--flame)}.admin-sort-button span{color:var(--flame);font-size:.95rem}.admin-table__status{display:block;margin-bottom:5px}.table-actions{gap:4px}.table-action{align-items:center;display:inline-flex;height:30px;justify-content:center;padding:4px;width:30px}.table-action__icon{fill:none;height:17px;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8;width:17px}.editor-updated{color:var(--muted);font-size:.78rem;margin:7px 0 0}.editor-updated time{color:var(--text);font-weight:700}
.admin-preview{background:transparent;border:0;box-shadow:none;min-height:0;padding:0}.admin-preview>.container{width:100%}.admin-preview .post-cover--empty{aspect-ratio:3 / 2;height:auto;min-height:0;width:100%}.admin-preview .post-detail__body{margin-left:0;margin-right:0}.admin-preview [data-preview-tag]{cursor:default}
.admin-table th:first-child,.admin-table td:first-child{padding-right:28px}
.admin-card__heading-actions{align-items:center;display:flex;flex-wrap:wrap;gap:10px}
.admin-preview__actions{pointer-events:none}
.admin-table tbody tr{transition:background-color .2s ease}.admin-table tbody tr:hover{background:rgb(240 231 213 / .4)}.admin-table__status-line{align-items:center;display:flex;flex-wrap:wrap;gap:6px;margin-bottom:5px}.admin-table__tag{background:var(--dim);border:1px solid var(--border);border-radius:999px;color:var(--text);font-size:.66rem;font-weight:700;padding:4px 8px;white-space:nowrap}

/* Keep the editor preview in the same order and style as the published article. */
.admin-preview .article-hero{background:var(--ivory);border-bottom:1px solid var(--dim);color:var(--charcoal);padding:48px 20px 40px}
.admin-preview .article-hero .eyebrow{color:var(--muted);font-weight:800;margin-bottom:18px}
.admin-preview .article-hero h1{color:var(--charcoal);font-size:clamp(2.5rem,4vw,3.2rem);font-weight:700;line-height:1.12;max-width:900px}
.admin-preview .article-hero .article-hero__lead{border-left:3px solid var(--glow);border-right:3px solid var(--glow);color:var(--charcoal);font-size:1rem;font-weight:700;line-height:1.65;margin:28px auto 0;max-width:720px;overflow-wrap:break-word;padding:0 22px;text-wrap:pretty}
.admin-preview .article-hero .container{width:100%}
.admin-preview .post-detail__header{margin-bottom:28px}
.admin-preview .post-detail__meta{font-size:.86rem;gap:4px 14px;line-height:1.35;margin-bottom:0}
.admin-preview .post-detail__meta-label{font-size:.72rem}
.admin-preview .post-detail__meta .post-tags{display:inline-flex;margin:0}
.admin-preview .post-detail__meta .post-tags a{font-size:.78rem}
.admin-preview .post-detail__actions{border-top:0;margin:-10px auto 42px}
.admin-preview .post-detail__share{display:none}

/* Keep every editor-only hint, empty state and secondary caption consistently quiet. */
.html-editor:empty::before,
.admin-preview figcaption,
.html-editor figure figcaption,
.admin-stat span,
.admin-table th,
.admin-table__slug,
.managed-tag small,
.image-size-options small,
.cover-crop-alt small,
.content-element-reference-fields small,
.content-element-card__body span,
.content-element-card__body small {
  color: var(--caption);
}

.admin-form small,
.form-help,
.editor-help,
.cover-editor__status,
.cover-editor__help,
.image-size-dialog__help,
.image-size-dialog__fields small,
.content-elements__intro,
.content-elements__empty,
.admin-preview__empty,
.content-element-card__thumb-placeholder,
.seo-indexable-field small,
.social-export-box small,
.content-element-reference-fields small,
.editor-updated,
.editor-updated time {
  color: var(--caption);
}

.admin-table__secondary {
  color: var(--caption);
}

.admin-preview__back-link {
  pointer-events: none;
}

/* The preview uses the same page-level article surface and production rules
   as the published article. Only the surrounding admin card remains admin UI. */
.admin-preview {
  background: var(--ivory);
  border: 0;
  box-shadow: none;
  color: var(--charcoal);
  line-height: 1.5;
  min-height: 0;
  padding: 0;
}

.admin-preview .article-hero {
  padding: 48px 0 40px;
}

.admin-preview .article-hero .container {
  width: min(1100px, calc(100% - 48px));
}

.admin-preview .article-hero h1 {
  max-width: 760px;
}

.admin-preview .article-hero .article-hero__lead {
  max-width: 760px;
}

.admin-preview .post-detail__body {
  margin-left: auto;
  margin-right: auto;
}

.admin-preview .post-detail__body figure {
  margin: 2em 0;
}

.admin-preview .post-detail__body .post-gallery {
  gap: 14px;
}

.admin-preview .post-detail__body .blog-video {
  background: #211b15;
  border-radius: 10px;
  margin: 2em 0;
  overflow: hidden;
}

/* FAQ: always visible, with bold questions and justified answers. */
.faq {
  background: #fffaf2;
  border-block: 1px solid var(--dim);
}

.faq-list {
  display: grid;
  gap: 28px;
  margin-inline: auto;
  max-width: 860px;
}

.faq-item {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: var(--shadow);
  padding: 24px 28px;
}

.faq-item h3 {
  color: var(--charcoal);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 12px;
}

.faq-item p {
  color: var(--text);
  line-height: 1.75;
  margin: 0;
  text-wrap: pretty;
}

.faq-item .faq-link {
  background: var(--glow);
  border-radius: 4px;
  color: var(--deep);
  font-weight: 700;
  padding: 2px 6px;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: background-color .2s var(--ease), color .2s var(--ease);
}

.faq-item .faq-link:hover,
.faq-item .faq-link:focus-visible {
  background: var(--flame);
  color: #fff;
}

@media (max-width: 500px) {
  .faq-item {
    padding: 20px;
  }
}

/* Keep the transition from the products to the FAQ compact and balanced. */
.home-page .products.section {
  padding-bottom: 48px;
}

.home-page .faq.section {
  padding-top: 48px;
}

@media (max-width: 760px) {
  .home-page .products.section,
  .home-page .faq.section {
    padding-block: 40px;
  }
}


/* Keep the optional JSON-LD editor compact while retaining the full value in a modal. */
.schema-field-summary {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
}

.schema-field-summary small {
  flex: 1 1 260px;
}

.schema-dialog__panel {
  max-width: 760px;
}

.schema-dialog__panel > textarea {
  background: #fff;
  border: 1.5px solid var(--muted);
  border-radius: 7px;
  box-sizing: border-box;
  color: var(--charcoal);
  font: .84rem/1.55 ui-monospace, SFMono-Regular, Consolas, monospace;
  min-height: 300px;
  padding: 12px 13px;
  resize: vertical;
  width: 100%;
}

.schema-dialog__panel > textarea:focus {
  border-color: var(--flame);
  box-shadow: 0 0 0 3px rgb(253 147 45 / .15);
  outline: 0;
}

.schema-dialog__actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
  margin-top: 18px;
}

.schema-dialog__actions-main {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

@media (max-width: 560px) {
  .schema-dialog__actions,
  .schema-dialog__actions-main {
    align-items: stretch;
    flex-direction: column;
  }

  .schema-dialog__actions .button {
    width: 100%;
  }
}
/* Keep adjacent cards aligned: the image frame is independent from the
   description height, so a longer description only adds space below it. */
@media (min-width: 761px) and (max-width: 1500px) {
  .product-grid {
    align-items: stretch;
  }

  .product-card {
    grid-template-rows: minmax(320px, max-content) minmax(0, 1fr);
  }

  .product-image {
    aspect-ratio: 1 / 1;
    min-height: 0;
  }
}


/* Blog cards use the same row logic: the media frame stays fixed and the
   body fills the shared row height set by the longest card. */
.post-grid {
  align-items: stretch;
}

.post-card {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.post-card__body {
  min-height: 0;
}
/* Start each card's content at the same top line before the row-based
   description spacer brings the controls back into alignment. */
.product-body {
  gap: 12px;
  justify-content: flex-start;
}

/* Keep the selectors directly below the Meska CTA. */
.product-body > .swatches {
  margin-top: 0;
}


/* The editor exposes H2-H3; the article title itself is the single H1. */
.admin-preview h1 {
  color: var(--charcoal);
  line-height: 1.15;
}

/* These two editor notices are normal guidance text, not fine print. */
.admin-form .editor-help,
.form-help[data-markdown-export-status] {
  font-size: 1rem;
  line-height: 1.55;
}
/* Give the candle a little breathing room for the longer vertical float. */
@media (min-width: 761px) {
  .hero-animation {
    height: 332px;
  }

  .hero-animation svg {
    flex: 0 0 300px;
    height: 330px;
    width: 300px;
  }

  .rolunk-page .about-animation {
    height: 330px;
    max-width: 300px;
  }

  .rolunk-page .about-animation svg {
    height: 330px;
    width: 300px;
  }
}

@media (max-width: 760px) {
  .hero-animation {
    align-items: center;
    height: 322px;
    padding-top: 0;
  }

  .hero-animation svg {
    flex: 0 0 auto;
    height: 320px;
    width: min(278px, 100%);
  }

  .rolunk-page .about-animation {
    height: 198px;
    max-width: 170px;
  }

  .rolunk-page .about-animation svg {
    height: 198px;
    width: 170px;
  }
}

/* Keep the public image hover treatment consistent across products and blog images. */
.product-image img,
.post-card__media .post-cover:not(.post-cover--empty),
.post-detail__body .post-image-link img {
  transition: transform .45s var(--ease), filter .45s var(--ease), box-shadow .2s ease, opacity .28s var(--ease);
}

.product-card:hover .product-image img,
.post-card:hover .post-card__media .post-cover:not(.post-cover--empty) {
  transform: scale(1.1);
  filter: brightness(.88);
}

.post-detail__body .post-image-link:hover img {
  transform: translateY(-2px) scale(1.1);
  filter: brightness(.88);
}

.post-detail__body .post-image-link {
  overflow: hidden;
}

/* A kezdőoldali hero-szöveg vizuálisan maradjon kiemelt, de szemantikailag H2 legyen. */
.hero h1 {
  color: var(--ivory);
  font-size: clamp(2.1rem, 4vw, 3.4rem);
  font-weight: 500;
  letter-spacing: .02em;
  line-height: 1.12;
  margin: 28px 0;
}

.hero h1 em {
  color: var(--glow);
  font-family: var(--font-script);
  font-size: 1.15em;
  font-style: normal;
  font-weight: 700;
}

.section-heading h1 {
  font-size: clamp(2.25rem, 4vw, 3.4rem);
  line-height: 1.05;
  margin: 0 0 14px;
}

html.fonts-loading .hero h1 {
  visibility: hidden;
}

/* Keep the hero lockup, intro copy and headline evenly separated on desktop. */
@media (min-width: 761px) {
  .hero-copy {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 390px;
    justify-content: center;
    row-gap: 28px;
  }

  .hero-wordmark {
    margin: 0;
  }

  .hero-middle {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 28px;
    width: 100%;
  }

  .hero-intro {
    margin: 0;
    max-width: 510px;
    text-align: center;
    width: 100%;
  }

  .hero h1 {
    margin: 0;
    text-align: center;
  }
}

/* A Rólunk oldalon az animáció maradjon kompakt, hogy a szöveg és a számlálók is kényelmesen elférjenek. */
@media (min-width: 761px) {
  .rolunk-page .about-grid {
    gap: 34px;
    grid-template-columns: minmax(0, .6fr) minmax(0, 1.4fr);
  }

  .rolunk-page .about-animation {
    max-width: 260px;
  }

  .rolunk-page .about-animation svg {
    width: min(260px, 100%);
  }

.rolunk-page .about-grid > div:nth-child(2) {
    min-width: 0;
  }
}

/* Temporary Meska links. */
.product-meska {
  align-self: flex-start;
  font-size: .78rem;
  min-height: 34px;
  margin-top: 15px;
  padding-inline: 14px;
}

.product-tagline {
  color: var(--text);
  font-size: .95rem;
  font-weight: 700;
  margin: 0;
}

.product-body > h2 {
  font-size: 1.45rem;
  line-height: 1.2;
  margin: 0;
}

.product-body > .product-tagline {
  margin: 0;
}

.product-body > .product-price {
  color: var(--flame);
  font-size: 1.1rem;
  font-weight: 700;
  margin: 0;
  order: 1;
}

.product-body > .product-meska {
  margin: 0;
  order: 3;
}

.product-body > .swatches,
.product-body > .scent-tags {
  margin: 0;
  order: 2;
}

.product-body > .product-description {
  margin: 0;
  order: 4;
}

.product-body > .product-order-note {
  color: var(--muted);
  font-size: .72rem;
  line-height: 1.35;
  margin: 0;
  order: 4;
}

.product-description {
  margin-top: 0;
}

/* Product descriptions use natural wrapping on every screen size. */
.product-description {
  overflow-wrap: break-word;
  text-wrap: pretty;
}

.product-description strong {
  text-align: left;
}

/* Final hero alignment: keep the supporting copy and headline centered
   inside the complete left-hand hero column at every desktop width. */
@media (min-width: 761px) {
  .hero-copy,
  .hero-middle {
    align-items: center;
    text-align: center;
  }

  .hero-middle {
    width: 100%;
  }

  .hero-intro,
  .hero h1 {
    margin-inline: auto;
    text-align: center;
    width: 100%;
  }
}

/* The hero is a supporting section: the product heading below remains H1.
   Keep the hero H2 and its purchase CTA in the same centered reveal flow. */
.hero h2 {
  color: var(--ivory);
  font-size: clamp(2rem, 3vw, 2.8rem);
  font-weight: 500;
  letter-spacing: .02em;
  line-height: 1.12;
  margin: 0;
}

.hero h2 em {
  color: var(--glow);
  font-family: var(--font-script);
  font-size: 1.15em;
  font-style: normal;
  font-weight: 700;
}

.hero-cta {
  align-self: center;
}

@media (min-width: 761px) {
  .hero-copy {
    display: flex;
    flex-direction: column;
    height: 440px;
    justify-content: space-between;
    row-gap: 0;
  }

  .hero-middle {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 28px;
    width: 100%;
  }

  .hero-intro,
  .hero h2 {
    margin-inline: auto;
    text-align: center;
    width: 100%;
  }
}

@media (max-width: 760px) {
  .hero-copy {
    row-gap: 40px;
  }

  .hero-middle {
    gap: 40px;
  }

  .hero h2 {
    font-size: clamp(1.9rem, 8vw, 2.4rem);
    text-align: center;
  }

  .hero-cta {
    margin-top: 0;
  }
}

/* Keep the hero lockup compact and rhythmical: each desktop step uses the
   same vertical spacing, while the intro remains justified with a centered
   final line. */
@media (min-width: 761px) {
  .hero-copy {
    justify-content: center;
    row-gap: 40px;
  }

  .hero-middle {
    gap: 40px;
  }

  .hero-intro {
    hyphens: none;
    overflow-wrap: break-word;
    text-align: center;
    text-align-last: center;
    text-wrap: pretty;
  }
}

/* A narrow desktop column cannot justify a short intro without creating
   oversized word gaps. Keep the block centered until there is enough width. */
@media (min-width: 761px) and (max-width: 1100px) {
  .hero-intro {
    text-align: center;
    text-align-last: center;
  }
}

/* The original standalone loader, rendered inline in the page. The frame clips
   only the animation; the document itself remains scrollable. */
.logo-animation-frame{overflow:hidden;position:relative}
.logo-animation-frame .stage{align-items:center;aspect-ratio:1/1;background:transparent;display:grid;height:100%;inset:auto;justify-items:center;margin:auto;max-width:100%;position:relative;transform:translate3d(0,11px,0) rotate(-.6deg);width:auto;animation:stageFloat 5s ease-in-out infinite;animation-play-state:paused;backface-visibility:hidden;will-change:transform}
.logo-animation-frame .stage.animation-cycle-running{animation-play-state:running}
.logo-animation-frame .stage>svg{animation:none!important;display:block;filter:none!important;height:100%!important;overflow:hidden;transform:none!important;width:100%!important}
html.animation-deferred .logo-animation-frame .stage,
html.animation-deferred .logo-animation-frame #camera,
html.animation-deferred .logo-animation-frame #flame,
html.animation-deferred .logo-animation-frame #flame .flicker,
html.animation-deferred .logo-animation-frame .flame-outer,
html.animation-deferred .logo-animation-frame .flame-inner,
html.animation-deferred .logo-animation-frame .flame-core,
html.animation-deferred .logo-animation-frame .flame-detail,
html.animation-deferred .logo-animation-frame #body,
html.animation-deferred .logo-animation-frame #gear-large,
html.animation-deferred .logo-animation-frame #gear-left,
html.animation-deferred .logo-animation-frame #gear-bottom,
html.animation-deferred .logo-animation-frame #rim,
html.animation-deferred .logo-animation-frame #wick,
html.animation-deferred .logo-animation-frame #wick path{animation-play-state:paused}
.logo-animation-frame .stage>svg{width:100%;height:100%;display:block;overflow:hidden}
.logo-animation-frame #camera{transform-box:view-box;transform-origin:50% 0%;animation:cameraZoomOut 2.1s cubic-bezier(.16,.84,.28,1) forwards}
.logo-animation-frame #flame{transform-box:view-box;transform-origin:50% 31%;opacity:0;animation:flameWake 2.1s cubic-bezier(.16,.84,.28,1) forwards}
.logo-animation-frame #flame .flicker{transform-box:fill-box;transform-origin:50% 85%;animation:flameFlicker .82s ease-in-out .64s 1 forwards}
.logo-animation-frame .flame-outer,
.logo-animation-frame .flame-inner,
.logo-animation-frame .flame-core,
.logo-animation-frame .flame-detail{transform-box:fill-box;transform-origin:50% 88%}
.logo-animation-frame .flame-outer{opacity:0;transform:scale(.1);filter:blur(34px);animation:flameOuterWake 2.1s ease-out forwards}
.logo-animation-frame .flame-inner{opacity:0;filter:blur(8px);animation:flameInnerWake 2.1s ease-out forwards}
.logo-animation-frame .flame-core{opacity:0;animation:flameCoreWake 2.1s ease-out forwards}
.logo-animation-frame .flame-detail{opacity:0;animation:flameDetailWake 2.1s ease-out forwards}
.logo-animation-frame #body,
.logo-animation-frame #gear-large,
.logo-animation-frame #gear-left,
.logo-animation-frame #gear-bottom,
.logo-animation-frame #rim{opacity:0;animation:bodyFadeIn 2.1s linear forwards}
.logo-animation-frame #body{transform-box:view-box;transform-origin:50% 31%;transform:scale(.02);animation:bodyWake 2.1s cubic-bezier(.16,.84,.28,1) forwards;filter:none}
.logo-animation-frame #wick{opacity:0;filter:none;transform-box:fill-box;transform-origin:50% 100%;animation:wickReveal 2.1s ease-out forwards;pointer-events:none}
.logo-animation-frame #wick path{stroke-linejoin:round;stroke-linecap:round;animation:wickWarm 2.1s linear forwards}
@keyframes flameFlicker{0%{transform:scaleX(1) scaleY(1) skewX(0)}22%{transform:scaleX(.992) scaleY(1.008) skewX(-.22deg)}47%{transform:scaleX(1.01) scaleY(.996) skewX(.18deg)}71%{transform:scaleX(.997) scaleY(1.004) skewX(-.1deg)}100%{transform:scaleX(1) scaleY(1) skewX(0)}}
@keyframes stageFloat{0%,100%{transform:translate3d(0,11px,0) rotate(-.6deg)}50%{transform:translate3d(0,-11px,0) rotate(.6deg)}}

/* Keep the same square animation viewport in all three page locations. */
.logo-animation-frame .stage>svg{aspect-ratio:1/1;object-fit:contain}
.coming-soon-page .logo-animation-frame,
body:not(.home-page):not(.rolunk-page) .logo-animation-frame{max-width:360px;width:100%}

/* Every inline copy uses the original loader's square viewport.  The SVG
   itself is identical; only the surrounding page layout is allowed to differ. */
.logo-animation-frame,
.rolunk-page .about-animation.logo-animation-frame,
.coming-soon-page .logo-animation-frame{align-items:center;aspect-ratio:1/1;display:grid;height:auto!important;justify-items:center;max-width:320px!important;min-height:0;padding:14px!important;width:100%!important}
.logo-animation-frame .stage{aspect-ratio:1/1;animation:stageFloat 5s ease-in-out infinite;animation-play-state:paused;height:100%;max-height:none;max-width:none;transform:translate3d(0,11px,0) rotate(-.6deg);width:100%}

/* Windows can expose reduced motion through the browser. The global rule
   above intentionally shortens decorative animations, but shortening this
   gear-synchronised timeline turns the float into a visible shake. */
@media (prefers-reduced-motion: reduce){
  .logo-animation-frame .stage{
    animation-duration:5s!important;
    animation-iteration-count:infinite!important;
    animation-timing-function:ease-in-out!important;
  }

  /* The logo reveal is part of the designed sequence. Keep its zoom and
     layered wake-up timings instead of collapsing them to 0.01ms. */
  .logo-animation-frame #camera,
  .logo-animation-frame #flame,
  .logo-animation-frame .flame-outer,
  .logo-animation-frame .flame-inner,
  .logo-animation-frame .flame-core,
  .logo-animation-frame .flame-detail,
  .logo-animation-frame #body,
  .logo-animation-frame #gear-large,
  .logo-animation-frame #gear-left,
  .logo-animation-frame #gear-bottom,
  .logo-animation-frame #rim,
  .logo-animation-frame #wick,
  .logo-animation-frame #wick path{
    animation-duration:2.1s!important;
  }
  .logo-animation-frame #flame .flicker{
    animation-duration:.82s!important;
    animation-delay:.64s!important;
  }

  /* The product color change is an intentional functional transition, not
     decorative motion, so Windows reduced-motion must not collapse it. */
  .product-image img,
  .image-lightbox img{
    transition-duration:.28s!important;
  }
}

/* Page reveals are functional sequencing, not optional decoration. Keep the
   delayed fade and 10px entrance even when Windows reports reduced motion. */
@media (prefers-reduced-motion: reduce){
  .home-page .reveal-item:not(.is-revealed),
  .rolunk-page .reveal-item:not(.is-revealed),
  .workshop-page .reveal-item:not(.is-revealed){
    opacity:0!important;
    transform:translateY(10px)!important;
    visibility:hidden!important;
  }
  .home-page .reveal-item.is-revealed,
  .rolunk-page .reveal-item.is-revealed,
  .workshop-page .reveal-item.is-revealed{
    animation:content-reveal .4s ease-out var(--reveal-delay,.1s) both!important;
    opacity:1!important;
    transform:translateY(0)!important;
    visibility:visible!important;
  }
  .home-page .reveal-fade-item:not(.is-revealed),
  .rolunk-page .reveal-fade-item:not(.is-revealed),
  .workshop-page .reveal-fade-item:not(.is-revealed){
    opacity:0!important;
    transform:none!important;
    visibility:hidden!important;
  }
  .home-page .reveal-fade-item.is-revealed,
  .rolunk-page .reveal-fade-item.is-revealed,
  .workshop-page .reveal-fade-item.is-revealed{
    animation:content-fade .4s ease-out var(--reveal-delay,.1s) both!important;
    opacity:1!important;
    transform:none!important;
    visibility:visible!important;
  }
  .contact-social-reveal:not(.is-revealed){
    opacity:0!important;
    transform:translateY(20px)!important;
    visibility:hidden!important;
  }
  .contact-social-reveal.is-revealed{
    animation:contact-social-enter .4s ease-out both!important;
    opacity:1!important;
    transform:translateY(0)!important;
    visibility:visible!important;
  }
  .rolunk-page .facts > div{
    opacity:0!important;
    transform:translateY(20px)!important;
    transition:opacity .4s ease-out var(--fact-delay,.1s),transform .4s ease-out var(--fact-delay,.1s)!important;
  }
  .rolunk-page .facts.is-revealed > div{
    animation:fact-content-reveal .4s ease-out var(--fact-delay,.1s) both!important;
    opacity:1!important;
    transform:translateY(0)!important;
  }
}

/* Keep the footer and inner-page headers in the same soft, one-point glow
   language as the home-page hero. */
:root{--brand-radial:radial-gradient(circle at 72% 16%,rgb(253 147 45 / .18) 0,rgb(253 147 45 / .1) 20%,transparent 58%)}
.site-footer,.page-hero{background:var(--brand-radial),var(--charcoal)}
.rolunk-page .page-hero{background:var(--brand-radial),var(--charcoal);color:var(--ivory)}
.rolunk-page .page-hero .eyebrow{color:var(--glow)}
.rolunk-page .page-hero p:not(.eyebrow){color:rgb(254 207 122 / .78)}

/* Homepage: the wordmark and logo share the left column; the headline and
   framed candle share the right column. */
.home-page .hero-copy {
  height: auto;
  row-gap: 24px;
}

.home-page .hero-product-frame {
  background: rgb(252 246 236 / .045);
  border: 1px solid rgb(254 207 122 / .35);
  border-radius: 8px;
  flex-shrink: 0;
  padding: 7px;
  width: min(320px, 100%);
}

.home-page .hero-product-frame img {
  aspect-ratio: 1;
  border-radius: 4px;
  display: block;
  height: auto;
  width: 100%;
}

.home-page .hero-middle {
  gap: 24px;
}

.home-page .hero-visual {
  gap: 24px;
  max-width: 510px;
}

.home-page .hero-visual .hero-intro {
  margin: 0;
  text-align: center;
}

.home-page .hero-visual .hero-animation {
  flex-shrink: 0;
}

.home-page .hero-visual .hero-cta {
  margin: 0;
}

@media (min-width: 761px) {
  .home-page .hero-grid {
    align-items: start;
    column-gap: 70px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas:
      "brand headline"
      "logo product"
      "intro intro"
      "cta cta";
    grid-template-rows: auto auto auto auto;
    min-height: 0;
    padding: 52px 0 64px;
    row-gap: 28px;
  }

  /* Flatten the two source wrappers into one intentional desktop composition. */
  .home-page .hero-copy,
  .home-page .hero-visual,
  .home-page .hero-middle {
    display: contents;
  }

  .home-page .hero-wordmark {
    align-self: end;
    grid-area: brand;
    justify-self: center;
    margin: 0;
  }

  .home-page .hero-product-frame {
    align-self: start;
    grid-area: product;
    justify-self: center;
    width: min(320px, 100%);
  }

  .home-page .hero h2 {
    align-self: end;
    grid-area: headline;
    justify-self: center;
    margin: 0;
    max-width: 420px;
    text-align: center;
  }

  .home-page .hero-animation {
    align-self: start;
    grid-area: logo;
    height: auto;
    justify-self: center;
    max-width: 320px;
    width: min(320px, 100%);
  }

  .home-page .hero-visual .hero-intro,
  .home-page .hero-intro {
    align-self: start;
    grid-area: intro;
    justify-self: center;
    margin: 0;
    max-width: 780px;
    text-align: center;
    width: 100%;
  }

  .home-page .hero-cta {
    align-self: start;
    grid-area: cta;
    justify-self: center;
    margin: 0;
  }
}

@media (max-width: 760px) {
  .home-page .hero-grid {
    display: flex;
    flex-direction: column;
  }

  .home-page .hero-copy {
    display: contents;
  }

  .home-page .hero-visual {
    display: contents;
  }

  .home-page .hero-middle {
    display: contents;
  }

  .home-page .hero-wordmark {
    order: 1;
  }

  .home-page .hero-animation {
    order: 2;
  }

  .home-page .hero h2 {
    order: 3;
  }

  .home-page .hero-product-frame {
    order: 4;
  }

  .home-page .hero-intro {
    order: 5;
  }

  .home-page .hero-cta {
    order: 6;
  }
}
.admin-table__title-link{background:transparent;border:0;color:inherit;cursor:pointer;font:inherit;padding:0;text-align:left;width:100%}.admin-table__title-link:hover{color:var(--flame);text-decoration:underline}

.sync-panel{min-width:0}.sync-toolbar{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 16px}.sync-protection-note{background:var(--ivory);border-left:3px solid var(--flame);color:var(--text);font-size:.82rem;line-height:1.55;margin:0 0 15px;padding:11px 14px}.sync-status{color:var(--text);font-weight:700;min-height:26px}.sync-status.is-error{color:#9f4f32}.sync-status.is-success{color:#39703a}.sync-backup-note{background:#e3f0df;border:1px solid #b8d4b5;border-radius:8px;color:#39703a;margin:12px 0;padding:12px 14px}.sync-summary{display:grid;gap:12px;grid-template-columns:repeat(4,minmax(0,1fr));margin:20px 0}.sync-summary__item{background:var(--ivory);border:1px solid var(--border);border-radius:8px;padding:14px}.sync-summary__item strong{color:var(--flame);display:block;font-size:1.7rem;line-height:1}.sync-summary__item span{color:var(--muted);display:block;font-size:.75rem;margin-top:6px}.sync-lists{display:grid;gap:14px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:16px}.sync-list-card{background:var(--ivory);border:1px solid var(--border);border-radius:8px;padding:17px}.sync-list-card--danger{border-color:#d7a79c}.sync-list-card h3{color:var(--charcoal);font-size:1.05rem;margin:0}.sync-list-card p{color:var(--muted);font-size:.78rem;margin:5px 0 10px}.sync-list-card ul{list-style:none;margin:0;max-height:250px;overflow:auto;padding:0}.sync-list-card li{border-top:1px solid var(--dim);font: .78rem/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere;padding:7px 0}.sync-list-card li:first-child{border-top:0}.sync-list-card li.is-empty{color:var(--muted);font-family:inherit;font-style:italic}.sync-delete-confirm{border:1px solid #d7a79c;border-radius:8px;color:#9f4f32;margin-top:18px;padding:12px 14px}.sync-delete-confirm input{accent-color:#9f4f32}.sync-details{margin-top:18px}.sync-details summary{color:var(--flame);cursor:pointer;font-weight:700}.sync-details pre{background:var(--charcoal);border-radius:8px;color:#fff;padding:14px;max-height:360px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;font: .74rem/1.45 ui-monospace,SFMono-Regular,Consolas,monospace}
@media(max-width:800px){.sync-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.sync-lists{grid-template-columns:1fr}}
@media(max-width:560px){.sync-toolbar{align-items:stretch;flex-direction:column}.sync-toolbar .button{width:100%}.sync-summary{gap:9px}.sync-summary__item{padding:12px}.sync-summary__item strong{font-size:1.45rem}}
.post-tags .post-tag{background:var(--glow);border-radius:999px;color:var(--charcoal);font-size:.72rem;font-weight:800;padding:5px 9px}.post-tags .post-tag--featured{background:var(--flame);color:#fff}

/* The About page uses the same four purchase-oriented features as the Hero. */
.rolunk-page .facts.facts--features {
  display: grid;
  gap: 12px;
  grid-column: 2;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.rolunk-page .facts.facts--features > div {
  align-items: center;
  background: #fff;
  border: 1px solid var(--flame);
  border-radius: 999px;
  box-shadow: 0 5px 15px rgb(58 44 31 / .10);
  color: var(--charcoal);
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr);
  min-height: 82px;
  padding: 10px 12px;
  text-align: center;
  text-shadow: none;
}
.rolunk-page .facts.facts--features > div > img,
.rolunk-page .facts.facts--features > div > .about-feature-icon {
  grid-column: 1;
  grid-row: 1;
  height: 40px;
  justify-self: start;
  margin-left: 10px;
  object-fit: contain;
  transform: translateY(-1px);
  width: 40px;
}
.rolunk-page .facts.facts--features > div > img {
  filter: sepia(1) saturate(7) hue-rotate(335deg) brightness(.98)
    drop-shadow(.45px 0 0 var(--flame))
    drop-shadow(-.45px 0 0 var(--flame));
}
.rolunk-page .facts.facts--features > div > span {
  color: inherit;
  display: block;
  font-size: clamp(1rem, 1.35vw, 1.15rem);
  font-weight: 600;
  grid-column: 2;
  grid-row: 1;
  line-height: 1.15;
  margin: 0;
  min-width: 0;
  padding: 0;
  position: relative;
  z-index: 1;
}
.rolunk-page .facts.facts--features .about-feature-icon {
  color: var(--flame);
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.1;
  z-index: 2;
}
.rolunk-page .facts.facts--features > div > .about-feature-icon {
  transform: translateY(1px);
}
@media(max-width:760px){
  .rolunk-page .facts.facts--features { grid-column: auto; }
}
@media(max-width:500px){
  .rolunk-page .facts.facts--features { grid-template-columns: 1fr; }
}

/* Keep galleries together as one full-width, clickable media frame. */
.post-gallery{background:var(--charcoal);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow);display:grid;gap:10px;grid-template-columns:repeat(var(--gallery-count,4),minmax(110px,1fr));margin:2em 0;max-width:100%;overflow-x:auto;padding:42px 12px 12px;position:relative;scrollbar-color:var(--glow) var(--charcoal)}
.post-gallery::before{color:var(--ivory);content:"Galéria · " attr(data-gallery-count) " kép";font-size:.72rem;font-weight:800;left:13px;letter-spacing:.08em;position:absolute;text-transform:uppercase;top:13px}
.post-gallery figure{background:#fff;border:1px solid rgb(255 255 255 / .25);border-radius:7px;display:flex;flex-direction:column;margin:0;min-width:0;overflow:hidden}
.post-gallery figure .post-image-link{aspect-ratio:1;display:block;overflow:hidden}
.post-gallery figure .post-image-link img{aspect-ratio:auto;display:block;height:100%;object-fit:cover;transition:transform .25s ease;width:100%}
.post-gallery figure .post-image-link:hover img{transform:scale(1.045)}
.post-gallery figcaption{background:#fff;color:var(--muted);font-size:.74rem;line-height:1.35;margin:0;padding:7px 9px;white-space:pre-line}
.post-gallery figcaption:empty{display:none}
@media(max-width:560px){.post-gallery{gap:8px;padding:39px 8px 8px}.post-gallery::before{left:9px}}
.html-editor .post-gallery,.admin-preview .post-gallery{grid-template-columns:repeat(var(--gallery-count,4),minmax(110px,1fr))}.html-editor .post-gallery.media-size-full{max-width:100%;width:100%!important}.html-editor .post-gallery.media-size-full figure .post-image-link{max-width:none;padding:0}.html-editor .post-gallery.media-size-full figure img{max-height:none}
.admin-card__heading-actions--editor{display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr));max-width:620px;width:100%}.admin-card__heading-actions--editor .editor-heading-actions__row{display:contents}.admin-card__heading-actions--editor .button{min-width:0;white-space:nowrap;width:100%}.admin-card__heading-actions--editor>.text-button{grid-column:1/-1;justify-self:start}.admin-card__heading-actions--editor .editor-heading-actions__row--primary .button:first-child,.admin-card__heading-actions--editor .editor-heading-actions__row--secondary .button:first-child{grid-column:1}.admin-card__heading-actions--editor .editor-heading-actions__row--primary .button:last-child,.admin-card__heading-actions--editor .editor-heading-actions__row--secondary .button:last-child{grid-column:2}@media(max-width:800px){.admin-card__heading-actions--editor{max-width:none}}@media(max-width:560px){.admin-card__heading-actions--editor .button{font-size:.76rem;padding-inline:8px;white-space:normal}}

/* Shared photographic header for the Rólunk and blog page heroes. */
.page-hero--photo {
  isolation: isolate;
  overflow: hidden;
  position: relative;
}
.page-hero--photo::after {
  display: none;
}
.page-hero--photo .page-hero__photo {
  height: 100%;
  inset: 0;
  object-fit: fill;
  position: absolute;
  width: 100%;
  z-index: 0;
}
.page-hero--photo > .container {
  position: relative;
  z-index: 2;
}

/* Use the same supplied texture in every site footer. */
.site-footer {
  background-color: var(--charcoal);
  background-image: url("/assets/head.jpg") !important;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* BEGIN MERGED HERO/PAGE CSS */
/*
 * index2 tesztoldal.
 * Csak a hero új elrendezését írja felül; a fő style.css és az oldal többi
 * része változatlanul töltődik be az eredeti index.html-ből.
 */

.index2-page .index2-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: max(690px, calc(100svh - 58px));
  background: #3a2418;
}

.index2-page .index2-hero::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(180deg, rgb(41 23 13 / 0.26) 0%, rgb(47 26 15 / 0.12) 48%, rgb(39 22 13 / 0.54) 100%),
    rgb(61 34 19 / 0.28);
  content: "";
}

.index2-page .index2-hero-background {
  position: absolute;
  z-index: -2;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.index2-page .index2-hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: none;
  grid-template-rows: none;
  align-content: center;
  justify-items: center;
  gap: 18px;
  width: min(1100px, calc(100% - 48px));
  min-height: max(690px, calc(100svh - 58px));
  padding: 38px 0 34px;
}

/* The main stylesheet has named desktop hero areas. The test composition is
   intentionally independent from those source-order areas. */
.index2-page .index2-hero-grid > *,
.index2-page .index2-hero-cards > *,
.index2-page .index2-hero .hero-wordmark {
  grid-area: auto !important;
}

.index2-page .index2-hero-brand,
.index2-page .index2-hero-copy,
.index2-page .index2-hero-badges,
.index2-page .index2-hero-cards,
.index2-page .index2-hero .hero-cta {
  position: relative;
  z-index: 1;
}

.index2-page .index2-hero-brand {
  display: grid;
  justify-items: center;
}

.index2-page .index2-hero .hero-wordmark {
  justify-self: center;
  color: #ffe0a1;
  filter: drop-shadow(0 4px 16px rgb(35 18 8 / 0.26));
  text-align: center;
}

.index2-page .index2-hero .hero-wordmark strong {
  color: #ffe0a1;
}

.index2-page .index2-hero .hero-wordmark span {
  color: #ff9c3c;
}

.index2-page .index2-hero-copy {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  gap: 8px;
  max-width: 850px;
  text-align: center;
}

.index2-page .index2-hero-copy > .hero-intro,
.index2-page .index2-hero-copy > .hero-middle {
  grid-area: auto !important;
}

.index2-page .index2-hero-copy > .hero-intro {
  order: 1 !important;
}

.index2-page .index2-hero-copy > .hero-middle {
  order: 2 !important;
}

.index2-page .index2-hero-copy .hero-middle .hero-slogan {
  grid-area: auto !important;
}

.index2-page .index2-hero-copy .hero-intro {
  max-width: 850px;
  margin: 0;
  color: #ffe0a1;
  font-size: clamp(0.98rem, 1.55vw, 1.24rem);
  line-height: 1.42;
  text-align: center;
  text-shadow: 0 2px 10px rgb(37 18 7 / 0.48);
}

.index2-page .index2-hero-copy .hero-middle {
  display: block;
  margin: 0;
  text-align: center;
}

.index2-page .index2-hero-copy .hero-middle .hero-slogan {
  width: 100%;
  max-width: 800px;
  margin: 0;
  color: #fffdf8;
  font-size: clamp(2.3rem, 4vw, 3.75rem);
  line-height: 0.98;
  text-align: center;
  text-shadow: 0 4px 20px rgb(42 20 8 / 0.52);
}

.index2-page .index2-hero-copy .hero-middle .hero-slogan em {
  color: #ffd487;
  font-family: var(--font-script);
  font-weight: 600;
  font-style: normal;
}

.index2-page .index2-hero-badges {
  display: grid;
  container-type: inline-size;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  width: min(100%, 920px);
}

.index2-page .index2-badge {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 50px;
  padding: 7px 7px;
  border: 1px solid rgb(255 207 117 / 0.88);
  border-radius: 999px;
  background: rgb(60 33 17 / 0.42);
  box-shadow: inset 0 1px 0 rgb(255 238 192 / 0.12), 0 5px 15px rgb(29 14 6 / 0.12);
  color: #ffe1a2;
  font-size: clamp(0.74rem, 1.08vw, 0.92rem);
  line-height: 1.15;
  text-align: center;
  text-shadow: 0 2px 7px rgb(44 21 7 / 0.48);
}

.index2-page .index2-badge > img,
.index2-page .index2-badge > .index2-badge-icon {
  position: absolute;
  top: 50%;
  left: clamp(16px, 6%, 26px);
  flex: 0 0 auto;
  width: 25px;
  height: 25px;
  object-fit: contain;
  transform: translateY(-50%);
}

.index2-page .index2-badge > span {
  box-sizing: border-box;
  display: block;
  width: 100%;
  padding: 0 52px;
  white-space: nowrap;
  text-align: center;
}

.index2-page .index2-badge-break {
  display: none;
}

.index2-page .index2-badge .index2-badge-icon {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.35;
}

.index2-page .index2-hero-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  width: min(100%, 1000px);
}

.index2-page .index2-hero-cards .hero-animation,
.index2-page .index2-hero-cards .hero-product-frame {
  box-sizing: border-box;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  aspect-ratio: 1.9 / 1;
  min-width: 0;
  margin: 0;
  padding: 8px !important;
  overflow: hidden;
  border: 1px solid rgb(255 203 108 / 0.88);
  border-radius: 13px;
  background: rgb(59 32 16 / 0.46);
  box-shadow: inset 0 0 0 1px rgb(255 235 177 / 0.12), 0 9px 20px rgb(27 13 5 / 0.2);
}

.index2-page .index2-hero-cards .hero-animation .stage {
  position: absolute;
  top: 11%;
  left: 50%;
  display: grid;
  place-items: center;
  width: auto;
  height: 78%;
  max-width: 100%;
  margin: 0 0 0 -39%;
  aspect-ratio: 1 / 1;
}

.index2-page .index2-hero-cards .hero-animation .stage svg {
  display: block;
  width: 100%;
  height: 100%;
}

.index2-page .index2-hero-cards .hero-product-frame {
  display: block;
}

.index2-page .index2-hero-cards .hero-product-frame picture {
  display: contents;
}

.index2-page .index2-hero-cards .hero-product-frame img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 8px;
  object-fit: cover;
  object-position: center 57%;
}

.index2-page .index2-hero .hero-cta {
  justify-self: center;
  width: min(300px, 100%);
  min-width: 0;
  min-height: 48px;
  padding: 0 28px;
  border-radius: 999px;
  box-shadow: 0 8px 20px rgb(54 22 5 / 0.22);
  font-size: clamp(0.96rem, 1.45vw, 1.08rem);
}

@media (max-width: 760px) {
  .index2-page .index2-hero-grid {
    gap: 15px;
  }

  .index2-page .index2-hero-badges {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 700px;
  }
}

@media (max-width: 700px) {
  .index2-page .index2-hero {
    min-height: auto;
  }

  .index2-page .index2-hero-background {
    object-position: 54% center;
  }

  .index2-page .index2-hero-cards .hero-product-frame img {
    object-position: center 50%;
  }

  .index2-page .index2-hero-grid {
    align-content: start;
    width: min(100% - 28px, 560px);
    min-height: auto;
    gap: 15px;
    padding: 34px 0 30px;
  }

  .index2-page .index2-hero .hero-wordmark strong {
    font-size: clamp(3.3rem, 15vw, 5rem);
  }

  .index2-page .index2-hero-copy .hero-intro {
    font-size: 0.96rem;
    line-height: 1.4;
  }

  .index2-page .index2-hero-copy .hero-middle .hero-slogan {
    max-width: 100%;
    font-size: clamp(2.25rem, 11vw, 3.5rem);
  }

  .index2-page .index2-hero-badges {
    gap: 9px;
  }

  .index2-page .index2-badge {
    min-height: 49px;
    padding: 7px 9px;
    font-size: 0.78rem;
  }

  .index2-page .index2-badge img {
    width: 25px;
    height: 25px;
  }

  .index2-page .index2-hero-cards {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  /* Mobile reading order: product scene first, animated logo second. */
  .index2-page .index2-hero-cards .hero-product-frame {
    order: 1;
  }

  .index2-page .index2-hero-cards .hero-animation {
    order: 2;
  }

  .index2-page .index2-hero-cards .hero-animation,
  .index2-page .index2-hero-cards .hero-product-frame {
    aspect-ratio: 1.72 / 1;
  }

  .index2-page .index2-hero .hero-cta {
    width: min(100%, 300px);
    min-width: 0;
    padding: 0 24px;
  }
}

@media (max-width: 380px) {
  .index2-page .index2-hero-grid {
    grid-template-columns: minmax(0, 0.34fr) minmax(0, 0.66fr);
  }
}

@media (max-width: 420px) {
  .index2-page .index2-hero-badges {
    grid-template-columns: 1fr;
    width: min(100%, 320px);
  }

  .index2-page .index2-badge {
    justify-content: center;
    padding-left: 9px;
    padding-right: 9px;
  }
}

/* Editorial desktop composition: a 70/30 split keeps the copy and product
   scene generous while the animated candle occupies a focused side column. */
@media (min-width: 761px) {
  .index2-page .index2-hero-grid {
    grid-template-columns: minmax(0, 7fr) minmax(250px, 3fr);
    grid-template-rows: auto auto auto auto;
    grid-template-areas:
      "brand badges"
      "copy badges"
      "photo animation"
      "cta cta";
    align-items: stretch;
    gap: 18px;
    width: min(1100px, calc(100% - 48px));
  }

  .index2-page .index2-hero-brand {
    grid-area: brand !important;
    align-self: end;
  }

  .index2-page .index2-hero-copy {
    grid-area: copy !important;
    align-self: start;
    width: 100%;
    max-width: none;
  }

  .index2-page .index2-hero-badges {
    grid-area: badges !important;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(4, minmax(0, 1fr));
    align-self: stretch;
    height: 100%;
    width: 100%;
    max-width: none;
    gap: 8px;
  }

  .index2-page .index2-hero-badges .index2-badge {
    min-width: 0;
    min-height: 0;
    padding: 8px 14px;
    gap: 11px;
    overflow: hidden;
    font-size: clamp(0.88rem, 1.12vw, 1rem);
  }

  .index2-page .index2-hero-badges .index2-badge > img,
  .index2-page .index2-hero-badges .index2-badge > .index2-badge-icon {
    width: 34px;
    height: 34px;
  }

  .index2-page .index2-hero-badges .index2-badge .index2-badge-icon {
    width: 34px;
    height: 34px;
  }

  .index2-page .index2-hero-cards {
    display: contents;
  }

  .index2-page .index2-hero-grid > .index2-hero-cards > .hero-animation {
    grid-area: animation !important;
    align-self: stretch;
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: auto;
  }

  .index2-page .index2-hero-grid > .index2-hero-cards > .hero-product-frame {
    grid-area: photo !important;
    align-self: start;
    width: 100% !important;
    aspect-ratio: 2.2 / 1;
  }

  .index2-page .index2-hero-grid > .hero-cta {
    grid-area: cta !important;
  }

  /* The tall side frame uses its width as the safe square for the logo. */
  .index2-page .index2-hero-grid .hero-animation .stage {
    top: 50%;
    left: 50%;
    width: 88%;
    height: auto;
    max-width: 88%;
    max-height: 88%;
    margin: -44% 0 0 -44%;
  }
}

/* Final logo guard: the animated stage follows the frame, while the SVG is
   centered as a contained drawing inside it. The inner breathing room keeps
   the floating animation safely away from every frame edge. */
.index2-page .index2-hero-cards .hero-animation .stage {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  aspect-ratio: auto;
}

.index2-page .index2-hero-cards .hero-animation .stage > svg {
  align-self: center;
  justify-self: center;
  width: 88% !important;
  height: 88% !important;
}

@media (max-width: 760px) {
  .index2-page .index2-hero-cards .hero-animation .stage > svg {
    width: 82% !important;
    height: 82% !important;
  }
}

/*
 * Single-column hero composition.
 * The content now reads from top to bottom: identity, message, product scene,
 * animated candle, benefits, then the purchase action.  Keeping the scene in
 * its own full-width row also gives the cat enough vertical room at every
 * desktop width.
 */
.index2-page .index2-hero-grid {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto;
  grid-template-areas:
    "brand"
    "copy"
    "photo"
    "animation"
    "badges"
    "cta";
  align-content: start;
  gap: clamp(15px, 2vw, 22px);
  width: min(1120px, calc(100% - 48px));
  padding: clamp(34px, 5vw, 52px) 0 42px;
}

.index2-page .index2-hero-grid > .index2-hero-brand {
  grid-area: brand !important;
  align-self: end;
  width: 100%;
}

.index2-page .index2-hero-grid > .index2-hero-copy {
  grid-area: copy !important;
  align-self: start;
  width: min(100%, 900px);
}

.index2-page .index2-hero-grid > .index2-hero-badges {
  grid-area: badges !important;
  width: 100%;
}

.index2-page .index2-hero-grid > .index2-hero-cards {
  display: contents;
}

.index2-page .index2-hero-grid > .index2-hero-cards > .hero-product-frame {
  grid-area: photo !important;
  width: 100% !important;
  aspect-ratio: 2 / 1;
}

.index2-page .index2-hero-grid > .index2-hero-cards > .hero-animation {
  grid-area: animation !important;
  width: 100% !important;
  aspect-ratio: 1.75 / 1;
}

.index2-page .index2-hero-grid > .hero-cta {
  grid-area: cta !important;
  justify-self: center;
  width: min(290px, calc(100% - 24px));
  min-height: 50px;
  padding: 0 20px;
  font-size: 1rem;
}

.index2-page .index2-hero-grid > .index2-hero-cards > .hero-product-frame img {
  object-position: center 55%;
}

/* On wider screens the lower section becomes a calm two-column finale:
   animated logo on the left, benefits and the purchase button on the right. */
@media (min-width: 701px) {
  .index2-page .index2-hero-grid {
    grid-template-columns: minmax(0, 1.55fr) minmax(300px, 0.9fr);
    grid-template-rows: auto auto auto minmax(220px, auto) 56px;
    grid-template-areas:
      "brand brand"
      "copy copy"
      "photo photo"
      "animation badges"
      "animation cta";
    column-gap: clamp(18px, 2.4vw, 28px);
    row-gap: clamp(15px, 2vw, 22px);
  }

  .index2-page .index2-hero-grid > .index2-hero-badges {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(4, minmax(0, 1fr));
    align-self: stretch;
    height: 100%;
    gap: 8px;
  }

  .index2-page .index2-hero-grid > .index2-hero-badges .index2-badge {
    min-height: 0;
    padding: 8px 12px;
    gap: 10px;
    font-size: clamp(0.82rem, 1.05vw, 0.98rem);
  }

  .index2-page .index2-hero-grid > .index2-hero-badges .index2-badge > img,
  .index2-page .index2-hero-grid > .index2-hero-badges .index2-badge > .index2-badge-icon {
    width: 32px;
    height: 32px;
  }

  .index2-page .index2-hero-grid > .index2-hero-badges .index2-badge .index2-badge-icon {
    width: 32px;
    height: 32px;
  }

  .index2-page .index2-hero-grid > .index2-hero-cards > .hero-animation {
    height: 100% !important;
    aspect-ratio: auto;
  }

  .index2-page .index2-hero-grid > .hero-cta {
    align-self: stretch;
    width: 100%;
    max-width: none;
  }
}

@media (max-width: 700px) {
  .index2-page .index2-hero-grid {
    grid-template-columns: minmax(0, 0.42fr) minmax(0, 0.58fr);
    grid-template-rows: auto auto auto minmax(220px, auto) 56px;
    grid-template-areas:
      "brand brand"
      "copy copy"
      "photo photo"
      "animation badges"
      "animation cta";
    column-gap: clamp(8px, 2vw, 14px);
    row-gap: clamp(8px, 2vw, 14px);
    width: min(100% - 28px, 560px);
    padding: 34px 0 30px;
  }

  .index2-page .index2-hero-grid > .index2-hero-cards > .hero-product-frame {
    aspect-ratio: 1.65 / 1;
  }

  .index2-page .index2-hero-grid > .index2-hero-cards > .hero-animation {
    height: 100% !important;
    aspect-ratio: auto;
  }

  .index2-page .index2-hero-grid > .index2-hero-cards > .hero-product-frame img {
    object-position: center 50%;
  }

  .index2-page .index2-hero-grid > .index2-hero-badges {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(4, minmax(0, 1fr));
    align-self: stretch;
    height: 100%;
    width: 100%;
    gap: 9px;
  }

  .index2-page .index2-hero-grid > .index2-hero-badges .index2-badge {
    min-height: 0;
    padding: 8px 8px;
    gap: 0;
    font-size: clamp(0.7rem, 2.2vw, 0.88rem);
  }

  .index2-page .index2-hero-grid > .index2-hero-badges .index2-badge > img,
  .index2-page .index2-hero-grid > .index2-hero-badges .index2-badge > .index2-badge-icon {
    width: 30px;
    height: 30px;
  }

  .index2-page .index2-hero-grid > .hero-cta {
    width: 100%;
    max-width: none;
  }

  .index2-page .index2-badge > span {
    padding-right: 40px;
    padding-left: 40px;
  }
}

@container (max-width: 275px) {
  .index2-page .index2-badge > span {
    white-space: normal;
    padding-right: 30px;
    padding-left: 30px;
  }

  .index2-page .index2-badge-break {
    display: inline;
  }
}

@media (max-width: 340px) {
  .index2-page .index2-badge > span {
    padding-right: 32px;
    padding-left: 32px;
  }
}

/* At the narrowest phone widths every feature switches together to two lines. */
@media (max-width: 300px) {
  .index2-page .index2-hero-grid {
    grid-template-columns: minmax(0, 0.3fr) minmax(0, 0.7fr);
  }

  .index2-page .index2-badge > span {
    white-space: normal;
  }

  .index2-page .index2-badge-break {
    display: inline;
  }
}

@container (max-width: 190px) {
  .index2-page .index2-hero-badges .index2-badge {
    font-size: 0.68rem;
  }

  .index2-page .index2-badge > span {
    padding-right: 22px;
    padding-left: 22px;
  }
}


/* Keep the slogan visually subordinate to the CicaLáng–Műhely wordmark.
   The same responsive lock width is applied to both elements, so the slogan
   cannot become wider than the brand at any tested viewport. */
.index2-page .index2-hero .hero-wordmark {
  width: max-content;
  max-width: 100%;
}

.index2-page .index2-hero-copy .hero-middle .hero-slogan {
  width: max-content !important;
  max-width: 100% !important;
  margin-inline: auto !important;
  font-size: clamp(1.6rem, 2.6vw, 2.1rem);
  line-height: 1.02;
  white-space: nowrap;
}

.index2-page .index2-hero-brand {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  text-align: center;
}

.index2-page .index2-hero .hero-wordmark {
  justify-self: center;
  margin-inline: auto;
  text-align: center;
}

/* Keep the approved large brand size across all desktop widths. The original
   stylesheet reduced it around tablet-sized widths, which made the wordmark
   appear to shrink when the viewport became wider or narrower. */
@media (min-width: 701px) {
  .index2-page .index2-hero .hero-wordmark strong {
    font-size: 74px;
  }
}

.index2-page .index2-hero .hero-wordmark > strong,
.index2-page .index2-hero .hero-wordmark > span {
  justify-self: center;
  max-width: 100%;
  text-align: center;
}

.index2-page .index2-hero .hero-wordmark > strong {
  width: auto;
}

.index2-page .index2-hero .hero-wordmark > span {
  width: 92%;
}

/* Keep the purchase action centered even in Android in-app WebViews, where
   grid-item auto margins can otherwise be resolved differently. */
.index2-page .index2-hero .hero-cta {
  display: flex !important;
  align-items: center;
  justify-self: center !important;
  margin-inline: auto !important;
  text-align: center;
  text-indent: 0;
}

/* The heart is an inline SVG, so tune its stroke independently from the
   raster feature icons to keep the visual weight consistent. */
.index2-page .index2-badge > .index2-badge-icon {
  stroke-width: 0.8;
}

@media (max-width: 380px) {
  .index2-page .index2-hero .hero-cta {
    padding-inline: 8px;
    font-size: 0.8rem;
    white-space: nowrap;
  }
}

/* Keep badge labels centered in the usable area after the icon.  The icon
   owns the first grid column; the label is centered only in the remaining
   space, so it can never visually collide with the icon. */
.index2-page .index2-badge {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  align-items: center;
  justify-content: initial;
  gap: 0;
}

.index2-page .index2-badge > img,
.index2-page .index2-badge > .index2-badge-icon {
  position: static;
  grid-column: 1;
  grid-row: 1;
  justify-self: start;
  margin: 0 0 0 10px;
  transform: none;
}

.index2-page .index2-badge > span {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  padding: 0;
  text-align: center;
  width: auto;
}

/* Match the reserved icon column to the rendered icon plus its left inset.
   This makes the label's usable area start exactly at the icon's right edge. */
.index2-page .index2-hero-grid > .index2-hero-badges .index2-badge {
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 10px;
}

@media (max-width: 700px) {
  .index2-page .index2-hero-grid > .index2-hero-badges .index2-badge {
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 10px;
  }
}

/* 260px is the narrowest stable composition: below it the usable label
   column becomes too small. Keep the approved layout width and let the page
   scroll horizontally instead of shrinking the Hero into a broken stack. */
.index2-page {
  min-width: 260px;
}

/* Compact product facts: price first, then a small three-column data strip.
   The size is ordered as width × height × depth, matching the requested
   display order rather than the height-first order used on the marketplace. */
.index2-page .product-body > .product-price {
  font-size: 1.28rem;
  margin-top: 2px;
}

.index2-page .product-body > .index2-selector-label {
  order: 2;
  margin: 3px 0 -7px;
  color: var(--muted);
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.1;
  text-transform: uppercase;
}

.index2-page .product-body > .index2-selector-label--specs {
  order: 3;
  margin-top: 8px;
  margin-bottom: -4px;
}

.index2-page .product-body > h2 + .product-tagline {
  margin-top: -11px;
}

.index2-page .product-body > .swatches,
.index2-page .product-body > .scent-tags {
  flex-wrap: wrap;
}

.index2-page .index2-product-specs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin: 0 0 6px;
  order: 3;
  width: 100%;
}

.index2-page .product-body > .product-meska {
  order: 4;
  margin-top: 6px;
  margin-bottom: 6px;
}

.index2-page .product-body > .product-description {
  order: 5;
}

.index2-page .product-body > .product-order-note {
  display: none;
}

.index2-page .index2-product-specs > div {
  min-width: 0;
  padding: 7px 4px 6px;
  border: 1px solid var(--dim);
  border-radius: 8px;
  background: rgb(252 246 236 / 0.72);
  text-align: center;
}

.index2-page .index2-product-specs dt {
  color: var(--muted);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1.1;
  text-transform: uppercase;
}

.index2-page .index2-product-specs dd {
  margin: 4px 0 0;
  color: var(--charcoal);
  font-size: clamp(0.68rem, 1.1vw, 0.8rem);
  font-weight: 700;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

@media (max-width: 500px) {
  .index2-page .index2-product-specs {
    gap: 5px;
  }

  .index2-page .index2-product-specs > div {
    padding-inline: 3px;
  }

  .index2-page .index2-product-specs dt {
    font-size: 0.58rem;
  }

  .index2-page .index2-product-specs dd {
    font-size: 0.68rem;
  }

  .index2-page .product-body > .product-price {
    font-size: 1.21rem;
  }

  .index2-page .product-body > .index2-selector-label {
    margin-bottom: -6px;
    font-size: 0.6rem;
  }

  .index2-page .product-body > .index2-selector-label--specs {
    margin-top: 7px;
  }
}
/* END MERGED INDEX2 CSS */

/* Card hover: keep this independent of pointer media detection. */
.product-card:hover {
  background-color: #fff8ed;
}
.product-card:hover .product-body {
  background: #fff8ed !important;
}

/* Touch devices must not receive the desktop card hover/press treatment.
   The class is set from the actual pointer event, not from CSS media
   detection, because some desktop Chrome surfaces report hover:none. */
html.has-touch-pointer .product-card:hover {
  background-color: #fff;
  box-shadow: var(--shadow);
  transform: none;
}
html.has-touch-pointer .product-card:hover .product-image img {
  filter: none;
  transform: none;
}
html.has-touch-pointer .product-card:hover .product-body {
  background: #fff !important;
}
html.has-touch-pointer .product-card:hover .product-body::after {
  opacity: 0;
}

/* Keep every CTA, including the Meska buttons, on the same smooth hover
   timing. */
.button {
  transition-duration: .3s;
}

/* Reveal items have their own opacity/entrance transition.  Keep the hover
   transition on buttons explicit so it also covers background and border
   colour changes on the Hero and product CTAs. */
.home-page.index2-page .button,
.rolunk-page .button,
.workshop-page .button,
.legal-page .button {
  transition: background-color .3s var(--ease), border-color .3s var(--ease),
    box-shadow .3s var(--ease), color .3s var(--ease), transform .3s var(--ease);
}

/* The FAQ items are reveal items too, so give their hover properties the same
   explicit three-tenths-of-a-second timing. */
.home-page.index2-page .faq-item {
  transition: background-color .3s var(--ease), border-color .3s var(--ease),
    box-shadow .3s var(--ease), transform .3s var(--ease);
}

/* Desktop hover polish for FAQ and feature cards.  The hover state is kept
   independent from CSS hover media queries because some desktop Chrome
   surfaces report hover:none while still sending mouse pointer events. */
@keyframes index2-feature-icon-hover-spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes about-feature-image-hover-spin {
  from { transform: translateY(-1px) rotate(0deg); }
  to { transform: translateY(-1px) rotate(360deg); }
}

@keyframes about-feature-svg-hover-spin {
  from { transform: translateY(1px) rotate(0deg); }
  to { transform: translateY(1px) rotate(360deg); }
}

/* A slightly stronger, calm hover makes the FAQ item easy to identify. */
.faq-item {
  transition: background-color .3s var(--ease), border-color .3s var(--ease),
    box-shadow .3s var(--ease), transform .3s var(--ease);
}

.faq-item:hover {
  background: #f3f3f3;
  border-color: var(--glow);
  box-shadow: 0 13px 30px rgb(58 44 31 / .16);
  transform: translateY(-2px);
}

/* Hero feature badges: lighten the frame and pictogram, then turn the icon
   exactly once for each desktop hover entry. */
.index2-page .index2-badge {
  transition: background-color .28s var(--ease), border-color .28s var(--ease),
    box-shadow .28s var(--ease), color .28s var(--ease);
}

.index2-page .index2-badge:hover {
  background: rgb(78 46 24 / .56);
  border-color: #ffe0a0;
  box-shadow: inset 0 1px 0 rgb(255 238 192 / .28), 0 8px 21px rgb(29 14 6 / .2);
  color: #fff0c2;
}

.index2-page .index2-badge:hover > img,
.index2-page .index2-badge:hover > .index2-badge-icon {
  animation: index2-feature-icon-hover-spin .42s cubic-bezier(.22,.8,.32,1) 1;
}

.index2-page .index2-badge:hover > img {
  filter: brightness(1.18) saturate(1.08);
}

.index2-page .index2-badge:hover > .index2-badge-icon {
  color: #fff0c2;
}

/* About-page features use the same interaction, with a warmer, darker
   orange-gold highlight and no gray wash over the white surface. */
.rolunk-page .facts.facts--features > div {
  transition: background-color .28s var(--ease), border-color .28s var(--ease),
    box-shadow .28s var(--ease);
}

.rolunk-page .facts.facts--features > div:hover {
  background: #fff;
  border-color: #f2ad4a;
  box-shadow: 0 10px 24px rgb(58 44 31 / .15);
}

.rolunk-page .facts.facts--features > div:hover > img {
  animation: about-feature-image-hover-spin .42s cubic-bezier(.22,.8,.32,1) 1;
  filter: sepia(1) saturate(7) hue-rotate(335deg) brightness(1.1)
    drop-shadow(.55px 0 0 #f2ad4a)
    drop-shadow(-.55px 0 0 #f2ad4a);
}

.rolunk-page .facts.facts--features > div:hover > .about-feature-icon {
  animation: about-feature-svg-hover-spin .42s cubic-bezier(.22,.8,.32,1) 1;
  color: #f2ad4a;
}

/* A real touch/pen pointer cancels all desktop-only hover styling. */
html.has-touch-pointer .faq-item:hover {
  background: #fff;
  border-color: var(--border);
  box-shadow: var(--shadow);
  transform: none;
}

html.has-touch-pointer .index2-page .index2-badge:hover {
  background: rgb(60 33 17 / .42);
  border-color: rgb(255 207 117 / .88);
  box-shadow: inset 0 1px 0 rgb(255 238 192 / .12), 0 5px 15px rgb(29 14 6 / .12);
  color: #ffe1a2;
}

html.has-touch-pointer .index2-page .index2-badge:hover > img {
  animation: none;
  filter: none;
}

html.has-touch-pointer .index2-page .index2-badge:hover > .index2-badge-icon {
  animation: none;
  color: inherit;
}

html.has-touch-pointer .rolunk-page .facts.facts--features > div:hover {
  background: #fff;
  border-color: var(--flame);
  box-shadow: 0 5px 15px rgb(58 44 31 / .10);
}

html.has-touch-pointer .rolunk-page .facts.facts--features > div:hover > img {
  animation: none;
  filter: sepia(1) saturate(7) hue-rotate(335deg) brightness(.98)
    drop-shadow(.45px 0 0 var(--flame))
    drop-shadow(-.45px 0 0 var(--flame));
}

html.has-touch-pointer .rolunk-page .facts.facts--features > div:hover > .about-feature-icon {
  animation: none;
  color: var(--flame);
}

@media (prefers-reduced-motion: reduce) {
  .faq-item:hover,
  .index2-page .index2-badge:hover,
  .rolunk-page .facts.facts--features > div:hover {
    transform: none;
  }

  .index2-page .index2-badge:hover > img,
  .index2-page .index2-badge:hover > .index2-badge-icon,
  .rolunk-page .facts.facts--features > div:hover > img,
  .rolunk-page .facts.facts--features > div:hover > .about-feature-icon {
    animation: none;
  }
}

/* Blog lightbox: SVG chevrons sit optically centred in the round nav buttons,
   and the article cover opens in the same lightbox as inline images. */
.image-lightbox-nav{font-size:0;padding:0}
.image-lightbox-nav svg{display:block;flex:none}
.image-lightbox-nav--previous svg{margin-left:-2px}
.image-lightbox-nav--next svg{margin-right:-2px}
@media(max-width:560px){.image-lightbox-nav svg{height:22px;width:22px}}
.post-detail>.container>img.post-cover--article{cursor:zoom-in}
.post-detail>.container>img.post-cover--article:focus-visible{outline:3px solid var(--flame);outline-offset:3px}
/* Product lightbox: the colour picker sits at the bottom, so the counter moves to the top. */
.image-lightbox-count--top{bottom:auto;top:30px}
@media(max-width:560px){.image-lightbox-count--top{bottom:auto;top:34px}}