/*
Theme Name: WSF Complete Theme
Description: Custom classic WordPress theme that replicates the warsawsecurityforum.org design
  (Elementor kit): Poppins/Open Sans, #6699D9 primary, #002454 secondary, #011228 dark.
Version: 2.0.0
Text Domain: wsf-theme
*/

/* ===== Design tokens (from the live WSF Elementor kit) ===== */
:root{
  --blue:#6699D9;            /* primary */
  --blue-dark:#4d7fc4;       /* primary hover */
  --navy:#002454;            /* secondary — headings */
  --navy-deep:#011228;       /* footer / dark sections */
  --text-muted:#BDC8DA;      /* muted light blue-gray */
  --accent:#EDF0F7;          /* near-white */
  --ink:#333333;             /* body/copy gray */
  --icon:#1C274C;            /* nav icon strokes */
  --white:#fff;
  --line:rgba(189,200,218,.38);
  --container:1120px;
  --shadow:0 18px 55px rgba(0,0,0,.14);
  /* Header height. The logo is sized against this, so the two must move together.
     Also used by .primary-nav.is-open below to cap the mobile menu to the
     viewport minus the header; keep that reference pointed at this var. */
  --header-h:92px;
}

/* ===== Base ===== */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--white);color:var(--ink);font-family:'Poppins',Arial,Helvetica,sans-serif;font-size:16px;font-weight:400;line-height:1.8}
h1,h2,h3,h4{font-family:'Poppins',Arial,sans-serif;color:var(--navy);line-height:1.1}
a{color:var(--blue)}
img{max-width:100%;height:auto;display:block}
.container{width:min(calc(100% - 48px),var(--container));margin:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0)}
::selection{background:var(--blue);color:var(--white)}

/* ===== Buttons ===== */
.btn{display:inline-flex;gap:14px;align-items:center;justify-content:center;text-decoration:none;font-family:'Open Sans',sans-serif;font-size:14px;font-weight:700;letter-spacing:1px;line-height:1.1;border:0;border-radius:15px;padding:18px 50px;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.btn-primary{background:var(--blue);color:var(--white)}
.btn-primary:hover{background:var(--blue-dark);color:var(--white)}
.btn-outline{background:transparent;border:1px solid rgba(255,255,255,.55);color:var(--white)}
.btn-outline:hover{background:rgba(255,255,255,.12)}
.btn-navy{background:var(--navy);color:var(--white)}
.btn-navy:hover{background:var(--blue);color:var(--white)}

/* ===== Section scaffolding ===== */
.section{padding:96px 0}
.eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--navy)}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:44px}
.section-heading h2{font-size:30px;font-weight:600;margin:0}
.section-heading .text-link{font-size:14px;font-weight:500;letter-spacing:.04em;text-transform:lowercase;text-decoration:none;color:var(--blue);white-space:nowrap}

/* ===== Header ===== */
.site-header{position:sticky;top:0;z-index:100;background:var(--white);box-shadow:0 2px 18px rgba(0,36,84,.07)}
.header-inner{min-height:var(--header-h);display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:block;flex-shrink:0;text-decoration:none}
.brand img{width:300px;height:auto}
.primary-nav{display:flex;align-items:center;gap:34px}
.nav-link{display:inline-flex;gap:7px;align-items:center;text-decoration:none;border:0;background:none;cursor:pointer;font-family:'Poppins',sans-serif;font-size:16px;font-weight:600;line-height:110%;color:var(--navy);padding:24px 0;transition:color .2s}
.nav-link:hover{color:var(--blue)}
.nav-chevron{font-size:12px;opacity:.65;margin-top:2px}
.nav-chevron{transform:rotate(0);transition:transform .2s}
.nav-item.is-open .nav-chevron{transform:rotate(180deg)}

