/*
Theme Name: ESRA
Theme URI: https://esra-europe.eu/
Description: Block theme for the European Seagrass Restoration Alliance. Broadsheet design system: Source Serif 4, paper ground, cyan + magenta spot colours.
Version: 1.1.5
Requires at least: 6.5
Requires PHP: 8.0
License: GPL-2.0-or-later
Text Domain: esra
*/

/* Base */
body{-webkit-font-smoothing:antialiased;overflow-x:clip}
:where(a,button,summary):focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}
.esra-kicker{font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--color-accent-700);margin:0}
.esra-kicker.is-magenta{color:var(--color-accent-2-700)}

/* Header */
.esra-header{position:sticky;top:0;z-index:40;isolation:isolate}
.esra-header::before{content:"";position:absolute;inset:0;z-index:-1;background:color-mix(in srgb,var(--color-bg) 92%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.esra-nav .wp-block-navigation__submenu-container{border:0!important;box-shadow:var(--shadow-md);border-radius:var(--radius-md);padding:10px!important;min-width:240px!important}
.esra-nav .wp-block-navigation-item__content:hover{color:var(--color-accent-700)}
.esra-nav .esra-nav-cta>a{background:var(--color-accent);color:#fff!important;padding:10px 20px!important;border-radius:var(--radius-md)}
.esra-nav .esra-nav-cta>a:hover{background:var(--color-accent-600)}
/* Mobile menu (overlay) */
.esra-nav .wp-block-navigation__responsive-container-open,.esra-nav .wp-block-navigation__responsive-container-close{width:44px;height:44px;align-items:center;justify-content:center}
.esra-nav .wp-block-navigation__responsive-container-close{display:flex}
/* Burger only on tablet and mobile (< 1024px); full menu on desktop */
@media (max-width:1023px){
  .esra-nav .wp-block-navigation__responsive-container-open{display:flex!important}
  .esra-nav .wp-block-navigation__responsive-container:not(.is-menu-open){display:none!important}
}
@media (min-width:1024px){
  .esra-nav .wp-block-navigation__responsive-container-open{display:none!important}
}
.esra-nav .wp-block-navigation__responsive-container-open svg,.esra-nav .wp-block-navigation__responsive-container-close svg{width:30px;height:30px}
.wp-block-navigation__responsive-container.is-menu-open{background:var(--color-bg)!important;color:var(--color-text)!important;padding:20px clamp(20px,5vw,40px) 40px!important}
.is-menu-open .wp-block-navigation__responsive-container-content{padding-top:56px!important;align-items:stretch!important}
.is-menu-open .wp-block-navigation__container{gap:0!important;align-items:stretch!important;width:100%}
.is-menu-open .wp-block-navigation-item{font-size:24px;width:100%;align-items:stretch!important}
.is-menu-open .wp-block-navigation-item>.wp-block-navigation-item__content{padding:14px 0!important;display:flex;justify-content:space-between;align-items:center;width:100%}
.is-menu-open .wp-block-navigation-submenu>.wp-block-navigation-item__content::after{content:"+";font-size:26px;line-height:1;color:var(--color-accent-700)}
.is-menu-open .wp-block-navigation-submenu.esra-open>.wp-block-navigation-item__content::after{content:"–"}
.is-menu-open .wp-block-navigation__submenu-icon{display:none!important}
.is-menu-open .wp-block-navigation__submenu-container{display:none!important;box-shadow:none!important;border:0!important;background:transparent!important;min-width:0!important;padding:0 0 14px!important;gap:0!important}
.is-menu-open .esra-open>.wp-block-navigation__submenu-container{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));column-gap:20px}
.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item{font-size:18px}
.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content{padding:9px 0!important}
.is-menu-open .esra-nav-all>a{font-style:italic;color:var(--color-accent-700)!important}
.is-menu-open .esra-nav-cta{margin-top:20px}
.is-menu-open .esra-nav-cta>a{justify-content:center!important;padding:14px 20px!important}
body.has-modal-open{overflow:hidden}

/* Designed pages (Custom HTML sections) */
.page-template-page-design .wp-block-post-content>*,.home .wp-block-post-content>*{margin-block-start:0}
.wp-block-post-content>:first-child{margin-block-start:0}
.esra-split__main p+p{margin-top:1em}

/* Converted pages */
.wp-block-columns{align-items:flex-start}
.wp-block-group.is-layout-grid>.wp-block-group{display:flex;flex-direction:column;gap:10px}
.wp-block-group.is-layout-grid p{margin:0}
.wp-block-post-content .wp-block-image img{border-radius:var(--radius-md)}
.wp-block-post-content>section>.wp-block-heading{margin-top:8px}
.wp-block-site-logo img{mix-blend-mode:multiply}
@media (max-width:600px){.esra-header .wp-block-site-logo img{width:180px!important}}

/* Home */
.esra-home-hero img{width:100%;aspect-ratio:16/7;min-height:280px;object-fit:cover;border-radius:var(--radius-md)}
.esra-timeline>.wp-block-group{display:flex;flex-direction:column;gap:10px}
.esra-timeline p{margin:0}

/* Stats */
.esra-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr));gap:clamp(20px,2.4vw,36px);margin:clamp(24px,3vw,40px) 0}
.esra-stat{display:flex;flex-direction:column;gap:6px}
.esra-stat b{font-weight:600;font-size:clamp(34px,3.4vw,52px);line-height:1;letter-spacing:-.02em;color:var(--color-accent-700)}
.esra-stat span{font-size:16px;line-height:1.4}

