.elementor-kit-8{--e-global-color-primary:#A80061;--e-global-color-secondary:#2E1A47;--e-global-color-text:#14101A;--e-global-color-accent:#CC9B38;--e-global-color-lkplum:#6B1A54;--e-global-color-lkgoldd:#C39232;--e-global-color-lkgoldl:#E3B54F;--e-global-color-lkwhite:#FFFFFF;--e-global-color-lkhair:#E2DDE6;--e-global-color-lkmuted:#4A4351;--e-global-color-lkivory:#FCFBFC;--e-global-color-5ea1817b:#F3F0F4;--e-global-typography-primary-font-family:"Montserrat";--e-global-typography-primary-font-weight:700;--e-global-typography-secondary-font-family:"Montserrat";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Gotham";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Gotham";--e-global-typography-accent-font-weight:400;--e-global-typography-accent-text-transform:uppercase;--e-global-typography-accent-letter-spacing:1.2px;--e-global-typography-lkmenu-font-family:"Montserrat";--e-global-typography-lkmenu-font-weight:400;--e-global-typography-lkmenu-text-transform:uppercase;--e-global-typography-lkmenu-letter-spacing:1.2px;background-color:#FAF8FB;color:#14101A;font-family:"Gotham", Sans-serif;font-size:16px;font-weight:400;line-height:1.7em;}.elementor-kit-8 e-page-transition{background-color:#FFBC7D;}.elementor-kit-8 a{color:#A80061;}.elementor-kit-8 a:hover{color:#8C5E10;}.elementor-kit-8 h1{color:#14101A;font-family:"Montserrat", Sans-serif;font-size:48px;font-weight:700;line-height:1.25em;}.elementor-kit-8 h2{color:#14101A;font-family:"Montserrat", Sans-serif;font-size:38px;font-weight:700;line-height:1.25em;}.elementor-kit-8 h3{color:#14101A;font-family:"Montserrat", Sans-serif;font-size:30px;font-weight:700;line-height:1.25em;}.elementor-kit-8 h4{color:#14101A;font-family:"Montserrat", Sans-serif;font-size:24px;font-weight:400;line-height:1.25em;}.elementor-kit-8 h5{color:#14101A;font-family:"Montserrat", Sans-serif;font-size:20px;font-weight:400;line-height:1.25em;}.elementor-kit-8 h6{color:#14101A;font-family:"Montserrat", Sans-serif;font-size:17px;font-weight:400;line-height:1.25em;}.elementor-kit-8 button,.elementor-kit-8 input[type="button"],.elementor-kit-8 input[type="submit"],.elementor-kit-8 .elementor-button{font-family:"Gotham", Sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:1.2px;color:#FFFFFF;padding:16px 34px 16px 34px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1200px;}.e-con{--container-max-width:1200px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}:root { --lakara-fuchsia:#A80061; --lakara-violet:#2E1A47; --lakara-plum:#6B1A54; --lakara-gold:#C89932; --lakara-gold-deep:#BC8F2F; --lakara-gold-light:#D4AB54; --lakara-ink:#14101A; --lakara-white:#FFFFFF; --lakara-line:#E2DDE6; --lakara-ink-soft:#4A4351; --lakara-font-head:Montserrat; --lakara-font-body:Gotham; --lakara-space-xs:8px; --lakara-space-sm:16px; --lakara-space-md:32px; --lakara-space-lg:64px; --lakara-space-xl:112px; --lakara-container:1200px; --lakara-surface:#FCFBFC; --lakara-surface-alt:#F3F0F4; --lakara-size-display:3.75rem; --lakara-size-head:2.5rem; --lakara-size-subhead:1.375rem; --lakara-size-body:1rem; --lakara-size-label:0.8rem; --lakara-radius:2px; --lakara-gold-ink:#8A6A22; } /* Start custom CSS *//* Lakara design system. V4 Variables are the source of truth; this file adds only what V4 cannot express, plus the WooCommerce overrides. 2026-07-13: THE GRADIENT IS AN ACCENT, NOT THE SURFACE. It fills nothing. Three flat tones carry the page: ivory (page), violet (ceremony), gold (metal). The gradient survives as three small utilities only: .lakara-accent-rule, .lakara-badge, and the active-nav underline. If you are about to set it as a section background, that is the old system talking. */ /* Elementor V4 renders radial gradients as `radial-gradient(circle at )`. The brand spec needs an ellipse centred 20% left / 5% up, so it is authored here. */ :root { --lakara-radius: 2px; --lakara-ease: cubic-bezier(.16, 1, .3, 1); --lakara-gradient: radial-gradient( ellipse at 30% 45%, var(--lakara-fuchsia) 0%, var(--lakara-fuchsia) 25%, var(--lakara-violet) 60%, var(--lakara-violet) 100% ); } body { background: var(--lakara-ivory); color: var(--lakara-ink); } ::selection { background: var(--lakara-fuchsia); color: var(--lakara-white); } /* gold-dark, not gold: a focus ring is held to 3:1 like any non-text indicator, and plain gold is only 2.4:1 on ivory. */ :focus-visible { outline: 2px solid var(--lakara-gold-dark); outline-offset: 2px; border-radius: var(--lakara-radius); } /* ---- Surfaces ---- */ /* The ceremony band: hero, footer, mega menu. What the gradient used to do, done flat. */ .lakara-band { background: var(--lakara-violet); color: var(--lakara-white); } .lakara-band h1, .lakara-band h2, .lakara-band h3, .lakara-band h4, .lakara-band h5, .lakara-band h6 { color: var(--lakara-white); } /* The :not() exclusions matter. `.lakara-band a` is (0,1,1) and outranks any single-class button rule, which would paint a button's label gold on a white fill (1.9:1). Exclude anything that is actually a button. */ .lakara-band a:not(.lakara-button):not(.elementor-button):not(.button) { color: var(--lakara-gold-light); } .lakara-band a:not(.lakara-button):not(.elementor-button):not(.button):hover { color: var(--lakara-white); } .lakara-band :focus-visible { outline-color: var(--lakara-gold-light); } /* Depth is a hairline, never a shadow. */ .lakara-surface { background: var(--lakara-white); border: 1px solid var(--lakara-hairline); border-radius: var(--lakara-radius); } /* ---- Buttons: SOLID VIOLET. The gradient no longer fills buttons. ---- WooCommerce styles its primary buttons at `.woocommerce button.button.alt` (0,3,1), which beats `.woocommerce button.button` regardless of load order, so the `.alt` variants must be matched explicitly or Woo's purple wins on specificity. */ .elementor-button, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt, .woocommerce button.single_add_to_cart_button.button.alt, .woocommerce #respond input#submit, .woocommerce #respond input#submit.alt { background: var(--lakara-violet); color: var(--lakara-white); text-transform: uppercase; letter-spacing: 1.2px; border: 1px solid var(--lakara-violet); border-radius: var(--lakara-radius); transition: background-color .35s var(--lakara-ease), border-color .35s var(--lakara-ease), color .35s var(--lakara-ease); } /* Hover deepens the fill and lights a gold edge: the metal arriving. */ .elementor-button:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover, .woocommerce button.single_add_to_cart_button.button.alt:hover, .woocommerce #respond input#submit:hover, .woocommerce #respond input#submit.alt:hover { background: var(--lakara-ink); border-color: var(--lakara-gold); color: var(--lakara-white); } /* Secondary, on ivory. */ .lakara-button--ghost { background: transparent; color: var(--lakara-violet); border-color: var(--lakara-violet); } .lakara-button--ghost:hover { background: var(--lakara-violet); border-color: var(--lakara-gold); color: var(--lakara-white); } /* For use inside .lakara-band, where a violet button would vanish. */ .lakara-button--invert { background: var(--lakara-white); color: var(--lakara-violet); border-color: var(--lakara-white); } .lakara-button--invert:hover { background: var(--lakara-gold-light); border-color: var(--lakara-gold-light); color: var(--lakara-ink); } /* ---- Gold ornament ---- */ .lakara-rule { height: 1px; background: var(--lakara-gold); border: 0; } /* Gold weight is decided by the background, not by taste: gold #CC9B38 is 2.4:1 on ivory -> never text on light, rules and edges only. gold-dark is 5.4:1 on ivory -> the only gold allowed as text on light. gold-light is 8.5:1 on violet -> gold as text on the ceremony surface. */ .woocommerce .price, .woocommerce div.product p.price, .woocommerce div.product span.price, .lakara-price { color: var(--lakara-gold-dark); } .lakara-band .woocommerce .price, .lakara-band .lakara-price { color: var(--lakara-gold-light); } /* ---- The gradient, as an accent. This is now its entire job. ---- */ /* A keyline. Under a section heading, along the top of the page, under the active nav item. `margin: 0` is not cosmetic:
defaults to `margin: .5em auto`, and left in, every keyline quietly centres itself instead of sitting under the thing it underlines. */ .lakara-accent-rule { height: 3px; background: var(--lakara-gradient); border: 0; border-radius: var(--lakara-radius); margin: 0; } /* "New", "Limited", "1 left". Small, earned, never decorative. */ .lakara-badge { display: inline-block; padding: 5px 12px; background: var(--lakara-gradient); color: var(--lakara-white); font-size: 12px; line-height: 1; text-transform: uppercase; letter-spacing: 1.2px; border-radius: var(--lakara-radius); } /* ---- Navigation ---- The active item gets the gradient keyline: the accent doing the one job a full gradient band used to do badly, which is telling you where you are. */ .lakara-menu-link { position: relative; display: inline-block; padding-bottom: 6px; color: var(--lakara-ink); text-transform: uppercase; text-decoration: none; letter-spacing: 1.2px; transition: color .3s var(--lakara-ease); } .lakara-band .lakara-menu-link { color: var(--lakara-white); } .lakara-menu-link::after { content: ""; position: absolute; inset-inline: 0; bottom: 0; height: 2px; background: var(--lakara-gradient); transform: scaleX(0); transform-origin: left; transition: transform .4s var(--lakara-ease); } .lakara-menu-link:hover::after, .lakara-menu-link[aria-current]::after { transform: scaleX(1); } /* On the violet band the gradient's violet end is invisible against the background, so the underline goes gold instead. Same gesture, legible metal. */ .lakara-band .lakara-menu-link::after { background: var(--lakara-gold); } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; } }/* End custom CSS */ /* Start Custom Fonts CSS */@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 700; font-display: auto; src: url('https://lakara.world/wp-content/uploads/2026/07/Montserrat-Bold.woff2') format('woff2'); } @font-face { font-family: 'Montserrat'; font-style: normal; font-weight: normal; font-display: auto; src: url('https://lakara.world/wp-content/uploads/2026/07/Montserrat-Regular.woff2') format('woff2'); } /* End Custom Fonts CSS */ /* Start Custom Fonts CSS */@font-face { font-family: 'Gotham'; font-style: normal; font-weight: normal; font-display: auto; src: url('https://lakara.world/wp-content/uploads/2026/07/Gotham-Regular.woff2') format('woff2'); } /* End Custom Fonts CSS */