/* Dropdown base — full-width flat panel, as on the live site */
.nav-dropdown{position:absolute;top:100%;left:0;right:0;background:var(--white);box-shadow:0 24px 50px rgba(0,36,84,.12);opacity:0;visibility:hidden;pointer-events:none;transition:.22s;transform:translateY(10px)}
.nav-item.is-open .nav-dropdown{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
.nav-dropdown .dropdown-inner{max-width:1120px;width:calc(100% - 48px);margin:0 auto;padding:0}

/* Programs mega dropdown */
.nav-dropdown.mega .dropdown-inner{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:0}
.mega-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.nav-dropdown.events .mega-cards{grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.mega-card{min-width:0;display:flex;flex-direction:column;min-height:266px;padding:21px 16px 16px 20px;text-decoration:none;background:transparent;transition:background .25s}
.mega-card:hover{background:var(--accent)}
.mega-card .ph,.mega-card img{width:245px;max-width:100%;height:99px;object-fit:cover;border-radius:15px}
.mega-card-body{flex:1;padding:10px 0 0;display:flex;flex-direction:column}
.mega-card-body h4{margin:0;font-size:16px;font-weight:600;line-height:110%;color:var(--navy)}
.mega-card-body p{margin:0;padding-top:10px;font-size:12px;line-height:120%;color:var(--ink)}
.mega-card-body b{margin-top:auto;padding-top:12px;font-size:13px;font-weight:400;text-transform:lowercase;text-decoration:underline;color:var(--blue);letter-spacing:0;text-align:right}
.mega-aside{min-width:0;display:flex;flex-direction:column;align-self:stretch;justify-content:flex-end;gap:0;padding:27px 27px 0}
.mega-aside:hover{background:var(--accent)}
.aside-link-main{font-size:16px;font-weight:600;line-height:110%;color:var(--navy);text-decoration:none}
.aside-link-sub{font-size:13px;font-weight:400;text-decoration:underline;line-height:110%;color:var(--blue)}
.mega-cover{width:220px;max-width:100%;height:160px;margin-top:20px;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;border-radius:15px 15px 0 0;padding:16px;background:linear-gradient(140deg,var(--blue),var(--navy) 70%)}
.mega-cover strong{font-size:16px;line-height:1.05;color:var(--white)}
.mega-cover small{font-size:9px;letter-spacing:.14em;color:rgba(255,255,255,.75);text-transform:uppercase}

/* About dropdown - horizontal 3-cell strip with accent borders, text centered */
.nav-dropdown.list .dropdown-inner{display:flex;flex-direction:row;justify-content:center}
.nav-dropdown.list a{flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:30px 20px;font-size:16px;font-weight:600;line-height:110%;color:var(--navy);text-decoration:none;border-top:1px solid var(--accent);border-left:1px solid var(--accent)}
.nav-dropdown.list a:last-child{border-right:1px solid var(--accent)}
.nav-dropdown.list a:hover{background:var(--accent)}

.menu-toggle{display:none;background:none;border:0;color:var(--navy);font-size:26px;cursor:pointer;padding:6px}

/* ===== Gradient placeholder (used when no image is available) ===== */
.ph{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background:linear-gradient(135deg,#7fb0e8 0%,var(--blue) 34%,var(--navy) 72%,var(--navy-deep) 100%)}
.ph::before{content:"";position:absolute;inset:-30%;background:radial-gradient(circle at 22% 18%,rgba(255,255,255,.35),transparent 46%),radial-gradient(circle at 78% 82%,rgba(0,177,217,.5),transparent 42%);animation:phdrift 9s ease-in-out infinite alternate}
@keyframes phdrift{from{transform:translate3d(-2%,-1%,0) rotate(0)}to{transform:translate3d(2%,2%,0) rotate(4deg)}}

/* ===== Hero ===== */
/* The bottom padding keeps the overlapping quick-nav cards clear of the hero text.
   Paired with .quick-nav-grid's negative margin below — change one with the other. */
.hero{position:relative;min-height:80vh;display:flex;flex-direction:column;justify-content:flex-end;color:var(--white);background:var(--navy-deep) url('assets/img/Fallback.jpg') center/cover no-repeat;padding:0 0 70px;overflow:hidden}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,18,40,.58),rgba(1,18,40,.3) 55%,rgba(1,18,40,.82));z-index:1}
.hero::after{content:none}
.hero-content{position:relative;z-index:2;display:flex;align-items:flex-end;justify-content:space-between;gap:28px}
.hero h1{font-size:clamp(42px,5.4vw,55px);font-weight:700;line-height:1.1;letter-spacing:-.02em;color:var(--white);margin:0}
.hero-subtitle{font-size:clamp(22px,2.6vw,28px);font-weight:600;font-style:oblique;line-height:1.1;color:var(--white);margin:8px 0 0;padding-left:5px}

/* ===== Quick nav cards (Agenda / Participants / Press) — glass over the hero video ===== */
.quick-nav{position:relative;z-index:2;padding-bottom:20px}
/* Cards deliberately straddle the hero/white boundary, as in the original design. A
   translucent panel over that hard edge would show a seam (dark video above, white page
   below), so the glass fill stays near-opaque and the backdrop blur softens the join. */
.quick-nav-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:-60px}
.quick-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:32px 18px 28px;background:rgba(0,36,84,.9);-webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%);border:1px solid rgba(255,255,255,.28);border-radius:18px;box-shadow:0 18px 45px rgba(1,18,40,.3),inset 0 1px 0 rgba(255,255,255,.35);color:var(--white);text-decoration:none;transition:background .25s ease,border-color .25s ease,box-shadow .25s ease}
.quick-card:hover{background:rgba(0,36,84,.97);border-color:rgba(255,255,255,.5);box-shadow:0 22px 55px rgba(1,18,40,.4),inset 0 1px 0 rgba(255,255,255,.45)}
.quick-card:focus-visible{outline:2px solid var(--white);outline-offset:3px}
.quick-card .quick-icon{display:grid;place-items:center;color:var(--white)}
.quick-card .quick-icon svg{width:54px;height:54px}
.quick-label{font-family:'Poppins',sans-serif;font-size:22px;font-weight:700;line-height:1.1;color:var(--white);margin:0;text-align:center}

/* ===== Date / theme strip — dark blue glass panel on the white band =====
   Over a flat white section the backdrop blur is invisible (blurring a uniform colour
   returns that colour), so the glass reads through the blue tint, the white hairline
   and the inset highlight rather than through the blur itself. */