/* Two-column body with sticky aside */
.esra-split{display:flex;flex-wrap:wrap;gap:clamp(32px,5vw,88px);align-items:flex-start}
.esra-split__main{flex:2.2 1 520px;min-width:0}
.esra-split__main p{max-width:66ch}
.esra-split__aside{flex:1 1 280px;min-width:0;display:flex;flex-direction:column;gap:28px}
@media (min-width:1100px){.esra-split__aside{position:sticky;top:110px}}
.esra-aside-block{display:flex;flex-direction:column;gap:6px;font-size:16px;line-height:1.45;overflow-wrap:anywhere}
.esra-aside-block>span{display:block}
.esra-aside-block .esra-kicker{color:var(--color-accent-2-700);margin-bottom:4px}
.esra-links{display:flex;flex-wrap:wrap;gap:6px 16px}

/* Country projects */
.esra-projects{display:flex;flex-direction:column;gap:clamp(96px,12vw,176px)}
.esra-project{display:flex;flex-direction:column;gap:clamp(28px,3.4vw,48px);scroll-margin-top:110px}
.esra-project__head{display:flex;flex-wrap:wrap;gap:clamp(16px,3vw,48px);align-items:baseline}
.esra-project__num{font-weight:600;font-size:clamp(40px,4vw,60px);line-height:1;color:var(--color-accent-700);font-variant-numeric:tabular-nums}
.esra-project__head h2{margin:0;font-size:clamp(34px,4vw,60px);line-height:1.02;letter-spacing:-.025em;text-wrap:balance}
.esra-project__sub{margin:6px 0 0;font-style:italic;font-size:20px}
.esra-hero{margin:0}
.esra-hero>img{width:100%;aspect-ratio:21/8;min-height:220px;object-fit:cover;border-radius:var(--radius-md);display:block;background:var(--color-accent-100)}
.esra-hero figcaption{margin-top:8px;font-size:14px;font-style:italic}
.esra-map iframe{width:100%;aspect-ratio:21/9;min-height:280px;border:0;border-radius:var(--radius-md);display:block}
.esra-videos{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:16px}
.esra-video{aspect-ratio:16/9;border-radius:var(--radius-md);overflow:hidden;background:var(--color-text);position:relative}
.esra-video button{all:unset;cursor:pointer;position:absolute;inset:0;display:grid;place-items:center;background-size:cover;background-position:center}
.esra-video button span{width:68px;height:68px;border-radius:50%;background:var(--color-accent);color:#fff;display:grid;place-items:center;font-size:24px;padding-left:4px;box-sizing:border-box}
.esra-video iframe{width:100%;height:100%;border:0;display:block}
.esra-empty{font-size:20px;line-height:1.6;max-width:56ch}

/* Card grids */
.esra-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:clamp(24px,2.6vw,40px)}
.esra-grid.is-wide{grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr))}
.esra-card{display:flex;flex-direction:column;gap:12px;text-decoration:none;color:var(--color-text)}
.esra-card:hover{color:var(--color-accent-700)}
.esra-card__img{aspect-ratio:3/4;border-radius:var(--radius-md);overflow:hidden;background:var(--color-accent-100)}
.is-wide .esra-card__img{aspect-ratio:4/3}
.esra-card__img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.esra-card:hover .esra-card__img img{transform:scale(1.04)}
.esra-card__title{font-weight:600;font-size:clamp(24px,2.2vw,30px);line-height:1.1}
.esra-card__title.is-latin{font-style:italic}

