/* laava-tokens */
/* LAAVA design tokenek – az egyetlen hely, ahol szín/méret/betű változik. */
@font-face{font-family:"DM Sans";font-style:normal;font-weight:100 1000;font-display:swap;src:url(https://laava.hu/wp-content/themes/laava/assets/css/../fonts/dm-sans-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:100 1000;font-display:swap;src:url(https://laava.hu/wp-content/themes/laava/assets/css/../fonts/dm-sans-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500;font-display:swap;src:url(https://laava.hu/wp-content/themes/laava/assets/css/../fonts/cormorant-garamond-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500;font-display:swap;src:url(https://laava.hu/wp-content/themes/laava/assets/css/../fonts/cormorant-garamond-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:600;font-display:swap;src:url(https://laava.hu/wp-content/themes/laava/assets/css/../fonts/cormorant-garamond-latin-ext-600-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:600;font-display:swap;src:url(https://laava.hu/wp-content/themes/laava/assets/css/../fonts/cormorant-garamond-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
	/* Új LAAVA design (B-023) – nyers paletta. A többi token ezekre hivatkozik, így egy helyen állítható. */
	--laava-graphite:#24211F;      /* elsődleges gomb, szöveg */
	--laava-mocha:#5C3D2E;         /* menü, aktív chip, folyamatjelző, kiemelés */
	--laava-mocha-hover:#8A6552;
	--laava-campaign:#7801f2;      /* jelvény, kampánysáv, az elsődleges (lila) gomb és a fókusz-gyűrű (Gombok board, B-093) */
	--laava-star:#DDAB2A;
	--laava-red:#D93A3A;
	--laava-red-soft-bg:#FBEDEC;
	--laava-red-soft-fg:#B3261E;
	--laava-green:#09883A; /* design-decisions 4.: erős zöld, fehéren 4,57:1 */
	--color-success:#09883A;
	--color-success-bg:#E3F4E9;
	--laava-green-soft-bg:#E3F4E9;
	--laava-beige:#F6F1EB;
	--laava-beige-2:#F3EEE8;
	--laava-line:#E6D9CC;
	--laava-text-2:#5A534D;        /* másodlagos szöveg (AA a fehéren) */
	--laava-gray:#6B635C;
	--laava-white:#fff;
	--laava-black:#000;
	--laava-cart-w:440px;          /* minikosár-fiók szélessége */
	--laava-radius-base:0;         /* gomb, kép, kártya, doboz: szögletes (B-120, 2026-11-07) */
	--laava-radius-lg:0;           /* nagy konténer: szögletes (B-120) */
	--laava-shadow:none;           /* a design nem használ árnyékot; a bővítmények (Tudástár) ezt öröklik */

	/* Márka */
	--laava-primary:var(--laava-mocha);
	--laava-primary-contrast:#fff;
	--laava-secondary:#dbcbf0;
	--laava-campaign-bg:var(--laava-campaign);
	--laava-campaign-fg:#fff;
	/* A core CSS (karusszel nyilak) ezeken a neveken olvassa a kampánysáv színeit. */
	--laava-campaign-text-color:var(--laava-campaign-fg);
	--laava-campaign-background:var(--laava-campaign-bg);

	/* Szöveg */
	--laava-text:var(--laava-graphite);
	--laava-heading:var(--laava-graphite);
	--laava-btn-bg:var(--laava-graphite);
	--laava-btn-fg:var(--laava-white);
	--laava-btn-hover:var(--laava-black);
	--laava-muted:var(--laava-gray);
	--laava-muted-2:#97918a;
	--laava-link-hover:#866b72;

	/* Termékkártya tipográfia (az élő Ecomus „További CSS” értékei) */
	--laava-card-cat-size:12px;
	--laava-card-title-size:16px;
	--laava-card-title-size-mobile:15px;
	--laava-card-title-weight:600;
	--laava-card-price-size:16px;
	--laava-card-price-size-mobile:15px;
	--laava-card-price-weight:600;
	--laava-card-del-size:14px;
	--laava-card-del-size-mobile:13px;
	--laava-rating-color:var(--laava-star);

	/* Díszcsomagolás (Product Add-Ons) kártyák */
	/* B-023: a design szerint a lila csak kampány/jelvény; a kártyák bézs/mokka tokenekre épülnek. */
	--laava-addon-bg:var(--laava-beige);
	--laava-addon-bg-hover:var(--laava-beige-2);
	--laava-addon-bg-selected:#EADFD3;
	--laava-addon-border:var(--laava-line);
	--laava-addon-border-hover:#D8C4B2;
	--laava-addon-accent:var(--laava-mocha);
	--laava-addon-text:var(--laava-graphite);

	/* Árak, jelvények */
	--laava-sale:var(--laava-red-soft-fg);
	--laava-badge-sale:var(--laava-red);
	--laava-badge-new:var(--laava-green);

	/* Header (ELLENŐRIZNI az élő oldallal: asztali sötét, mobil fehér) */
	--laava-header-bg:#090909;
	--laava-header-fg:#fff;
	--laava-header-bg-mobile:#fff;
	--laava-header-fg-mobile:#090909;

	/* Felületek (becsült, a styleguide-nál finomítjuk) */
	--laava-bg:#fff;
	--laava-surface:var(--laava-beige);
	--laava-border:var(--laava-line);

	/* Betűk */
	--laava-font-body:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
	--laava-font-heading:var(--laava-font-body);
	--laava-font-display:"Cormorant Garamond",Georgia,serif;
	--laava-fs-body:1rem;
	--laava-lh-body:1.5;
	--laava-fs-h1:2.625rem;--laava-fs-h2:2rem;--laava-fs-h3:1.5rem;
	--laava-fs-h4:1.1875rem;--laava-fs-h5:1.125rem;--laava-fs-h6:1.0625rem;
	--laava-fs-product-title:1.75rem;

	/* Formák */
	--laava-radius-btn:var(--laava-radius-base);
	--laava-radius-img:var(--laava-radius-base);
	--laava-radius-field:2px;      /* beviteli mezők: 2 px, hogy érinthetőnek látsszanak (B-120) */
	/* Az Ecomusból átvett core modulok (szállítási sáv, méretajánló, szűrő) ezeket a neveket várják. */
	--laava-rounded-x:var(--laava-radius-btn);
	--laava-border__radius:var(--laava-radius-lg);

	/* Elrendezés */
	--laava-container:1290px;
	--laava-gutter:20px;
	--laava-logo-h:44px;
	--laava-logo-h-mobile:34px;
	--laava-header-h:72px;

	/* Térköz-skála */
	--laava-space-1:4px;--laava-space-2:8px;--laava-space-3:12px;--laava-space-4:16px;
	--laava-space-5:24px;--laava-space-6:32px;--laava-space-7:48px;--laava-space-8:72px;

	/* Réteg */
	--laava-z-header:50;--laava-z-drawer:80;--laava-z-bottombar:60;--laava-z-backdrop:70;

	/* Gombok (B-093) – a vászon „Gombok” boardja (docs/buttons-spec.md). Minden gomb ezekből dolgozik: a téma
	   (.lv-btn / .lv-hbtn / Woo .button), a Core és a Promo (a `laava-core-tokens` álnéven át, var(--lv-btn-*, tartalék)). */
	--lv-btn-h:44px;               /* alap gomb */
	--lv-btn-h-sm:36px;            /* kicsi gomb (mobilon 40) */
	--lv-btn-h-cta:56px;           /* CTA: Kosárba, Tovább a pénztárhoz, Megrendelés – oldalanként egy */
	--lv-btn-h-chip:38px;          /* szűrő-/címke-chip (mobilon 40) */
	--lv-btn-px:22px;--lv-btn-px-sm:14px;--lv-btn-px-cta:32px;--lv-btn-px-chip:16px;
	--lv-btn-gap:8px;
	--lv-btn-radius:var(--laava-radius-btn);
	--lv-btn-font:var(--laava-font-body);
	--lv-btn-fs:15px;--lv-btn-fs-sm:13.5px;--lv-btn-fs-cta:16px;--lv-btn-fs-chip:14px;
	--lv-btn-fw:500;--lv-btn-fw-cta:600;--lv-btn-fw-chip:400;
	--lv-btn-lh:1.2;
	--lv-btn-dark-bg:var(--laava-graphite);--lv-btn-dark-fg:#fff;--lv-btn-dark-hover:var(--laava-black);
	--lv-btn-primary-bg:var(--laava-campaign);--lv-btn-primary-fg:#fff;--lv-btn-primary-hover:brightness(.9); /* filter */
	--lv-btn-outline-fg:var(--laava-graphite);--lv-btn-outline-bd:var(--laava-graphite);
	--lv-btn-light-bg:#fff;--lv-btn-light-fg:var(--laava-graphite);
	--lv-btn-ghost-hover:rgba(255,255,255,.14);
	--lv-btn-chip-bd:var(--laava-line);--lv-btn-chip-hover-bg:#F8F2EB;--lv-btn-chip-hover-bd:#D8C4B2;
	--lv-btn-chip-on:var(--laava-mocha);--lv-btn-chip-on-hover:var(--laava-mocha-hover);
	--lv-btn-chip-soft:var(--laava-beige-2);--lv-btn-chip-soft-hover:#EADFD3;
	--lv-btn-icon:44px;            /* ikon-gomb (kör: kártya-kedvenc, vissza a tetejére; négyzet: termékoldali kedvenc) */
	--lv-btn-icon-bd:var(--laava-line);
	--lv-btn-focus:var(--laava-campaign); /* a vászon fókusz-gyűrűje lila: 2 px, 2 px eltolással */
	--lv-btn-focus-w:2px;--lv-btn-focus-offset:2px;
	--lv-btn-disabled-opacity:.45;
	--lv-btn-spin:18px;            /* töltő jelző (motion.css) */
}
@media (max-width:767px){
	:root{--laava-fs-h1:2rem;--laava-fs-h2:1.625rem;--laava-fs-h3:1.375rem;--laava-fs-product-title:1.5rem}
}
@media (max-width:600px){
	:root{--lv-btn-h-sm:40px;--lv-btn-h-chip:40px} /* vászon: kisebb vezérlők érintésre 40 px */
}

/* Mozgás-rendszer (vászon „MOTION v1”, docs/motion-spec.md): egy helyen a témában; a komponensek ezeket a tokeneket és
   kulcskockákat használják. Csökkentett mozgásnál a tokenek gyakorlatilag azonnaliak, az állapot ugyanúgy látszik. */
:root{--ease:cubic-bezier(.2,.7,.2,1);--dur:240ms;--dur-s:160ms}
@keyframes mo-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes mo-fade{from{opacity:0}to{opacity:1}}
@keyframes mo-pop{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}
@keyframes mo-sel{from{transform:scale(.985)}to{transform:none}}
@keyframes mo-slide-r{from{transform:translateX(100%)}to{transform:none}}
@media (prefers-reduced-motion:reduce){:root{--dur:.01ms;--dur-s:.01ms}}

/* laava-base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
/* Nincs vízszintes görgetés (főleg mobilon, Gábor 2026-11-04): a clip nem hoz létre görgető dobozt, így a sticky fejléc működik. */
html,body{max-width:100%;overflow-x:clip}
body{margin:0;background:var(--laava-bg);color:var(--laava-text);font:400 var(--laava-fs-body)/var(--laava-lh-body) var(--laava-font-body);-webkit-font-smoothing:antialiased}
img,svg,video{max-width:100%;height:auto}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:2px}
a:hover{color:var(--laava-link-hover)}
h1,h2,h3,h4,h5,h6{margin:0 0 .5em;line-height:1.2;font-weight:400;color:var(--laava-heading);font-family:var(--laava-font-heading)}
h1{font-size:var(--laava-fs-h1)}h2{font-size:var(--laava-fs-h2)}h3{font-size:var(--laava-fs-h3)}
p{margin:0 0 1em}
:focus-visible{outline:2px solid var(--laava-primary);outline-offset:2px}
[hidden]{display:none!important}
.lv-wrap{width:100%;max-width:var(--laava-container);margin-inline:auto;padding-inline:var(--laava-gutter)}
.lv-skip{position:absolute;left:-9999px;top:0;background:#fff;color:#000;padding:8px 12px;z-index:100}
.lv-skip:focus{left:8px;top:8px}
.lv-main{min-height:50vh}
.lv-content{padding-block:var(--laava-space-7)}
.lv-entry{margin-bottom:var(--laava-space-6)}
input[type=search],input[type=text],input[type=email]{width:100%;border:1px solid var(--laava-border);border-radius:var(--laava-radius-field);padding:12px 18px;font:inherit}
.lv-icon{display:block}
.lv-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--laava-primary);color:#fff;font-size:11px;font-weight:600;line-height:1}
.lv-count[data-count="0"],.lv-wishlist-count:empty{display:none}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Csak képernyőolvasónak szóló szöveg (H1 az oldalakon, ahol a cím más elemből jön). */
.lv-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* B-060 kristálykosár: a három tartalom-réteg közül a html[data-lv-cart] (assets/js/cart.js) választ; alapból üres kosár. */
.lv-ci{display:none}
html[data-lv-cart="bracelet"] .lv-ci--bracelet,html[data-lv-cart="crystal"] .lv-ci--crystal,html[data-lv-cart="both"] .lv-ci--both{display:inline}
/* B-081 (docs/cart-icon-motion-spec.md, vászon „LVD v1” blokk): állapotváltáskor csak a tartalom-réteg mozog, a kosárforma
   (a <g>-n kívüli path-ok) sosem. Az osztályokat a cart.js teszi ki, és csak változáskor – oldalbetöltéskor nem.
   Az SVG viewBox-a levágja a felső részt, ezért a beeső tárgy a kosár tetejéről érkezik. A --out réteg a halványulás
   idejére látható marad, bár a data-lv-cart már az új állapoté. Csökkentett mozgásnál a fenti globális szabály is tilt. */
@keyframes lvCiIn{0%{opacity:0;transform:translateY(-9px)}55%{opacity:1;transform:translateY(1.2px)}80%{transform:translateY(0)}100%{opacity:1;transform:none}}
@keyframes lvCiOut{from{opacity:1;transform:none}to{opacity:0;transform:translateY(1px)}}
@keyframes lvCiSettle{0%,100%{transform:none}40%{transform:translateY(1px)}}
.lv-ci{transform-box:view-box;transform-origin:12px 10.5px}
html.lv-cart-anim .lv-ci--in{animation:lvCiIn 520ms cubic-bezier(.2,.7,.2,1) both}
html.lv-cart-anim .lv-ci--out{display:inline;animation:lvCiOut 180ms ease-out both}
html.lv-cart-anim .lv-ci--settle{animation:lvCiSettle 260ms ease-out}
@media (prefers-reduced-motion:reduce){html.lv-cart-anim .lv-ci{animation:none}html.lv-cart-anim .lv-ci--out{display:none}}