.date-strip{background:var(--white);padding:80px 0 100px}
.date-strip .ds-panel{background:rgba(0,36,84,.88);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);border:1px solid rgba(255,255,255,.28);border-radius:22px;box-shadow:0 24px 60px rgba(0,36,84,.28),inset 0 1px 0 rgba(255,255,255,.35);padding:56px 40px;text-align:center}
.date-strip .ds-box{width:100%;max-width:900px;margin:0 auto;padding:0;border:0;display:flex;flex-direction:column;align-items:center;gap:0}
.ds-date,.ds-theme,.ds-join,.ds-hashtag{font-family:'Poppins',sans-serif;color:var(--white);line-height:1.1;margin:0;text-align:center}
.date-strip .ds-date{display:block;background:none;border:0;border-radius:0;color:var(--white);font-size:19px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;line-height:1;padding:0}
.date-strip .ds-theme{margin-top:22px;color:var(--white);font-size:64px;font-weight:800;line-height:1.05;letter-spacing:-.02em}
.date-strip .ds-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;width:100%;margin-top:34px;padding-top:34px;border-top:1px solid rgba(255,255,255,.22)}
.date-strip .ds-join,.date-strip .ds-hashtag{background:none;border:0;border-radius:0;color:rgba(255,255,255,.78);font-size:19px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;line-height:1;padding:0}
.date-strip .ds-hashtag{text-transform:none}
@media(max-width:1024px){
  .date-strip .ds-panel{padding:44px 28px}
  .date-strip .ds-theme{font-size:48px}
}
@media(max-width:767px){
  .date-strip{padding:56px 0 70px}
  .date-strip .ds-panel{padding:32px 20px}
  .date-strip .ds-date{font-size:14px;letter-spacing:.16em}
  .date-strip .ds-theme{font-size:32px;margin-top:16px}
  .date-strip .ds-meta{margin-top:24px;padding-top:24px;gap:12px}
  .date-strip .ds-join,.date-strip .ds-hashtag{font-size:14px}
}
/* Engines without backdrop-filter: the translucent glass would render as a flat wash,
   so fall back to a more opaque fill that still holds up. Must stay after the rules
   above — equal specificity means source order decides. */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .quick-card{background:rgba(0,36,84,.96)}
  .date-strip .ds-panel{background:rgba(0,36,84,.94)}
}

/* ===== News ===== */
.news{background:var(--white)}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.news-card{display:flex;flex-direction:column;text-decoration:none;transition:transform .2s}
.news-card:hover{transform:translateY(-4px)}
.news-media{width:100%;aspect-ratio:3/2;border-radius:15px;overflow:hidden;background:var(--accent)}
.news-media img{width:100%;height:100%;object-fit:cover}
.news-meta{display:flex;align-items:center;gap:18px;color:var(--ink);font-size:14px;line-height:1.1;margin:16px 0 8px}
.news-meta .meta-item{display:inline-flex;align-items:center;gap:6px}
.news-meta svg{width:16px;height:16px;color:var(--ink)}
.news-card h3{margin:0;font-size:22px;font-weight:600;line-height:1.35;color:var(--navy)}
.news-card h3 a{color:var(--navy);text-decoration:none;transition:color .2s}
.news-card:hover h3 a{color:var(--blue)}
.news-card p{margin:10px 0 0;font-size:16px;line-height:1.4;color:var(--ink)}
.news-card .read-more{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-size:16px;font-weight:500;text-transform:lowercase;color:var(--blue);text-decoration:none}

/* ===== Numbers ===== */
.numbers-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.number-item{padding:56px 26px;border-right:1px solid var(--line)}
.number-item:last-child{border-right:0}
.num-value{font-family:'Poppins',sans-serif;font-size:75px;font-weight:700;line-height:1.1;color:var(--navy);display:block}
.num-label{font-family:'Poppins',sans-serif;font-size:30px;font-weight:600;line-height:1.1;color:var(--navy);display:block;margin-top:10px}