/* Working group */
.is-latin .wp-block-post-title{font-style:italic}
.esra-person{display:flex;flex-direction:column;gap:10px}
.esra-person img{width:100%;aspect-ratio:3/2;object-fit:cover;object-position:center top;border-radius:var(--radius-md);display:block;background:var(--color-accent-100)}
.esra-person__name{display:block;font-weight:600;font-size:24px;line-height:1.15}
.esra-person p{margin:0;font-size:16px;line-height:1.55}
.esra-meetings{display:flex;flex-direction:column;gap:14px}
.esra-meeting{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 24px;padding:10px 0;font-size:17px}
.esra-meeting time{color:var(--color-accent-700);font-variant-numeric:tabular-nums}
.esra-meeting.is-next{font-size:20px}
.esra-meetings details summary{cursor:pointer;color:var(--color-accent-700);font-size:17px}
.esra-workshop{display:flex;flex-wrap:wrap;gap:clamp(20px,3vw,48px);align-items:center;margin:0}
.esra-workshop img{flex:1.4 1 420px;min-width:0;aspect-ratio:3/2;object-fit:cover;border-radius:var(--radius-md)}
.esra-workshop figcaption{flex:1 1 280px;display:flex;flex-direction:column;gap:14px;font-size:clamp(20px,1.8vw,24px);line-height:1.45;font-style:italic}
.esra-strip{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px}
.esra-strip img{flex:none;width:clamp(240px,26vw,380px);aspect-ratio:3/4;object-fit:cover;border-radius:var(--radius-md);scroll-snap-align:start}
.esra-objectives{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:20px;counter-reset:obj}
.esra-objectives li{counter-increment:obj;background:var(--color-surface,#fff);border-radius:var(--radius-md);padding:clamp(20px,2.2vw,32px);box-shadow:var(--shadow-sm);font-size:17px;line-height:1.6}
.esra-objectives li::before{content:counter(obj,decimal-leading-zero);display:block;font-weight:600;font-size:clamp(40px,3.6vw,56px);line-height:.9;color:var(--color-accent-700);margin-bottom:14px}

/* Expandable bios (core/details) */
.wp-block-details summary{cursor:pointer;color:var(--color-accent-700)}

/* Dates list pattern */
.esra-dates{display:flex;flex-direction:column;gap:24px}
.esra-date{display:grid!important;grid-template-columns:clamp(84px,9vw,112px) minmax(0,1fr);gap:clamp(16px,2vw,28px);align-items:baseline}
.esra-date__day{font-weight:600;font-size:clamp(36px,3.4vw,48px);line-height:1;color:var(--color-accent-700);margin:0}
.esra-date__month{font-size:14px;letter-spacing:.12em;text-transform:uppercase;margin:6px 0 0}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Photos print plain in WordPress (no colour-separation effect) */
.cmyk .print,.cmyk .print:hover,.cmyk img{filter:none!important}
.cmyk img:first-child{opacity:1!important;position:relative}
.cmyk img+img,.cmyk::after,.cmyk::before{display:none!important}
.halftone::after,.halftone::before{display:none!important}

/* Country header */
.esra-country-head{display:flex;flex-wrap:wrap-reverse;gap:clamp(32px,5vw,80px);align-items:center;margin-bottom:clamp(56px,7vw,104px)}
.esra-country-head__text{flex:1.2 1 420px;min-width:0;display:flex;flex-direction:column;gap:20px}
.esra-country-head h1{margin:0;font-size:clamp(56px,9vw,148px);line-height:.98;letter-spacing:-.04em}
.esra-country-head__flag{flex:1 1 320px;max-width:520px;min-width:0;margin:0}
.esra-country-head__flag img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--radius-md);display:block;background:var(--color-accent-100)}
.esra-tags{display:flex;flex-wrap:wrap;gap:8px}
.esra-tags a{font-size:15px;padding:6px 12px;text-decoration:none}

