/*
Theme Name: Billigence Executive Roundtable
Author: Creative Media House
Description: WordPress theme converted from the supplied Billigence Roundtable landing-page HTML.
Version: 1.0.0
License: GPL-2.0-or-later
Text Domain: billigence-roundtable
*/

:root{
  --red:#BC2030;
  --red-deep:#8E1624;
  --ink:#14181B;
  --slate:#5A6067;
  --mist:#ECEDEF;
  --line:#D9DCE0;
  --paper:#FFFFFF;
  --font:"Lato","Helvetica Neue",Arial,sans-serif;
  --gut:clamp(20px,5vw,72px);
  --ink-fixed:#14181B;
  --on-ink:#FFFFFF;
}
:root:not([data-theme="light"]){}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:#F2F3F4; --paper:#101315; --mist:#191D20; --line:#2C3237; --slate:#A4ACB3; --red:#E24354; --red-deep:#BC2030;
  }
}
:root[data-theme="dark"]{
  --ink:#F2F3F4; --paper:#101315; --mist:#191D20; --line:#2C3237; --slate:#A4ACB3; --red:#E24354; --red-deep:#BC2030;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--font); font-weight:400; font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; height:auto; display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--red); outline-offset:3px}
.wrap{max-width:1180px; margin:0 auto; padding:0 var(--gut)}
h1,h2,h3{margin:0; font-weight:900; letter-spacing:-.02em; line-height:1.04}
p{margin:0 0 1em}
.lede{font-size:1.17rem; color:var(--slate); font-weight:300; max-width:62ch}

/* ---------- header ---------- */
.top{
  position:sticky; top:0; z-index:20; background:color-mix(in srgb,var(--paper) 88%,transparent);
  backdrop-filter:saturate(1.4) blur(8px); border-bottom:1px solid var(--line);
}
.top .wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; height:82px}
.brandlock{display:flex; align-items:center; gap:16px}
.brandlock .blogo{width:150px}
.brandlock .adiv{width:1px; height:26px; background:var(--line)}
.brandlock .alogo{width:96px}
.btn{
  display:inline-block; background:var(--red); color:#fff; text-decoration:none;
  font-weight:700; font-size:.95rem; padding:13px 22px; border:0; border-radius:2px;
  cursor:pointer; transition:background .18s ease;
}
.btn:hover{background:var(--red-deep)}
.btn.ghost{background:transparent; color:var(--ink); border:1px solid var(--line)}
.btn.ghost:hover{border-color:var(--red); color:var(--red); background:transparent}

/* ---------- hero ---------- */
.hero{padding:clamp(48px,8vw,104px) 0 clamp(40px,6vw,76px); overflow:hidden}
.hero .wrap{display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(32px,5vw,64px); align-items:center}
.kicker{display:flex; align-items:center; gap:12px; color:var(--red); font-weight:700; font-size:.92rem; margin-bottom:22px}
.kicker span{display:block; width:46px; height:2px; background:var(--red)}
h1{font-size:clamp(2.5rem,6.1vw,4.5rem)}
h1 em{font-style:normal; display:block; font-weight:300; letter-spacing:-.015em}
.hero .lede{margin-top:24px}
.facts{display:flex; flex-wrap:wrap; gap:0; margin:34px 0 30px; border-top:1px solid var(--line)}
.facts div{padding:16px 26px 14px 0; margin-right:26px; border-right:1px solid var(--line)}
.facts div:last-child{border-right:0; margin-right:0}
.facts dt{font-size:.82rem; color:var(--slate); font-weight:400; margin-bottom:3px}
.facts dd{margin:0; font-weight:700; font-size:1.05rem}
.hero-cta{display:flex; flex-wrap:wrap; gap:12px; align-items:center}
.seats-note{font-size:.9rem; color:var(--slate)}