/* ===== Welcome / About ===== */
.about{background:var(--white);padding:0 0 100px}
.about-title{font-family:'Poppins',sans-serif;font-size:30px;font-weight:600;line-height:110%;color:var(--navy);margin:0 0 50px}
.about-card{background:#d2f3fc;border-radius:20px;padding:80px 100px 70px;display:flex;flex-direction:column}
.about-copy{color:var(--ink);font-size:16px;line-height:1.8}
.about-copy p{margin:0 0 18px}
.about-copy p:last-child{margin:0}
/* Sub-heading + list of past conferences. The list runs in as many 260px columns as
   fit, so it reads down each column (newest first) and falls back to one column on
   narrower cards. */
.about-sub{margin:28px 0 14px;font-family:'Poppins',sans-serif;font-size:18px;font-weight:600;line-height:1.2;color:var(--navy)}
.about-list{list-style:none;margin:0;padding:0;columns:260px;column-gap:34px;font-size:15px;line-height:1.5}
.about-list li{position:relative;padding-left:16px;margin:0 0 8px;break-inside:avoid}
.about-list li:last-child{margin-bottom:0}
.about-list li::before{content:"";position:absolute;left:0;top:.5em;width:5px;height:5px;border-radius:50%;background:var(--blue)}

/* ===== Report ===== */
.report{background:#550F0F;color:var(--white)}
.report-grid{display:grid;grid-template-columns:1.15fr .85fr;align-items:stretch;gap:70px}
.report-copy{display:flex;flex-direction:column;justify-content:center}
.report-copy h2{font-size:32px;font-weight:600;line-height:1.15;color:var(--white);margin:8px 0 0}
.report-tag{font-size:16px;font-weight:600;line-height:1.4;color:var(--white);margin:18px 0 0}
.report .eyebrow{color:var(--white)}
/* Runs the full width of the copy column (no cap), so the body text lines up
   with the right edge of the grid instead of stopping short of it. Once the
   grid collapses to one column at <=1024px the column becomes the full
   container, so the measure cap moves into that media query below. */
.report-lead{margin:12px 0 0;color:var(--white);font-size:16px;line-height:1.6}
.report-copy .btn{margin-top:28px}
/* Solid white CTA. The shared outline button is transparent with white text, which
   would not read as a call to action on the maroon panel — the fill is white here, so
   the label goes navy for contrast. */
.report .btn-outline{background:var(--white);border-color:var(--white);color:var(--navy)}
.report .btn-outline:hover{background:var(--accent);border-color:var(--accent);color:var(--navy)}
/* The cover is a flat image now (it used to be a CSS-built book). It is capped at its
   natural 388px width so it is never upscaled; the radius and shadow set it on the
   section background. */
.report-cover{display:flex;align-items:center;justify-content:center}
.report-cover img{display:block;width:100%;max-width:388px;height:auto;border-radius:10px;box-shadow:0 30px 70px rgba(0,0,0,.5)}

/* ===== Events & Programs cards ===== */
.events{background:var(--white)}
.events-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
.programs{background:var(--white)}
.programs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.wsf-card{display:flex;flex-direction:column;text-decoration:none;background:var(--white);border:1px solid var(--line);border-radius:15px;overflow:hidden;transition:border-color .2s,transform .2s}
.wsf-card:hover{border-color:var(--blue);transform:translateY(-4px)}
.wsf-card .card-media,.card-simple .card-media{width:100%;aspect-ratio:2.5/1}
.wsf-card .card-media img,.card-simple .card-media img{width:100%;height:100%;object-fit:cover}
.wsf-card-body{padding:24px}
.wsf-card-body h3{margin:0;font-size:22px;font-weight:600;line-height:1.15;color:var(--navy)}
.wsf-card-body p{margin:10px 0 0;font-size:16px;line-height:1.4;color:var(--ink)}
.wsf-card .read-more{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-size:16px;font-weight:500;text-transform:lowercase;color:var(--blue);text-decoration:none}

/* ===== Footer ===== */
.site-footer{background:var(--navy-deep);color:var(--white)}
.footer-inner{display:grid;grid-template-columns:3fr 2fr;gap:60px;padding:70px 0 52px}
.footer-news h2{color:var(--white);font-size:22px;font-weight:600;line-height:1.45;max-width:430px;margin:0 0 26px}
.newsletter-form{display:flex;gap:10px;max-width:540px}
.newsletter-form input{flex:1;min-width:0;padding:13px 18px;border:1px solid var(--white);border-radius:15px;background:transparent;color:var(--white);font-family:'Poppins',sans-serif;font-size:12px;line-height:1.4;outline:none}
.newsletter-form input::placeholder{color:var(--text-muted)}
.newsletter-form .btn{padding:13px 39px;font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.5px}
.footer-side{display:flex;flex-direction:column;align-items:flex-end;gap:24px}
.footer-link-row{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;font-family:'Poppins',sans-serif;font-size:15px;font-weight:500;line-height:1.4}
.footer-link-row a{color:var(--white);text-decoration:none}
.footer-link-row a:hover{color:var(--blue)}
.footer-link-row .sep{color:rgba(255,255,255,.4)}
.footer-social{display:flex;align-items:center;gap:18px}
.footer-social a{color:var(--white);font-size:18px;text-decoration:none;display:grid;place-items:center}
.footer-social a:hover{color:var(--blue)}
.footer-social svg{width:19px;height:19px;fill:var(--white)}
.footer-social a:hover svg{fill:var(--blue)}
.footer-bottom{border-top:1px solid var(--text-muted);padding:16px 0;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-family:'Poppins',sans-serif;font-size:12px;font-weight:400;line-height:1.4;color:var(--white)}
.footer-bottom a{color:var(--white);text-decoration:none}
.footer-bottom a:hover{color:var(--blue)}

/* ===== Inner pages ===== */
.page-hero{background:var(--navy-deep);color:var(--white);padding:148px 0 84px}
.page-hero .eyebrow{color:var(--text-muted)}
.page-hero .hero-date{margin:0;font-size:20px;font-weight:600;letter-spacing:.06em;color:var(--text-muted)}
.page-hero h1{font-size:clamp(40px,5.5vw,55px);font-weight:700;line-height:1.1;letter-spacing:-.02em;color:var(--white);margin:14px 0 0}
.content-area{background:var(--white)}
.archive-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.card-simple{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);border-radius:15px;padding:0;overflow:hidden;text-decoration:none;transition:border-color .2s}
.card-simple:hover{border-color:var(--blue)}
.card-simple-body{padding:22px}
.card-simple h2,.card-simple h3{font-size:22px;line-height:1.15;margin:0}
.card-simple p{color:var(--ink);font-size:16px;line-height:1.4;margin:8px 0 0}
.card-simple .news-meta{margin-bottom:12px}
.single-layout{display:grid;grid-template-columns:1.7fr .9fr;gap:70px;align-items:start}
.entry-content{max-width:820px;margin:auto;font-size:17px;line-height:1.8}
.entry-content h2{font-size:28px}
.entry-content h3{font-size:22px}
.meta-list{border-top:1px solid var(--line)}
.meta-row{display:flex;justify-content:space-between;gap:20px;padding:13px 0;border-bottom:1px solid var(--line);font-size:13px}
.meta-row span:first-child{color:var(--text-muted)}
.single-media{border-radius:15px;overflow:hidden;margin-bottom:24px}
.single-media img{width:100%}
.single-media .ph{display:block;width:100%;aspect-ratio:16/9}

/* ===== Agenda ===== */
.page-hero-meta{color:var(--text-muted);margin:18px 0 0;font-size:15px}
.agenda-intro{max-width:62ch;font-size:16px;line-height:1.7}

/* Breadcrumb: Home | WSF2026 | Agenda and Streaming */
.briefcrumb,.breadcrumb{border-bottom:1px solid var(--line)}
.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:18px 0;font-size:13px;letter-spacing:.06em;text-transform:uppercase}
.breadcrumb a{color:var(--navy);text-decoration:none;font-weight:600}
.breadcrumb a:hover{color:var(--blue)}
.breadcrumb-sep{color:var(--line)}
.breadcrumb-current{color:var(--text-muted);font-weight:600}

