/* Loaded by inc/hero-live.php on the front page only.
   ===== Home hero - live text over the background image (2026-09-23) =====
   Replaces the single baked-in banner. Colours are sampled from that banner.
   Sizes are px, not rem: this site sets html font-size to ~14.6px.
   Classes are namespaced .chl-* so none of the style.css / bot.css rules for
   .chi-imgwrap reach inside. */
.corsia-hero.corsia-hero-img.corsia-hero-live{
  --chl-maroon:#91250D; --chl-maroon-dk:#7A1C13; --chl-cream:#FFFBE9; --chl-rule:#6C573F;
  position:relative; display:block; overflow:hidden; isolation:isolate;
  aspect-ratio:1407/752;           /* desktop: same frame as the old banner */
  container-type:inline-size;       /* cqi below = % of the hero width */
  background:#EDE5D6;               /* paper tone while the image loads */
}
.corsia-hero-live .chl-bg{
  position:absolute; inset:0; z-index:-1;
  width:100%!important; height:100%!important; max-width:none!important;
  object-fit:cover; object-position:50% 50%; display:block;
}
/* top edge melts into the cream topbar, as before */
.corsia-hero-live::before{ content:''; position:absolute; inset:0 0 auto; height:14%; z-index:0; pointer-events:none;
  background:linear-gradient(to bottom,var(--cream,#FBF6EC) 0%,var(--cream,#FBF6EC) 8%,rgba(251,246,236,0) 100%); }

.corsia-hero-live .chl-inner{
  position:absolute; inset:0; z-index:1;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:2.6cqi; padding:4cqi 0 1cqi;
}

/* ---- badge ---- */
.corsia-hero-live .chl-badge{
  width:32.5cqi; aspect-ratio:1030/912;
  background:var(--chl-badge) center/contain no-repeat;
  filter:drop-shadow(0 .5cqi 1cqi rgba(60,25,10,.28));
  container-type:inline-size;       /* inside the badge, cqi = % of the badge */
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center;
}
.corsia-hero-live .chl-title{ margin:0; padding:5cqi 0 0; line-height:1; display:flex; flex-direction:column; align-items:center; }
.corsia-hero-live .chl-brand{
  font-family:'Frank Ruhl Libre',serif; font-weight:900;
  font-size:clamp(38px,20.5cqi,128px); line-height:.95; color:var(--chl-maroon);
  letter-spacing:.01em;
}
.corsia-hero-live .chl-sub{
  font-family:'Assistant',sans-serif; font-weight:600;
  font-size:clamp(19px,9.6cqi,58px); line-height:1.15; color:var(--chl-cream);
  margin-top:.5cqi;
}
/* The logo's hand lettering, traced (inc/hero-sub-art.php). 5.6em keeps the width
   the text line had, which is also the logo's own sub-to-name ratio (~0.96). */
.corsia-hero-live .chl-sub--art{ display:block; line-height:0; margin-top:1.4cqi; }
.corsia-hero-live .chl-sub-art{ display:block; width:5.6em; height:auto; overflow:visible; }
.corsia-hero-live .chl-cats{
  margin:2.6cqi 0 0; padding:0;
  font-family:'Assistant',sans-serif; font-weight:700;
  font-size:clamp(12px,3.7cqi,23px); line-height:1.2; color:var(--chl-maroon-dk);
  letter-spacing:0;
}
.corsia-hero-live .chl-dot{ margin:0 .18em; }

/* ---- address block between two ornament rules ---- */
.corsia-hero-live .chl-contact{ width:34cqi; display:flex; flex-direction:column; align-items:center; gap:.7cqi; }
.corsia-hero-live .chl-rule{ display:flex; align-items:center; width:100%; color:var(--chl-rule); }
.corsia-hero-live .chl-rule::before,.corsia-hero-live .chl-rule::after{ content:''; flex:1; height:1px; background:currentColor; }
.corsia-hero-live .chl-rule svg{ width:6.5cqi; min-width:52px; height:auto; flex:none; margin:0 .4cqi; }
.corsia-hero-live .chl-rule-flip svg{ transform:scaleY(-1); }
.corsia-hero-live .chl-addr{
  font-style:normal; text-align:center; color:var(--chl-maroon-dk);
  font-family:'Assistant',sans-serif; font-weight:700; line-height:1.3;
  display:flex; flex-direction:column; align-items:center;
}
.corsia-hero-live .chl-street{ font-size:clamp(15px,1.95cqi,37px); }
.corsia-hero-live a.chl-tel{
  font-size:clamp(17px,2.5cqi,46px); font-weight:800; color:var(--chl-maroon-dk);
  text-decoration:none; direction:ltr; unicode-bidi:isolate; letter-spacing:.02em;
  padding:2px 6px; border-radius:6px;
}
.corsia-hero-live a.chl-tel:hover{ color:var(--chl-maroon-dk); text-decoration:underline; text-underline-offset:.15em; }

/* ---- narrow screens: taller frame, content in flow ---- */
@media (max-width:767px){
  .corsia-hero.corsia-hero-img.corsia-hero-live{ aspect-ratio:auto; min-height:0; }
  .corsia-hero-live .chl-inner{ position:relative; inset:auto; gap:18px; padding:48px 16px 34px; }
  .corsia-hero-live .chl-badge{ width:min(90vw,420px); }
  .corsia-hero-live .chl-contact{ width:min(88vw,420px); gap:6px; }
  .corsia-hero-live .chl-rule svg{ width:56px; }
}
@media (min-width:768px) and (max-width:1100px){
  .corsia-hero.corsia-hero-img.corsia-hero-live{ aspect-ratio:1407/870; }
  .corsia-hero-live .chl-badge{ width:43cqi; }
  .corsia-hero-live .chl-contact{ width:44cqi; }
}