@font-face{font-family:Lato;src:url('/assets/Lato-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Lato;src:url('/assets/Lato-Bold.ttf') format('truetype');font-weight:600 900;font-style:normal;font-display:swap}
.svitlo-page{--body-font:Lato}
.svitlo-page .header .brand img{width:112px;height:112px;flex-shrink:0;padding:0;border:0;border-radius:0;object-fit:contain}
@media(max-width:719px){.svitlo-page .header .brand img{width:96px;height:96px;padding:0}}
.svitlo-page .header .brand{gap:15px}
.svitlo-page .header .brand>span{max-width:285px;font-size:27px}
.svitlo-page .brand small{margin-top:2px;font-size:13.5px;line-height:1.4}
.svitlo-page .brand .brand-description{display:block;margin-top:14px;font:400 13px/1.45 Lato,sans-serif;letter-spacing:0;color:var(--white);max-width:260px}
.svitlo-page .hero-visual{inset:-4%;transform:translateY(calc(var(--hero-scroll,0)*14px)) scale(calc(1 + var(--hero-scroll,0)*.03))}
@media(max-width:719px){.svitlo-page .header{padding:16px 20px}.svitlo-page .brand{gap:5px}.svitlo-page .brand img{width:64px;height:70px}.svitlo-page .brand>span{min-width:0;font-size:18px}.svitlo-page .brand .brand-description{font-size:12px;max-width:210px}.svitlo-page .hero-copy .eyebrow{letter-spacing:1.3px;line-height:1.7}}
@media(prefers-reduced-motion:no-preference){.svitlo-page .hero-photo-track{height:155svh}.svitlo-page .light-story{height:175svh}}
@media(min-width:720px) and (prefers-reduced-motion:no-preference){.svitlo-page .hero-photo-track{height:180svh}.svitlo-page .light-story{height:200svh}}

/* Keep the illustration and its background light in one coordinate system. */
.svitlo-scene-visual{position:relative;isolation:isolate;flex-shrink:0;width:min(85vw,480px,52svh);aspect-ratio:1;transform:translateY(calc((1 - var(--scene))*65px)) scale(calc(.88 + var(--scene)*.12));will-change:transform}
.svitlo-scene-visual .candle-art{display:block;position:relative;z-index:1;width:100%;height:100%;max-width:none;max-height:none;transform:none}
.svitlo-scene-visual .light-halo{inset:-22.5%;width:145%;height:145%;max-width:none;z-index:0;transform-origin:center;transform:scale(calc(.65 + var(--scene)*.65))}
@media(min-width:720px){.svitlo-scene-visual{width:min(48vw,600px,75svh)}}
@media(prefers-reduced-motion:reduce){.svitlo-scene-visual{transform:none;will-change:auto}}

.svitlo-page .scene-facts .burn-time-highlight{display:flex;align-items:center;justify-content:center;max-width:100%;min-height:42.67px;padding:8px 13.33px;font-size:16px;line-height:1.5;text-align:center;color:var(--gold);border-color:var(--gold)}
@media(max-width:719px) and (max-height:540px) and (orientation:landscape){
.svitlo-page .light-stage{flex-direction:row;gap:12px}
.svitlo-page .svitlo-scene-visual{width:min(35vw,48svh)}
.svitlo-page .scene-copy{padding:12px 16px;max-width:65vw}
.svitlo-page .scene-copy h2{font-size:28px;margin:10px 0 16px}
}

/* Warm evening hero: HTML typography and the single flame in the photo. */
.svitlo-page .hero-copy{--brand-description-lift:24px}
.svitlo-page .hero-copy>.brand-description{position:relative;top:calc(-1*var(--brand-description-lift));max-width:330px;margin:0 0 12px;font:400 14px/1.6 Lato,sans-serif;color:var(--gold);letter-spacing:0;word-spacing:3px}
@media(min-width:720px){.svitlo-page .hero-copy{--brand-description-lift:49px}}
@media(min-width:1100px){.svitlo-page .hero-copy{--brand-description-lift:69px}}
.svitlo-page .hero-photo-warm .hero-visual{inset:-2%;transform:translateY(calc(var(--hero-scroll,0)*8px)) scale(calc(1.015 + var(--hero-scroll,0)*.025))}
.svitlo-page .hero-photo-warm .hero-visual>.hero-warm-photo{object-position:center 50%}
.svitlo-page .hero-photo-warm:after{inset:0;background:linear-gradient(180deg,rgba(20,12,10,.5),transparent 36%,transparent 80%,rgba(20,12,10,.45));pointer-events:none}
.svitlo-page .hero-photo-warm figcaption{inset:0;text-align:center;pointer-events:none}
.svitlo-page .hero-photo-warm .hero-photo-title{position:absolute;top:clamp(22px,5svh,56px);left:20px;right:20px;margin:0;font:500 clamp(30px,3.5vw,48px)/1.04 Cormorant,Georgia,serif;letter-spacing:-.3px;color:#fff6e8;opacity:1;text-shadow:0 2px 20px #140c0a66}
.svitlo-page .hero-photo-warm .hero-photo-note{position:absolute;bottom:22px;left:20px;right:20px;margin:0;font:400 10px/1.5 Lato,sans-serif;letter-spacing:1.2px;color:#fff6e8;opacity:.75}
@media(max-width:719px){.svitlo-page .hero-copy>.brand-description{margin-inline:auto;font-size:13px;max-width:300px}.svitlo-page .hero-photo-track .hero-photo-warm{height:min(90svh,125vw);top:5svh}.svitlo-page .hero-photo-warm .hero-photo-title{top:22px;font-size:clamp(29px,8.2vw,42px)}}
@media(min-width:720px){.svitlo-page .hero-photo-track .hero-photo-warm{height:min(100svh,62.5vw,825px)}}
@media(prefers-reduced-motion:reduce){.svitlo-page .hero-photo-warm .hero-visual{transform:none!important}.svitlo-page .hero-photo-track .hero-photo-warm{position:relative;top:0}}
.svitlo-page .warm-fire-layer{position:absolute;inset:0;pointer-events:none;visibility:hidden}
.svitlo-page .warm-fire-layer.is-ready{visibility:visible}
.svitlo-page .warm-fire-layer>.warm-fire-plate{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:none}
.svitlo-page .warm-fire-anchor{position:absolute;transform:translate(-50%,-100%);pointer-events:none}
.svitlo-page .warm-fire-anchor>.warm-fire-sprite{display:block;width:100%;height:100%;object-fit:fill;transform-origin:50% 100%;animation:warm-flame-only 2.4s ease-in-out infinite;animation-play-state:paused;animation-delay:calc(var(--hero-scroll,0)*-8.64s);filter:drop-shadow(0 0 5px #ffc16566);will-change:transform}
@keyframes warm-flame-only{
  0%,100%{transform:rotate(-2deg) scale(.98,1.01);opacity:.97}
  22%{transform:rotate(calc(3deg + var(--hero-scroll,0)*2deg)) scale(.93,1.055);opacity:1}
  47%{transform:rotate(-1deg) scale(1.015,.975);opacity:.94}
  73%{transform:rotate(calc(-3deg - var(--hero-scroll,0)*2deg)) scale(.95,1.035);opacity:.99}
}
@media(prefers-reduced-motion:reduce){.svitlo-page .warm-fire-layer{display:none}.svitlo-page .warm-fire-sprite{animation:none;will-change:auto}}