/* Day cards, mirroring the WSF agenda design */
.agenda-edition{padding:64px 0}
.agenda-edition+.agenda-edition{border-top:1px solid var(--line)}
.agenda-edition .section-heading>div{min-width:0}
.agenda-edition-meta{font-size:14px;color:var(--text-muted);white-space:nowrap;margin:0}
.agenda-days{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:22px;margin:8px 0 46px}
.agenda-day-card{position:relative;display:flex;flex-direction:column;gap:4px;text-decoration:none;padding:30px 26px 26px;border:1px solid var(--line);border-radius:15px;background:var(--white);overflow:hidden;transition:border-color .2s,transform .2s}
.agenda-day-card:hover{border-color:var(--blue);transform:scale(1.02)}
.agenda-day-num{position:absolute;top:-14px;right:10px;font-size:104px;line-height:1;font-weight:800;color:var(--accent);pointer-events:none;user-select:none}
.agenda-day-card-tbc{border-style:dashed}
.agenda-day-card-tbc .agenda-day-label{font-size:20px}
.agenda-day-label{position:relative;font-size:26px;font-weight:700;line-height:1.1;color:var(--navy);letter-spacing:-.02em}
.agenda-day-date{position:relative;font-size:16px;font-weight:500;color:var(--ink)}
.agenda-day-tag{position:relative;margin-top:8px;font-size:13px;font-weight:600;letter-spacing:.08em;color:var(--blue)}

.agenda-day{scroll-margin-top:120px}
.agenda-day+.agenda-day{margin-top:46px}
.agenda-day-heading{font-size:24px;font-weight:600;margin:0 0 6px;padding-bottom:12px;border-bottom:2px solid var(--navy)}
.agenda-list{list-style:none;margin:0;padding:0}
.agenda-item{display:grid;grid-template-columns:190px 1fr;gap:34px;padding:26px 0;border-bottom:1px solid var(--line)}
.agenda-when{display:flex;flex-direction:column;gap:2px}
.agenda-time{font-size:15px;font-weight:600;color:var(--navy)}
.agenda-body h4{font-size:21px;font-weight:600;line-height:1.25;margin:0}
.agenda-body h4 a{color:var(--navy);text-decoration:none}
.agenda-body h4 a:hover{color:var(--blue)}
.agenda-meta{margin:8px 0 0;font-size:14px;color:var(--ink)}
.agenda-speakers{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 10px}
.agenda-speakers li{font-size:13px;background:var(--accent);border:1px solid var(--line);border-radius:999px;padding:6px 14px}
.agenda-speakers li span{color:var(--text-muted)}

/* Programme list on /agenda/ (template-parts/agenda-sessions.php). The day
   cards and session rows reuse the classes above; these rules only add the
   pieces the archive did not need: the session-type label, the description
   body, and a quieter treatment for the breaks and meals so they do not read as
   panels.

   The ported breadcrumb bar (Elementor 6102cfef) carries 125px of bottom
   padding for the Agenda Grid that followed it on the live page. On /agenda/
   the grid is gone and the programme comes straight after, so that padding
   reads as a hollow band between the hero and "Detailed Agenda". Zero it here,
   scoped to this page so the single-agenda view keeps the original gap. The
   selector outranks the vendored rule (extra body class + .elementor-16528)
   rather than relying on load order. */
.page-template-templatespage-agenda-php .elementor-16528 .elementor-element.elementor-element-6102cfef{--padding-bottom:0}
.agenda-type{margin-top:6px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--blue)}
.agenda-desc{margin:12px 0 0;font-size:15px;line-height:1.75;color:var(--ink)}
.agenda-desc p{margin:0 0 10px}
.agenda-desc p:last-child{margin-bottom:0}
.agenda-item-meal .agenda-body h4,.agenda-item-break .agenda-body h4{font-weight:500;color:var(--ink)}

.agenda-sib-nav{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.agenda-sib{display:flex;flex-direction:column;gap:6px;text-decoration:none;padding:22px 26px;border:1px solid var(--line);border-radius:15px;background:var(--white);transition:border-color .2s}
.agenda-sib:hover{border-color:var(--blue)}
.agenda-sib small{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--text-muted)}
.agenda-sib span{font-size:19px;font-weight:600;color:var(--navy);line-height:1.2}
.agenda-sib-next{text-align:right;align-items:flex-end}

@media(max-width:900px){
  .agenda-item{grid-template-columns:1fr;gap:10px}
  .agenda-days{grid-template-columns:1fr;gap:14px}
  .agenda-day-num{font-size:78px}
  .agenda-sib-nav{grid-template-columns:1fr}
  .agenda-sib-next{text-align:left;align-items:flex-start}
}