/* Working group coordinators (full-width row) */
.esra-split__aside:not(:has(*)){display:none}
.esra-coords{margin-top:clamp(72px,9vw,120px)}
.esra-coords h2{margin:0 0 clamp(24px,3vw,40px);font-size:clamp(26px,2.6vw,38px)}
.esra-coords__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr));gap:clamp(28px,3vw,48px)}
.esra-coord{display:flex;flex-wrap:wrap;gap:clamp(16px,2vw,28px);align-items:flex-start}
.esra-coord img{flex:0 0 clamp(140px,14vw,200px);width:clamp(140px,14vw,200px);aspect-ratio:1/1;object-fit:cover;border-radius:var(--radius-md);background:var(--color-accent-100)}
.esra-coord__text{flex:1 1 240px;min-width:0;display:flex;flex-direction:column;gap:8px}
.esra-coord__text p{margin:0;font-size:16px;line-height:1.55}

/* Working Group body text (blocks) */
.esra-split__main .wp-block-post-content>*+*{margin-block-start:18px}
.esra-split__main .wp-block-post-content>.wp-block-heading:not(:first-child){margin-block-start:clamp(56px,7vw,96px)}
.esra-split__main .wp-block-post-content>.wp-block-heading{font-size:clamp(26px,2.6vw,38px);line-height:1.1;margin-block-end:4px}
.esra-split__main .wp-block-post-content>p{max-width:66ch;line-height:1.65;text-wrap:pretty}
.esra-split__main .wp-block-post-content>p.has-small-font-size{font-size:15px;line-height:1.55}
.esra-split__main .wp-block-post-content>.wp-block-list:not(.esra-objectives){max-width:66ch;list-style:none;padding:0;display:flex;flex-direction:column;gap:12px}
.esra-split__main .wp-block-list:not(.esra-objectives)>li{position:relative;padding-left:26px;font-size:17px;line-height:1.55}
.esra-split__main .wp-block-list:not(.esra-objectives)>li::before{content:"";position:absolute;left:4px;top:.6em;width:8px;height:8px;border-radius:50%;background:var(--color-accent)}
.esra-split__main .wp-block-gallery.has-nested-images{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:14px!important;max-width:1000px;margin-block-start:28px}
.esra-split__main .wp-block-gallery.has-nested-images figure.wp-block-image{width:auto!important;margin:0!important;flex:none!important}
.esra-split__main .wp-block-gallery img,.esra-split__main .wp-block-post-content>.wp-block-image img{width:100%;height:auto!important;aspect-ratio:3/2;object-fit:cover;border-radius:var(--radius-md)}
.esra-split__main .wp-block-post-content>.wp-block-image{max-width:760px;margin-block-start:28px}
.esra-coord__text .esra-person__name+a{margin-top:2px}

@media (prefers-reduced-motion:no-preference){[data-anim="title"],[data-anim="rest"],.esra-anim-title,.esra-anim-rest{opacity:0;animation:esra-show 0s 6s forwards}}@keyframes esra-show{to{opacity:1}}