/* ---------- table diagram ---------- */
.table-fig{position:relative}
.table-fig svg{width:100%; height:auto}
.seat{transform-box:fill-box; transform-origin:center}
@media (prefers-reduced-motion: no-preference){
  .seat-open{animation:pulse 3.6s ease-in-out infinite}
  .seat-open:nth-of-type(2){animation-delay:.5s}
  .seat-open:nth-of-type(3){animation-delay:1s}
  @keyframes pulse{0%,72%,100%{opacity:1}86%{opacity:.35}}
}
.fig-key{display:flex; gap:22px; justify-content:center; margin-top:14px; font-size:.86rem; color:var(--slate)}
.fig-key i{display:inline-block; width:11px; height:11px; border-radius:50%; margin-right:7px; vertical-align:-1px}
.fig-key .taken{background:var(--red)}
.fig-key .open{border:1.5px dashed var(--red)}

/* ---------- generic section ---------- */
section{padding:clamp(56px,7vw,96px) 0}
.band{background:var(--mist)}
h2{font-size:clamp(1.8rem,3.4vw,2.6rem); max-width:22ch}
.h2-sub{color:var(--slate); font-weight:300; margin-top:14px; max-width:60ch}

/* ---------- topics ---------- */
.topics{margin-top:44px; border-top:1px solid var(--line)}
.topic{display:grid; grid-template-columns:auto 1fr 1.2fr; gap:clamp(18px,4vw,48px); padding:26px 0; border-bottom:1px solid var(--line); align-items:baseline}
.topic .q{color:var(--red); font-weight:900; font-size:1.1rem; width:1.6em}
.topic h3{font-size:1.24rem; font-weight:700; letter-spacing:-.01em}
.topic p{margin:0; color:var(--slate); font-size:1rem}

/* ---------- agenda ---------- */
.agenda{margin-top:44px; display:grid; gap:0}
.slot{display:grid; grid-template-columns:130px 1fr; gap:clamp(16px,3vw,40px); padding:22px 0; border-top:1px solid var(--line); position:relative}
.slot:last-child{border-bottom:1px solid var(--line)}
.slot time{font-weight:700; font-variant-numeric:tabular-nums; color:var(--red)}
.slot h3{font-size:1.1rem; font-weight:700; margin-bottom:5px}
.slot p{margin:0; color:var(--slate); font-size:.98rem; max-width:64ch}
.slot-themes{list-style:none; margin:14px 0 0; padding:0; max-width:64ch}
.slot-themes li{padding:9px 0 9px 22px; border-top:1px solid var(--line); position:relative; color:var(--ink); font-size:.96rem; line-height:1.55}
.slot-themes li:first-child{border-top:0}
.slot-themes li::before{content:""; position:absolute; left:0; top:18px; width:10px; height:2px; background:var(--red)}
.slot-themes li strong{font-weight:700}
.qlist{list-style:none; margin:34px 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:0 48px}
.qlist li{padding:20px 0 20px 26px; border-top:1px solid var(--line); font-size:1.02rem; line-height:1.55; color:var(--ink); position:relative}
.qlist li:nth-child(-n+2){border-top:0}
.qlist li::before{content:""; position:absolute; left:0; top:29px; width:12px; height:2px; background:var(--red)}
@media (max-width:700px){
  .qlist{grid-template-columns:1fr}
  .qlist li:nth-child(-n+2){border-top:1px solid var(--line)}
  .qlist li:first-child{border-top:0}
}

/* ---------- room / hosts ---------- */
.room{display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,72px); align-items:start}
.roles{list-style:none; margin:26px 0 0; padding:0}
.roles li{padding:11px 0 11px 26px; border-bottom:1px solid var(--line); position:relative; color:var(--ink)}
.roles li::before{content:""; position:absolute; left:0; top:20px; width:12px; height:2px; background:var(--red)}
.hosts{display:grid; gap:20px; margin-top:26px}
.host{display:grid; grid-template-columns:76px 1fr; gap:18px; align-items:center}
.host .ring{width:76px; height:76px; border-radius:50%; border:2px solid var(--red); display:grid; place-items:center; font-weight:900; color:var(--red); font-size:1.3rem; letter-spacing:.02em}
.host h3{font-size:1.06rem; font-weight:700}
.host p{margin:2px 0 0; color:var(--slate); font-size:.95rem}