/* ===== Responsive ===== */
@media(max-width:1024px){
  /* Hamburger button drawn with CSS bars; animates to an X while open. */
  .menu-toggle{display:block;position:relative;width:28px;height:24px;padding:0;font-size:0;background:linear-gradient(var(--navy),var(--navy)) center/100% 2px no-repeat;transition:background .25s}
  .menu-toggle::before,.menu-toggle::after{content:"";position:absolute;left:0;width:100%;height:2px;background:var(--navy);transition:top .25s .1s,transform .25s 0s}
  .menu-toggle::before{top:3px}
  .menu-toggle::after{top:19px}
  .menu-toggle[aria-expanded="true"]{background:none}
  .menu-toggle[aria-expanded="true"]::before{top:11px;transform:rotate(45deg);transition:top .25s 0s,transform .25s .1s}
  .menu-toggle[aria-expanded="true"]::after{top:11px;transform:rotate(-45deg);transition:top .25s 0s,transform .25s .1s}
  .primary-nav{position:absolute;top:100%;left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;background:var(--white);box-shadow:0 24px 40px rgba(0,36,84,.12);padding:8px 24px 20px}
  .primary-nav.is-open{display:flex;max-height:calc(100vh - var(--header-h));overflow:auto}
  /* Top-level rows follow the live n-menu: open rows, 16px/600, no separators. */
  .nav-link{width:100%;justify-content:space-between;padding:8px 0;font-size:16px;font-weight:600;color:var(--ink)}
  .nav-item{border-bottom:0}
  .nav-dropdown,.nav-dropdown.mega,.nav-dropdown.events,.nav-dropdown.list{position:static;width:100%;transform:none;opacity:1;visibility:visible;pointer-events:auto;box-shadow:none;border-radius:0;padding:0;display:none}
  .nav-item.is-open .nav-dropdown{display:block}
  .nav-item.is-open .nav-dropdown.list{display:block}
  .nav-dropdown .dropdown-inner{max-width:100%;width:100%;padding:0 0 20px;gap:0}
  /* At tablet the Program/Event cards wrap into two rows (2 up, see the
     min-width:768px block below); the About strip stays horizontal and only
     mobile (<=767) stacks everything. */
  /* Dropdown text is centered on tablet and mobile, READ MORE included. */
  .mega-card-body h4,.mega-card-body p,.mega-card-body b{text-align:center}
  .mega-aside{text-align:center}
  /* Card image placeholders and images are centered too, and the report
     cover below the links. */
  .mega-card .ph,.mega-card img{margin:0 auto}
  .mega-cover{margin:20px auto 0}
  .numbers-grid{grid-template-columns:repeat(2,1fr)}
  .number-item:nth-child(2n){border-right:0}
  .report-grid{grid-template-columns:1fr}
  /* Single column here, so the copy would otherwise stretch to the full
     container. Cap the measure to keep line lengths readable on tablet. */
  .report-lead{max-width:680px}
  .footer-inner{grid-template-columns:1fr;gap:40px}
  .footer-side{align-items:flex-start}
  .footer-link-row{justify-content:flex-start}
  .archive-grid{grid-template-columns:repeat(2,1fr)}
  .single-layout{grid-template-columns:1fr}
}
/* Tablet: the Programs dropdown (3 cards + Download WSF Report) fills a
   clean 2x2 grid - the report occupies the 4th cell instead of a separate
   right-hand column, so there is no empty cell. Events wraps into its own
   2x2 card grid. */
@media(max-width:1024px) and (min-width:768px){
  .nav-dropdown.mega .dropdown-inner{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 0}
  .nav-dropdown.mega .mega-cards{display:contents}
  .nav-dropdown.mega .mega-aside{align-items:center}
  .nav-dropdown.events .mega-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 0}
}
@media(min-width:768px){
  .about-card{width:min(930px,100%);margin:0 auto}
}
@media(max-width:767px){
  .container{width:calc(100% - 34px)}
  .section{padding:70px 0}
  .hero{padding-bottom:52px}
  .hero h1{font-size:40px}
  .hero-content{align-items:flex-start}
  /* Cards go horizontal on mobile. The grid overlaps the hero by half a chip so the
     first one straddles the boundary, matching the desktop arrangement. */
  .quick-nav-grid{grid-template-columns:1fr;gap:12px;margin-top:-30px}
  .quick-card{flex-direction:row;justify-content:flex-start;gap:14px;padding:14px 18px}
  .quick-card .quick-icon svg{width:30px;height:30px}
  .quick-label{font-size:18px;text-align:left}
  .news-grid,.programs-grid,.events-grid,.archive-grid{grid-template-columns:1fr}
  .numbers-grid{grid-template-columns:1fr 1fr}
  .number-item{padding:40px 18px}
  .num-value{font-size:52px}
  .num-label{font-size:20px}
  .section-heading{flex-direction:row}
  .mega-cards,.nav-dropdown.events .mega-cards{grid-template-columns:minmax(0,1fr)}
  .nav-dropdown.mega .dropdown-inner{grid-template-columns:minmax(0,1fr)}
  /* Mobile wraps the descriptor boxes, following the live site: full-width
     cards with 20/40 padding and 14px headings, the report aside below the
     cards as a full-width column with its cover. */
  .mega-card{padding:20px 40px}
  .mega-card-body h4{font-size:14px}
  /* The About strip stacks on mobile; the clean treatment is kept (no left
     vertical line, separators between rows) so the border bug the desktop
     strip would inherit never appears. */
  .nav-dropdown.list .dropdown-inner{display:flex;flex-direction:column;align-items:flex-start;gap:0;border-top:1px solid var(--accent)}
  .nav-dropdown.list a{border:0;padding:20px 0;width:100%;justify-content:center;text-align:center}
  .nav-dropdown.list a:last-child{border-right:0}
  .nav-dropdown.list a + a{border-top:1px solid var(--accent)}
  .about{padding:0 0 50px}
  .about-title{margin:0 0 30px}
  .about-card{padding:15px}
  .newsletter-form{flex-direction:column;margin:0 auto}
  .newsletter-form .btn{width:100%}
  /* Mobile: the footer stacks into a single column, so everything in it is
     centred - heading, form, link row, socials and the bottom bar. */
  .footer-inner{text-align:center}
  .footer-news h2{margin:0 auto 26px}
  .footer-side{align-items:center}
  .footer-link-row{justify-content:center;text-align:center}
  .footer-social{justify-content:center}
  .footer-bottom{flex-direction:column;align-items:center;text-align:center}
  .brand img{width:230px}
}

