/*
Theme Name:   Zurita Lopez Lab
Description:  Child theme of Kadence for the Zurita Lopez Lab website. Requires the free Kadence theme and the "Zurita Lopez Lab — Site Features" plugin.
Author:       Tamarisk & Co.
Template:     kadence
Version:      1.2.1
Requires at least: 6.5
Requires PHP: 7.4
License:      GPL-3.0-or-later
Text Domain:  zurita-lab-child
*/

/* ==========================================================================
   1. Design tokens (edit colors here)
   ========================================================================== */
:root{
	--zl-paper:#FBFAF6;
	--zl-ink:#1B2233;
	--zl-ink-soft:#4A5265;
	--zl-line:#DDD9CF;
	--zl-brick:#A6262E;
	--zl-brick-deep:#7E1A21;
	--zl-moss:#3E6F63;
	--zl-pale:#F1EDE2;
	--zl-header:#A6262E;
	--zl-serif:"Newsreader",Georgia,"Times New Roman",serif;
	--zl-sans:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
	--zl-width:1120px;

	/* Map onto Kadence's global palette so Kadence-styled elements match. */
	--global-palette1:var(--zl-brick);
	--global-palette2:var(--zl-brick-deep);
	--global-palette3:var(--zl-ink);
	--global-palette4:var(--zl-ink);
	--global-palette5:var(--zl-ink-soft);
	--global-palette6:#6B7180;
	--global-palette7:#E7E2D6;
	--global-palette8:var(--zl-paper);
	--global-palette9:#FFFFFF;
	--global-body-font-family:var(--zl-sans);
	--global-heading-font-family:var(--zl-serif);

	/* Kadence's container = our 1120px content column + 1.25rem side padding,
	   so the site title, page content and footer share one left edge. */
	--global-content-width:calc(var(--zl-width) + 2.5rem);
	--global-content-edge-padding:1.25rem;
	--global-content-boxed-padding:2rem;
}
#masthead .site-container,
.site-footer .site-container{max-width:calc(var(--zl-width) + 2.5rem);padding-left:1.25rem;padding-right:1.25rem}

/* ==========================================================================
   2. Base typography
   ========================================================================== */