/* ---------- rules strip ---------- */
.rules{background:var(--ink-fixed); color:var(--on-ink)}
.rules h2{color:var(--on-ink)}
.rules .wrap{display:grid; grid-template-columns:1fr 1.3fr; gap:clamp(28px,5vw,64px); align-items:center}
.rules p{color:color-mix(in srgb,var(--on-ink) 72%,var(--ink-fixed)); font-weight:300; margin:0}
.rules p + p{margin-top:14px}

/* ---------- leader message ---------- */
.leader{display:grid; grid-template-columns:220px 1fr; gap:clamp(28px,5vw,56px); align-items:start}
.leader-photo{margin:0; flex-shrink:0}
.leader-photo img{
  width:190px; height:190px; border-radius:50%; object-fit:cover;
  border:3px solid var(--red); padding:5px;
}
.leader-msg{font-size:1.05rem; font-weight:300; line-height:1.65; color:var(--ink); max-width:64ch}
.leader-msg + .leader-msg{margin-top:16px}
.leader-meta{margin-top:22px; padding-top:18px; border-top:1px solid var(--line)}
.leader-meta h3{font-size:1.08rem; font-weight:700}
.leader-meta p{margin:3px 0 0; color:var(--slate); font-size:.95rem; line-height:1.5}

/* ---------- rsvp ---------- */
.rsvp{display:grid; grid-template-columns:.95fr 1.05fr; gap:clamp(32px,5vw,72px); align-items:start}
form{display:grid; gap:16px}
.field{display:grid; gap:6px}
label{font-size:.9rem; color:var(--slate)}
input,select{
  font-family:var(--font); font-size:1rem; color:var(--ink); background:var(--paper);
  border:1px solid var(--line); border-radius:2px; padding:13px 14px; width:100%;
}
input:focus,select:focus{border-color:var(--red); outline:none; box-shadow:0 0 0 3px color-mix(in srgb,var(--red) 18%,transparent)}
.two{display:grid; grid-template-columns:1fr 1fr; gap:16px}
.consent{display:flex; gap:10px; align-items:flex-start; font-size:.88rem; color:var(--slate)}
.consent input{width:auto; margin-top:3px}
.status{display:none; padding:14px 16px; border-left:3px solid var(--red); background:var(--mist); font-size:.95rem}
.status.show{display:block}
.venue{margin-top:28px; border-top:1px solid var(--line); padding-top:22px}
.venue h3{font-size:1.05rem; font-weight:700; margin-bottom:6px}
.venue p{color:var(--slate); margin:0}

/* ---------- footer ---------- */
footer{background:var(--ink-fixed); color:color-mix(in srgb,var(--on-ink) 70%,var(--ink-fixed)); padding:44px 0 52px; font-size:.9rem}
footer .wrap{display:flex; flex-wrap:wrap; gap:20px; justify-content:space-between; align-items:center}
footer .brandlock{gap:18px}
footer .brandlock .adiv{background:rgba(255,255,255,.2)}
footer .blogo{width:140px; opacity:.95}
footer .alogo{width:88px; opacity:.9}
footer a{text-decoration:none; margin-left:22px}
footer a:hover{color:var(--on-ink)}

@media (max-width:900px){
  .hero .wrap,.room,.rsvp,.rules .wrap,.leader{grid-template-columns:1fr}
  .leader-photo img{width:140px; height:140px}
  .table-fig{max-width:460px; margin:8px auto 0}
  .topic{grid-template-columns:auto 1fr; }
  .topic p{grid-column:2}
  .slot{grid-template-columns:96px 1fr}
}
@media (max-width:520px){
  body{font-size:16px}
  .top img{width:140px}
  .facts div{border-right:0; padding-right:0; margin-right:0; width:100%; border-bottom:1px solid var(--line)}
  .facts div:last-child{border-bottom:0}
  .two{grid-template-columns:1fr}
  .slot{grid-template-columns:1fr; gap:4px}
}

.screen-reader-text{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.rsvp-notice{display:block!important;margin-bottom:16px}