/* ===== About pages (static About menu) ===== */
.about-page .about-prose{font-size:17px;line-height:1.8}
.about-page .about-prose p{margin:0 0 22px}
.about-page .about-prose p:last-child{margin-bottom:0}
.about-page .about-prose a{color:var(--blue)}
.about-page .page-hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#3f6bb0 0%,var(--navy) 50%,var(--navy-deep) 100%);text-align:center}
.about-page .page-hero::before{content:"";position:absolute;inset:-30%;background:radial-gradient(circle at 22% 18%,rgba(255,255,255,.16),transparent 46%),radial-gradient(circle at 78% 82%,rgba(0,177,217,.32),transparent 42%);animation:phdrift 9s ease-in-out infinite alternate}
.about-page .page-hero .container{position:relative;z-index:1}
.about-page .page-hero h1{font-size:clamp(48px,7vw,84px);margin-bottom:60px}
.about-heading-center{text-align:center}
.about-heading{font-size:28px;font-weight:600;line-height:1.15;color:var(--navy);margin:0 0 26px}
.about-heading-sub{margin:52px 0 24px}
.about-page .section-navy{background:var(--navy)}
.about-page .section-navy .about-heading{color:var(--white)}
.about-page .section-navy .about-prose{color:rgba(255,255,255,.95)}
.about-page .section-navy .about-prose a{color:var(--white);text-decoration:underline}
.about-page .section-navy .member-card{box-shadow:0 22px 48px rgba(0,8,24,.5)}
.about-media{position:relative;overflow:hidden;border-radius:20px;margin:44px 0}
.about-media .ph{display:block;width:100%;aspect-ratio:16/9}
.about-media img{display:block;width:100%;height:auto}
.about-page .about-media-lead{position:relative;z-index:2;border-radius:24px;box-shadow:0 34px 80px rgba(0,18,40,.35);margin:-200px 0 44px}
.about-page .about-media-lead .ph{aspect-ratio:21/9}
.member-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:40px}
.member-card{background:var(--white);border:1px solid var(--line);border-radius:15px;padding:26px 24px}
.member-card h3{margin:0 0 12px;font-size:18px;font-weight:600;line-height:1.2;color:var(--navy)}
.member-card p{margin:0 0 2px;font-size:14px;line-height:1.55;color:var(--ink)}
.member-card p:last-child{margin-bottom:0}
.member-card .member-web{margin-top:12px}
.member-card .member-web a{color:var(--blue);text-decoration:none}
.member-card .member-web a:hover{text-decoration:underline}
.conf-list{list-style:none;margin:8px 0 0;padding:0;border-top:1px solid var(--line)}
.conf-list li{display:flex;justify-content:space-between;gap:20px;padding:16px 0;border-bottom:1px solid var(--line);font-size:16px}
.conf-list .conf-year{color:var(--navy);font-weight:600}
.conf-list .conf-place{color:var(--ink);text-align:right}
@media(max-width:1024px){
  .member-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .about-page .page-hero h1{margin-bottom:40px}
}
@media(max-width:767px){
  .member-grid{grid-template-columns:1fr}
  .about-page .page-hero h1{margin-bottom:15px}
  .about-page .about-media .ph{aspect-ratio:4/3}
  .about-page .about-media-lead{margin-top:-120px;border-radius:18px}
  .conf-list li{flex-direction:column;gap:2px}
  .conf-list .conf-place{text-align:left}
}

/* ===== Updates article (single post) ===== */
/* Mirrors the About page's lead-image treatment: the hero keeps the standard
   navy band, and the article image is pulled up over it so the image and the
   title block overlap. Scoped to `.update-page` so the agenda-session pages,
   which also use `.single-media`, are untouched. */
.update-page .page-hero{padding-bottom:170px;text-align:center}
.update-page .single-media{position:relative;z-index:2;border-radius:24px;box-shadow:0 34px 80px rgba(0,18,40,.35);margin:-200px 0 44px}
.update-page .single-media img{display:block;width:100%;height:auto}
.update-page .single-media .ph{aspect-ratio:21/9}
@media(max-width:767px){
  .update-page .page-hero{padding-bottom:130px}
  .update-page .single-media{margin-top:-120px;border-radius:18px}
  .update-page .single-media .ph{aspect-ratio:4/3}
}

/* ===== Participants page ===== */
.participants-page .page-hero{padding:120px 0 64px;text-align:center}
.participants-lede{max-width:660px;margin:18px auto 0;color:var(--text-muted);font-size:16px}

/* Country filter tabs */
.participant-filter{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 0 44px}
.participant-filter button{font-family:'Poppins',sans-serif;font-size:12px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--navy);background:var(--white);border:1px solid var(--line);border-radius:999px;padding:9px 18px;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.participant-filter button:hover{border-color:var(--blue);color:var(--blue)}
.participant-filter button.is-active{background:var(--navy);border-color:var(--navy);color:var(--white)}