body{background:var(--zl-paper);color:var(--zl-ink);font-family:var(--zl-sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,.entry-title{font-family:var(--zl-serif);font-weight:500;line-height:1.12;letter-spacing:-.01em;color:var(--zl-ink)}
a{color:var(--zl-brick);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--zl-brick-deep)}
:focus-visible{outline:3px solid var(--zl-moss);outline-offset:3px}

/* ==========================================================================
   3. Header (Kadence header builder markup)
   ========================================================================== */
#masthead .site-main-header-wrap .site-header-row-container-inner,
#masthead .site-header-row-container-inner{background:var(--zl-header)}
#masthead .site-branding a.brand,
#masthead .site-branding a.brand:hover{color:#fff;text-decoration:none}
#masthead .site-branding .site-title{font-family:var(--zl-sans);font-size:1.3rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff;line-height:1.1;margin:0}
#masthead .site-branding .site-description,
#masthead .site-branding .site-title-wrap .site-description{display:block;font-family:var(--zl-sans);font-size:.78rem;font-weight:500;letter-spacing:.01em;text-transform:none;color:rgba(255,255,255,.82);margin:.2rem 0 0}
#masthead .header-navigation .header-menu-container > ul > li.menu-item > a{color:#fff;font-family:var(--zl-sans);font-weight:500;font-size:.95rem}
#masthead .header-navigation .header-menu-container > ul > li.menu-item > a:hover,
#masthead .header-navigation .header-menu-container > ul > li.menu-item-type-post_type.current-menu-item > a{color:#fff;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:6px}
#masthead .mobile-toggle-open-container .menu-toggle-open,
#masthead .mobile-toggle-open-container .menu-toggle-open:hover{color:#fff;background:transparent}
#mobile-drawer .drawer-inner{background:var(--zl-header)}
#mobile-drawer .drawer-header .drawer-toggle{color:#fff}
#mobile-drawer .mobile-navigation ul li > a,
#mobile-drawer .mobile-navigation ul li > .drawer-nav-drop-wrap{color:#fff;font-family:var(--zl-sans);font-size:1.05rem;border-color:rgba(255,255,255,.18)}
#mobile-drawer .mobile-navigation ul li.menu-item-type-post_type.current-menu-item > a{text-decoration:underline;text-underline-offset:5px}

/* ==========================================================================
   4. Footer: the plugin prints the contact block; Kadence's bottom row
      shows the copyright line.
   ========================================================================== */
.site-footer .site-footer-row-container-inner{background:var(--zl-paper);color:var(--zl-ink-soft);font-size:.85rem}
.site-footer .site-bottom-footer-wrap{border-top:1px solid var(--zl-line)}
.zl-footer .zl-footer-inner{max-width:calc(var(--zl-width) + 2.5rem);padding-left:1.25rem;padding-right:1.25rem}

/* ==========================================================================
   5. Full-width section pages (Home, Research, Publications, Team, News,
      Lab Portal). The plugin adds body.zl-layout to these pages.
   ========================================================================== */
.zl-layout .entry-hero,
.zl-layout .entry-header{display:none}
.zl-layout .content-area{margin-top:0;margin-bottom:0}
.zl-layout .content-container.site-container,
.zl-layout .site-container.content-container,
.zl-layout #primary .content-container{max-width:none !important;padding-left:0 !important;padding-right:0 !important;margin-left:0;margin-right:0;width:100%}
.zl-layout .content-wrap,
.zl-layout #main{width:100%}
.zl-layout .entry-content-wrap{padding:0 !important}
.zl-layout .content-bg,
.zl-layout .entry.content-bg{background:transparent;box-shadow:none;border-radius:0}
.zl-layout .entry-content-wrap{padding:0}
.zl-layout .entry-content{margin:0}

.entry-content .zl-section,
.zl-layout .entry-content .zl-section.alignfull,
.zl-layout .entry-content-wrap .entry-content .alignfull.zl-section{
	box-sizing:border-box;width:auto !important;max-width:none !important;margin:0 !important;left:auto !important;right:auto !important;
	padding:5.5rem max(1.25rem, calc((100% - var(--zl-width)) / 2));
	border-top:1px solid var(--zl-line);
}
.entry-content .zl-section:first-child{border-top:0}
.zl-section > *,
.zl-section > .wp-block-group__inner-container > *,
.zl-section .wp-block-column > *{margin-top:0;margin-bottom:0}
.zl-section > * + *,
.zl-section > .wp-block-group__inner-container > * + *,
.zl-section .wp-block-column > * + *,
.zl-section .wp-block-group > * + *,
.zl-section .wp-block-group > .wp-block-group__inner-container > * + *{margin-top:1rem}
:where(.zl-section) p{max-width:64ch}
:where(.zl-section) h1{font-size:clamp(2.4rem,4.6vw,3.6rem);font-weight:400}
:where(.zl-section) h2{font-size:clamp(1.9rem,3.6vw,2.7rem);margin-bottom:.25rem}
:where(.zl-section) h3{font-size:1.45rem}
.zl-section .wp-block-columns{gap:3.5rem;margin:0}
.zl-section .wp-block-buttons{margin-top:2rem;gap:1rem}

/* Buttons */
.wp-block-button__link,
.wp-element-button{background:var(--zl-brick);color:#fff;border:1.5px solid var(--zl-brick);border-radius:3px;padding:.75rem 1.35rem;font-family:var(--zl-sans);font-weight:600;font-size:.95rem;text-decoration:none}
.wp-block-button__link:hover,
.wp-element-button:hover{background:var(--zl-brick-deep);border-color:var(--zl-brick-deep);color:#fff}
.wp-block-button.is-style-outline > .wp-block-button__link{background:transparent;color:var(--zl-brick);border:1.5px solid var(--zl-brick)}
.wp-block-button.is-style-outline > .wp-block-button__link:hover{background:var(--zl-brick);color:#fff}

/* Shared bits */
.zl-eyebrow{font-size:.8rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--zl-moss)}
.zl-lede{font-size:1.15rem;color:var(--zl-ink-soft)}
.zl-section .zl-small,.zl-small{font-size:.9rem;color:var(--zl-ink-soft)}
.zl-figure{background:#fff;border:1px solid var(--zl-line);padding:1.25rem;border-radius:4px}
.zl-figure img{display:block;margin:0 auto}
.zl-figure figcaption{font-size:.85rem;color:var(--zl-ink-soft);margin:.9rem 0 0;line-height:1.45;text-align:left}
.zl-figure figcaption strong{color:var(--zl-ink)}
.zl-photo img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:4px;display:block}
.zl-section .zl-photo{margin:0}

/* Home: hero */
.zl-hero{padding-top:5rem !important;padding-bottom:4rem !important}
.zl-hero h1.zl-display{font-size:clamp(2.6rem,5.6vw,4.6rem);font-weight:400;margin-bottom:1.5rem}
.zl-hero h1.zl-display em{font-style:italic}
.zl-hero .zl-lede{font-size:1.2rem;max-width:52ch}

/* Home: pit crew */
.zl-pit-grid{gap:4rem !important}
.zl-pit-item{padding:1.35rem 0;border-bottom:1px solid var(--zl-line)}
.zl-section .wp-block-column > .zl-pit-item + .zl-pit-item{margin-top:0}
.zl-pit-item:first-of-type{border-top:1px solid var(--zl-line);margin-top:2rem !important}
.zl-pit-item h3{color:var(--zl-brick);margin:0}
.zl-pit-item .zl-kicker{color:var(--zl-ink-soft);font-size:.85rem;font-weight:500;margin-top:.15rem !important}
.zl-pit-item p:last-child{font-size:1rem;margin-top:.6rem !important}

/* Home: news + join */
.zl-section-head,
.zl-section-head > .wp-block-group__inner-container{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:.5rem 1rem;width:100%}
.zl-section-head > *,
.zl-section-head > .wp-block-group__inner-container > *{margin:0 !important}
.zl-section-head a{font-weight:600;text-decoration:none}
.zl-join{background:var(--zl-pale)}
.zl-join-grid{align-items:center}
.zl-join .zl-card{background:var(--zl-paper);border:1px solid var(--zl-line);border-radius:4px;padding:2rem 2.25rem}
.zl-join .zl-card h3{font-size:1.35rem}
.zl-join .zl-card ul{padding-left:1.1rem}
.zl-join .zl-card li{padding:.3rem 0}

/* Inner pages: intro + sub-navigation */
.zl-intro{padding-bottom:3rem !important}
.zl-subnav{display:flex;flex-wrap:wrap;gap:.6rem;max-width:none !important;margin-top:2rem !important}
.zl-subnav a{display:inline-block;padding:.45rem .95rem;border:1px solid var(--zl-line);border-radius:999px;text-decoration:none;color:var(--zl-ink);font-size:.9rem;font-weight:500}
.zl-subnav a:hover{border-color:var(--zl-brick);color:var(--zl-brick)}

/* Research */
.zl-aims{list-style:none;padding:0;margin-top:1.5rem;border-top:1px solid var(--zl-line);counter-reset:aim}
.zl-aims li{counter-increment:aim;display:grid;grid-template-columns:2.2rem 1fr;gap:.5rem;padding:1rem 0;border-bottom:1px solid var(--zl-line);font-size:1rem;margin:0}
.zl-aims li::before{content:counter(aim);font-family:var(--zl-serif);font-size:1.5rem;color:var(--zl-moss);line-height:1}
.zl-plainlist,.zl-funding{list-style:none;padding:0;border-top:1px solid var(--zl-line)}
.zl-plainlist li,.zl-funding li{padding:.85rem 0;border-bottom:1px solid var(--zl-line);font-size:.97rem;margin:0}
.zl-funding li strong{display:block;font-weight:600}
.zl-funding li em{font-style:normal;color:var(--zl-ink-soft);font-size:.9rem}

/* Publications */
.zl-pub-list .zl-year{font-size:1.5rem;color:var(--zl-moss);margin-top:2.5rem !important}
.zl-pub-list > .zl-year:first-child,
.zl-pub-list > .wp-block-group__inner-container > .zl-year:first-child{margin-top:0 !important}
/* Team dropdown (Alumni) */
#masthead .header-navigation .sub-menu{background:var(--zl-header)}
#masthead .header-navigation .sub-menu li a{color:#fff}
#masthead .header-navigation .sub-menu li a:hover{text-decoration:underline;text-underline-offset:5px}
#masthead .header-navigation .header-menu-container > ul > li.current-menu-parent > a{color:#fff;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:6px}
.zl-pubs{list-style:none;padding:0;margin-top:.75rem !important;border-top:1px solid var(--zl-line)}
.zl-pubs li{padding:1.1rem 0;border-bottom:1px solid var(--zl-line);font-size:.98rem;line-height:1.55;margin:0}
.zl-pubs mark{font-weight:600}

/* Team: PI */
.zl-pi-grid{gap:3rem !important}
.zl-role{color:var(--zl-ink-soft)}

@media (max-width: 781px){
	.entry-content .zl-section,
	.zl-layout .entry-content .zl-section.alignfull{padding-top:3.5rem;padding-bottom:3.5rem}
	.zl-hero{padding-top:3rem !important;padding-bottom:2.5rem !important}
	.zl-section .wp-block-columns{gap:2rem}
	.zl-pit-grid{gap:2rem !important}
	.zl-pit .zl-photo img{aspect-ratio:4/3;object-position:50% 45%}
	.zl-pi .zl-photo{max-width:240px}
}