/* Project body (country pages): keep text and images on the same column */
.esra-project .esra-split__main>*+*{margin-block-start:18px}
.esra-project .esra-split__main>.wp-block-heading{font-size:clamp(24px,2.2vw,30px);line-height:1.15;margin-block-end:0}
.esra-project .esra-split__main>.wp-block-heading:not(:first-child){margin-block-start:clamp(36px,4vw,56px)}
.esra-project .esra-split__main>p{max-width:68ch;line-height:1.65;text-wrap:pretty}
.esra-project .esra-split__main>.wp-block-image,.esra-project .esra-split__main>.wp-block-table,.esra-project .esra-split__main>.wp-block-gallery{max-width:68ch;margin-block-start:clamp(24px,3vw,36px)}
.esra-project .esra-split__main>.wp-block-image img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:var(--radius-md);display:block}
.esra-project .esra-split__main>.wp-block-image figcaption{margin-top:10px;font-size:15px;line-height:1.5;font-style:italic}
.esra-project .esra-split__main>.wp-block-gallery.has-nested-images{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:12px!important}
.esra-project .esra-split__main>.wp-block-gallery figure.wp-block-image{width:auto!important;margin:0!important}
.esra-project .esra-split__main>.wp-block-gallery img{aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius-md)}

/* WordPress emoji images (e.g. 📸 in photo credits) stay inline at text size */
img.emoji,.wp-block-image img.emoji,figcaption img.emoji{display:inline!important;width:1em!important;height:1em!important;min-height:0!important;aspect-ratio:auto!important;margin:0 .1em!important;vertical-align:-0.1em!important;border-radius:0!important;object-fit:contain!important;box-shadow:none!important;background:none!important}

/* WPForms: match the ESRA design */
.wpforms-container.wpforms-container{margin:0;max-width:640px;font-family:var(--font-body)}
.wpforms-container .wpforms-field{padding:0 0 22px!important}
.wpforms-container .wpforms-field-label{font-family:var(--font-body)!important;font-size:15px!important;font-weight:600!important;letter-spacing:0.02em;color:var(--color-text)!important;margin-bottom:8px!important}
.wpforms-container .wpforms-required-label{color:var(--color-accent-700)!important}
.wpforms-container input[type=text],.wpforms-container input[type=email],.wpforms-container input[type=tel],.wpforms-container input[type=url],.wpforms-container input[type=number],.wpforms-container select,.wpforms-container textarea{width:100%!important;max-width:100%!important;min-height:48px;padding:12px 14px!important;font:inherit!important;font-size:17px!important;color:var(--color-text)!important;background:var(--color-bg)!important;border:1px solid var(--color-neutral-400,#9a9590)!important;border-radius:var(--radius-sm,2px)!important;box-shadow:none!important;box-sizing:border-box}
.wpforms-container textarea{min-height:160px}
.wpforms-container input:focus,.wpforms-container select:focus,.wpforms-container textarea:focus{outline:2px solid var(--color-accent)!important;outline-offset:1px;border-color:var(--color-accent)!important}
.wpforms-container .wpforms-field-sublabel,.wpforms-container .wpforms-field-description{font-size:14px!important;color:var(--color-text)!important;opacity:.8}
.wpforms-container .wpforms-submit-container{padding:8px 0 0!important}
.wpforms-container button[type=submit],.wpforms-container .wpforms-submit{min-height:48px!important;padding:0 28px!important;font-family:var(--font-body)!important;font-size:17px!important;font-weight:400!important;color:var(--color-bg)!important;background:var(--color-accent)!important;border:0!important;border-radius:var(--radius-sm,2px)!important;cursor:pointer;box-shadow:none!important}
.wpforms-container button[type=submit]:hover,.wpforms-container .wpforms-submit:hover{background:var(--color-accent-600)!important}
.wpforms-container label.wpforms-error,.wpforms-container em.wpforms-error{color:#b3261e!important;font-size:14px!important}
.wpforms-confirmation-container-full{background:var(--color-accent-100)!important;border:0!important;color:var(--color-text)!important;padding:20px 24px!important;font-size:18px}
