/* ---------- Base ---------- */
:root{
  --ink:#0a0a0a;
  --text:#1b1b1f;
  --muted:#5a6270;
  --white:#ffffff;
  --blue:#0d4dd9;
  --container:1740px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:Arial,Helvetica,sans-serif;
  color:var(--text);
  background:#ffffff;
  line-height:1.45;
}
.container{width:min(var(--container), 92vw);margin-inline:auto}

/* ---------- Brand bar ---------- */
.brandbar{background:#fff;border-bottom:1px solid #eef0f5}
.brandbar__inner{width:100%;margin-inline:auto;padding:24px 44px}
.brandbar img{display:block;height:auto}
.brandbar__img{display:block;width:min(50vw, 500px);max-width:100%;}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;background:#0e43c9;min-height:442px}
.hero__bg{position:absolute;inset:0;z-index:0;background:
  linear-gradient(180deg,rgba(10,25,70,.12),rgba(10,25,70,.5)),
  url('assets/hero-bg.webp?v=6') center/cover no-repeat}
.hero__content{position:relative;z-index:1;min-height:442px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;text-align:center}
.hero__title{margin:0 0 34px;font-weight:700;font-size:clamp(44px,4.43vw,85px);line-height:1;letter-spacing:.02em}
.hero__subtitle{max-width:1500px;margin:0 auto 20px;font-size:clamp(28px,2.86vw,55px);font-weight:400;line-height:1;letter-spacing:0;opacity:.98}
.hero__meta{margin:0;font-weight:700;font-size:clamp(26px,2.6vw,50px);line-height:1;letter-spacing:0}

/* ---------- Banner ---------- */
.banner{background:#fff;margin-top:12px}
.banner__img{display:block;width:100%;height:auto}

/* ---------- Footer ---------- */
.footer{padding:54px 0;color:#fff;text-align:center;background:#000;font-size:28px;line-height:1.3}

/* ---------- Responsive ---------- */
@media (max-width:900px){
  .hero{min-height:340px}
  .hero__content{min-height:340px}
}
@media (max-width:640px){
  .brandbar__inner{width:100%;padding:13px 14px 10px}
  .brandbar__img{width:214px;margin:0}
  .brandbar img{border-radius:0}
  .hero{min-height:290px}
  .hero__content{min-height:290px;width:min(100% - 28px, 402px)}
  .hero__title{margin-bottom:22px;font-size:clamp(40px,12vw,52px);line-height:1.12;letter-spacing:0}
  .hero__subtitle{margin-bottom:12px;font-size:clamp(22px,6.5vw,28px);line-height:1.18}
  .hero__meta{font-size:clamp(18px,5.2vw,22px);line-height:1.18}
}

/* ===== SEC: Text + CTA + Accordion ===== */
.sec-webinar{background:#fff;padding:112px 0 86px}
.sec-webinar__lead{font-size:clamp(28px,2.08vw,40px);line-height:1.4;letter-spacing:-.02em;margin-bottom:0}
.sec-webinar__lead p{margin:0}
.sec-webinar__title{margin:72px 0 34px;font-size:clamp(30px,2.08vw,40px);line-height:1.25;letter-spacing:-.02em;font-weight:700}
.sec-webinar__grid{
  display:grid;gap:80px;grid-template-columns:1fr 1fr;
  margin-bottom:0
}
.sec-webinar__grid ul{margin:0;padding-left:42px}
.sec-webinar__grid li{margin:0 0 8px;font-size:clamp(28px,2.08vw,40px);line-height:1.4;letter-spacing:-.02em}

.sec-webinar__info{
  display:grid;gap:110px;grid-template-columns:1fr 1fr;font-size:clamp(28px,2.08vw,40px);line-height:1.28;letter-spacing:-.02em;
  background:#e7f0fb;border-radius:0;padding:38px 32px;margin:74px 0 72px
}
.info__title{font-weight:700;margin-bottom:26px}
.info__col p{margin:0 0 24px}
.info__col p:last-child{margin-bottom:0}

/* Buttons */
.btn{display:inline-block;border:0;border-radius:0;padding:22px 50px;
  font-weight:400;cursor:pointer;text-decoration:none;line-height:1;
  transition:transform .06s ease, opacity .2s ease}
.btn--primary{min-width:465px;background:#000;color:#fff;font-size:42px;text-align:center}
.btn--primary:active{transform:translateY(1px)}
.btn--wide{display:block;margin:32px auto 0}

/* Accordion (details) */
.reg-accordion{border:0}
.reg-accordion > summary{list-style:none;display:inline-block}
.reg-accordion > summary::-webkit-details-marker{display:none}
.reg-accordion__panel{
  overflow:hidden;max-height:0;transition:max-height .35s ease, padding .35s ease;
  padding:0
}
.reg-accordion[open] .reg-accordion__panel{
  max-height:1200px; 
  padding:18px; background:#0A5DC51A;border-radius:6px
}

/* Form */
.reg-form{max-width:820px;margin:0 auto}
.reg-form__title{margin:0 0 14px}
.reg-form__row{display:block;margin:10px 0}
.reg-form input{
  width:100%;height:52px;padding:12px 14px;border:1px solid #c8d3ea;
  border-radius:4px;font-size:16px;outline-color:#5c7cff
}

/* Mobile */
@media (max-width:900px){
  .sec-webinar__grid{grid-template-columns:1fr}
  .sec-webinar__info{grid-template-columns:1fr}
}

@media (max-width:640px){
  .banner{margin-top:0}
  .footer{padding:28px 0;font-size:16px}
  .sec-webinar{padding:42px 0 54px}
  .sec-webinar__lead{
    font-size:16px;
    line-height:1.48;
    letter-spacing:0;
    text-align:center;
    margin-bottom:0;
  }
  .sec-webinar__title{
    margin:30px 0 18px;
    font-size:20px;
    line-height:1.25;
    letter-spacing:0;
  }
  .sec-webinar__grid{gap:0;margin-bottom:0}
  .sec-webinar__grid ul{padding-left:22px}
  .sec-webinar__grid li{
    margin:0 0 2px;
    font-size:16px;
    line-height:1.44;
    letter-spacing:0;
  }
  .sec-webinar__info{
    gap:18px;
    font-size:16px;
    line-height:1.35;
    letter-spacing:0;
    padding:18px 12px;
    margin:20px 0 24px;
  }
  .info__title{margin-bottom:8px;font-size:20px}
  .info__col p{margin-bottom:14px}
  .btn{padding:12px 24px}
  .btn--primary{min-width:200px;font-size:18px}
  .btn--wide{margin-top:18px}
  .reg-accordion[open] .reg-accordion__panel{padding:14px}
  .reg-form__title{font-size:18px}
  .reg-form input{height:46px;font-size:15px}
}

.sec-webinar .reg-accordion{
  display: block;      
  text-align: center;    
}
.sec-webinar .reg-accordion > summary{
  display: inline-flex;  
  width: auto;
  margin: 0px 0 0;      
  justify-content: center;
  align-items: center;
}
.sec-webinar .reg-accordion__panel{ text-align: initial; }

/* ===== Modal (notify) ===== */
.modal{position:fixed; inset:0; z-index:1000; display:none}
.modal.is-open{display:block}
.modal__backdrop{
  position:absolute; inset:0;
  background:rgba(17,24,39,.55);
  backdrop-filter:saturate(1.05) blur(2px);
}
.modal__dialog{
  position:relative; margin:auto; top:12vh;
  max-width:520px; width:calc(100% - 32px);
  background:#fff; border-radius:14px; padding:24px 22px 18px;
  box-shadow:0 24px 72px rgba(2,6,23,.28);
  transform:translateY(-8px); opacity:0;
  transition:opacity .18s ease, transform .18s ease;
  text-align:center;
}
.modal.is-open .modal__dialog{opacity:1; transform:translateY(0)}
.modal__title{margin:0 0 8px; font-size:22px; font-weight:800}
.modal__text{margin:0 0 16px; color:#111827}
.modal__close{
  position:absolute; right:10px; top:8px; width:36px; height:36px;
  border:0; background:transparent; font-size:28px; line-height:1; cursor:pointer; color:#333
}
.modal__ok{display:block; margin-left:auto}
@media (max-width:640px){
  .modal__dialog{top:20vh; width:calc(100% - 24px); padding:20px 18px 16px}
}
.hp-field{
  position:absolute !important;
  left:-9999px !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* ===== Notify modal ===== */
.modal{position:fixed;inset:0;z-index:1000;display:none}
.modal.is-open{display:block}
.modal__backdrop{position:absolute;inset:0;background:rgba(17,24,39,.55);backdrop-filter:saturate(1.05) blur(2px)}
.modal__dialog{
  position:relative;margin:auto;top:12vh;
  max-width:520px;width:calc(100% - 32px);
  background:#fff;border-radius:14px;padding:24px 22px 18px;
  box-shadow:0 24px 72px rgba(2,6,23,.28);
  transform:translateY(-8px);opacity:0;transition:opacity .18s,transform .18s;
  text-align:center
}
.modal.is-open .modal__dialog{opacity:1;transform:translateY(0)}
.modal__title{margin:0 0 8px;font-size:22px;font-weight:800}
.modal__text{margin:0 0 16px;color:#111827}
.modal__close{position:absolute;right:10px;top:8px;width:36px;height:36px;border:0;background:transparent;font-size:28px;line-height:1;cursor:pointer;color:#333}
.modal__ok{display:block;margin-left:auto}
@media (max-width:640px){.modal__dialog{top:20vh;width:calc(100% - 24px);padding:20px 18px 16px}}

.sec-webinar .reg-accordion[open] > summary{
  display: none;
}