/* Grid of people */
.participants-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px 26px}
.participant-card{min-width:0}
.participant-card.is-hidden{display:none}
.participant-trigger{display:flex;flex-direction:column;width:100%;padding:0;border:0;background:none;font-family:inherit;text-align:center;cursor:pointer}
.participant-photo{display:block;position:relative;width:100%;aspect-ratio:1/1;border-radius:15px;overflow:hidden;background:var(--accent)}
.participant-photo img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.participant-trigger:hover .participant-photo img{transform:scale(1.04)}
.participant-ph{width:100%;height:100%;border-radius:0}
.participant-name{display:block;margin:16px 0 0;font-size:17px;font-weight:600;line-height:1.25;color:var(--navy);transition:color .2s}
.participant-trigger:hover .participant-name{color:var(--blue)}
.participant-role{display:block;margin:6px 0 0;font-size:13.5px;line-height:1.5;color:var(--ink)}
.participants-empty{display:none;text-align:center;color:var(--ink);padding:30px 0}
.participants-empty.is-visible{display:block}

/* Bio modal */
.participant-modal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:24px}
.participant-modal[hidden]{display:none}
.participant-modal-backdrop{position:absolute;inset:0;background:rgba(1,18,40,.72)}
.participant-modal-dialog{position:relative;z-index:1;width:min(560px,100%);overflow:hidden;background:var(--white);border-radius:20px;box-shadow:0 34px 80px rgba(0,18,40,.45);animation:participant-modal-in .25s ease}
@keyframes participant-modal-in{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.participant-modal-scroll{max-height:min(90vh,900px);overflow:auto;padding:40px 40px 36px}
.participant-modal-close{position:absolute;top:14px;right:14px;display:flex;align-items:center;justify-content:center;width:38px;height:38px;border:0;border-radius:50%;background:var(--accent);color:var(--navy);font-size:24px;line-height:1;cursor:pointer;transition:background .2s,color .2s;z-index:2}
.participant-modal-close:hover{background:var(--navy);color:var(--white)}
.participant-modal-media{width:75%;aspect-ratio:1/1;margin:0 auto 24px;border-radius:16px;overflow:hidden;background:var(--accent)}
.participant-modal-media img{display:block;width:100%;height:100%;object-fit:cover}
.participant-modal-ph{width:100%;height:100%;border-radius:0}
.participant-modal-name{margin:0;font-size:24px;font-weight:600;line-height:1.2;color:var(--navy);text-align:center}
.participant-modal-role{margin:8px 0 0;font-size:14px;line-height:1.55;color:var(--ink);text-align:center}
.participant-modal-bio{margin:22px 0 0;padding:22px 0 0;border-top:1px solid var(--line);font-size:15px;line-height:1.8;color:var(--ink)}
.participant-modal-bio p{margin:0 0 12px}
.participant-modal-bio p:last-child{margin-bottom:0}
.participant-modal-bio:empty{display:none}
body.participant-modal-open{overflow:hidden}

@media(max-width:1024px){
  .participants-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:767px){
  .participants-page .page-hero{padding:96px 0 52px}
  .participants-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 16px}
  .participant-modal-scroll{padding:32px 22px 28px}
  .participant-modal-media{width:100%}
}

/* ===== Legal & utility pages (Privacy Policy, Contact) ===== */
.legal-page .page-hero,.contact-page .page-hero{padding:148px 0 72px}
.legal-meta,.contact-meta{margin:18px 0 0;font-size:15px;line-height:1.6;color:var(--text-muted)}
.legal-prose{font-size:17px;line-height:1.8}
.legal-prose p{margin:0 0 22px}
.legal-prose h2{font-size:23px;font-weight:600;line-height:1.2;color:var(--navy);margin:52px 0 16px}
.legal-prose ul{list-style:none;margin:0 0 22px;padding:0}
.legal-prose ul li{position:relative;margin:0 0 10px;padding-left:20px}
.legal-prose ul li:last-child{margin-bottom:0}
.legal-prose ul li::before{content:"";position:absolute;left:2px;top:.68em;width:5px;height:5px;border-radius:50%;background:var(--blue)}
.legal-prose a{color:var(--blue)}
.legal-prose p:last-child{margin-bottom:0}
.legal-block{font-style:normal;font-size:17px;line-height:1.8;color:var(--ink);margin:0 0 22px}
.contact-lead{max-width:820px;margin:0 0 44px;font-size:17px;line-height:1.8}
.contact-heading{font-size:23px;font-weight:600;line-height:1.2;color:var(--navy);margin:52px 0 20px}
.contact-heading:first-of-type{margin-top:0}
.contact-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.contact-card{background:var(--white);border:1px solid var(--line);border-radius:15px;padding:26px 24px;box-shadow:0 18px 40px rgba(0,18,40,.07)}
.contact-card h3{margin:0 0 8px;font-size:18px;font-weight:600;line-height:1.2;color:var(--navy)}
.contact-card .contact-role{margin:0 0 14px;font-size:14px;line-height:1.55;color:var(--ink)}
.contact-card a{font-size:14px;color:var(--blue);text-decoration:none;overflow-wrap:break-word}
.contact-card a:hover{text-decoration:underline}
.contact-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:56px 0 0}
.contact-block{font-style:normal;font-size:16px;line-height:1.8;color:var(--ink);margin:0}
.contact-block a{color:var(--blue)}

@media(max-width:1024px){
  .contact-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:767px){
  .legal-page .page-hero,.contact-page .page-hero{padding:112px 0 56px}
  .legal-prose,.legal-block,.contact-lead{font-size:16px}
  .legal-prose h2,.contact-heading{font-size:20px;margin:40px 0 14px}
  .contact-grid,.contact-cols{grid-template-columns:1fr;gap:16px}
  .contact-cols{margin-top:44px}
}