/*
Theme Name: TLS Theme
Theme URI: https://thelaurasultan.com/
Author: Laura Sultan
Description: Clean, direct theme for The Laura Sultan — digital transparency mentoring, workshops and policy.
Version: 3.6.0
License: GNU GPL v2 or later
Text Domain: tls-theme
*/

:root{
  --paper:#F5F5F3;
  --panel:#E7E9ED;
  --ink:#16203A;
  --ink-deep:#101832;
  --blue:#5C688C;
  --blue-deep:#343C5A;
  --blue-soft:#DCE2EE;
  --taupe:#A8A597;
  --slate:#5B6376;
  --rule:#D2D2D2;
  --flag:#E0D5A8;
  --measure:66ch;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:"Newsreader",Georgia,serif;
  font-size:1.09375rem;line-height:1.65;font-optical-sizing:auto;
}
/* wider container, tighter gutters */
.wrap{max-width:84rem;margin:0 auto;padding:0 1.25rem;}
@media (min-width:60rem){ .wrap{padding:0 2rem;} }
@media (min-width:90rem){ .wrap{padding:0 2.5rem;} }
p{max-width:var(--measure);}
img{max-width:100%;height:auto;}

/* full-bleed bands break out of .wrap */
.band{
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  padding-left:calc(50vw - 50% + 1.25rem);
  padding-right:calc(50vw - 50% + 1.25rem);
  padding-top:3.25rem;padding-bottom:3.25rem;
  border-top:none;
}
@media (min-width:60rem){ .band{padding-left:calc(50vw - 50% + 2rem);padding-right:calc(50vw - 50% + 2rem);} }
.band-soft{background:var(--panel);}
.band-blue{background:var(--blue-soft);}
.band-dark{background:var(--ink-deep);color:#EEEDEA;}
.band-dark h2,.band-dark h3{color:#fff;}
.band-dark p{color:#C7CBD4;}
.band-dark a{color:#fff;border-bottom-color:var(--taupe);}
.band-dark .btn{background:#fff;color:var(--ink-deep);border-color:#fff;}
.band-dark .btn:hover{background:var(--blue);border-color:var(--blue);color:#fff;}

/* header */
.masthead{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:1rem 2rem;padding:1.6rem 0 1.15rem;border-bottom:3px solid var(--blue);}
.wordmark{font-size:1.0625rem;font-weight:600;margin:0;color:var(--blue-deep);}
.wordmark a{border:none;color:var(--blue-deep);}
.wordmark .rmark{display:inline;font-size:0.5em;vertical-align:super;font-weight:400;letter-spacing:0;line-height:0;color:var(--slate);}
.wordmark .tagline{display:block;font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.8125rem;font-weight:400;color:var(--slate);}
.nav ul{display:flex;flex-wrap:wrap;gap:1.25rem;list-style:none;margin:0;padding:0;font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.875rem;}
.nav a{color:var(--slate);border-bottom:2px solid transparent;padding-bottom:3px;}
.nav a:hover{color:var(--ink);}
.nav .current-menu-item a,.nav .current_page_item a{color:var(--ink);border-bottom-color:var(--blue);font-weight:500;}

/* typography */
h1{font-size:clamp(2.1rem,5.2vw,3.9rem);line-height:1.05;font-weight:500;letter-spacing:-0.02em;margin:0 0 1.25rem;max-width:20ch;color:var(--blue-deep);}
h2{font-size:clamp(1.5rem,2.4vw,2rem);font-weight:500;margin:0 0 0.5rem;letter-spacing:-0.015em;color:var(--blue-deep);}
section h2::before{content:"";display:block;width:3rem;height:3px;background:var(--blue);margin-bottom:0.95rem;}
.band-dark h2::before{background:var(--taupe);}
.start h3::before,.hero h1::before{content:none;}
h3{font-size:1.25rem;font-weight:500;margin:0 0 0.25rem;line-height:1.3;color:var(--blue-deep);}
.eyebrow{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.75rem;letter-spacing:0.09em;text-transform:uppercase;color:var(--blue);margin:0 0 0.7rem;font-weight:600;}
.standfirst{max-width:var(--measure);font-size:1.1875rem;color:var(--slate);}
.note{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.875rem;color:var(--slate);max-width:var(--measure);}
.lede{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.9375rem;color:var(--slate);margin:0 0 2rem;max-width:var(--measure);}
a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--blue);}
a:hover,a:focus-visible{color:var(--blue);}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;}

.page{padding:2.75rem 0 3.5rem;}
.block{padding:3rem 0;border-top:1px solid var(--rule);}
.block:first-of-type{border-top:none;padding-top:0.5rem;}
.band + .block{border-top:none;}

/* buttons */
.btn{display:inline-block;font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.9375rem;background:var(--blue);color:#fff;padding:0.72rem 1.5rem;border:1px solid var(--blue);margin-top:1.25rem;transition:background .15s ease,border-color .15s ease;}
.btn:hover{background:var(--blue-deep);border-color:var(--blue-deep);color:#fff;}
.btn.ghost{background:none;color:var(--ink);border-color:var(--blue);}
.btn.ghost:hover{background:var(--blue);border-color:var(--blue);color:#fff;}

/* hero */
.hero{display:grid;gap:2.25rem;padding:3rem 0 3.25rem;align-items:center;}
@media (min-width:56rem){ .hero{grid-template-columns:1.5fr 1fr;gap:4rem;} }
.portrait{width:100%;aspect-ratio:4/5;object-fit:cover;display:block;border-bottom:4px solid var(--blue);}
.portrait-ph{display:flex;align-items:center;justify-content:center;text-align:center;aspect-ratio:4/5;background:var(--panel);border-bottom:4px solid var(--blue);font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.8125rem;color:var(--slate);padding:1.5rem;}
.cap{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.8125rem;color:var(--slate);margin:0.7rem 0 0;}

/* current activity strip */
.now{margin:1.75rem 0 0;padding:1.1rem 0 0;border-top:1px solid var(--rule);max-width:var(--measure);}
.now p{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.75rem;letter-spacing:0.09em;text-transform:uppercase;color:var(--blue);font-weight:600;margin:0 0 0.6rem;}
.now ul{list-style:none;margin:0;padding:0;font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.9375rem;}
.now li{padding-left:1.1rem;position:relative;margin-bottom:0.3rem;color:var(--slate);}
.now li::before{content:"";position:absolute;left:0;top:0.68em;width:6px;height:6px;background:var(--blue);border-radius:50%;}

/* letter */
.letter{margin:0;max-width:48ch;background:#fff;border-left:4px solid var(--blue);padding:1.5rem 1.75rem;box-shadow:0 1px 3px rgba(15,23,42,.05);}
.letter p{margin:0;font-size:1.0625rem;line-height:1.8;}
.letter footer{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.8125rem;color:var(--slate);margin-top:0.9rem;}
.redact{position:relative;display:inline-block;}
.redact::after{content:"";position:absolute;inset:-1px -3px;background:var(--ink);transform-origin:right center;animation:lift 900ms cubic-bezier(.4,0,.2,1) 1.2s forwards;}
@keyframes lift{to{transform:scaleX(0);}}
@media (prefers-reduced-motion:reduce){.redact::after{animation:none;transform:scaleX(0);}}

/* letter + proof side by side on wide screens */
.letter-row{display:grid;gap:2.5rem;align-items:center;}
@media (min-width:64rem){ .letter-row{grid-template-columns:1fr 1fr;gap:4rem;} }

/* proof */
.proof{display:grid;gap:1.5rem;}
@media (min-width:44rem){ .proof{grid-template-columns:repeat(3,1fr);gap:2rem;} }
.proof div{border-top:2px solid var(--blue);padding-top:0.9rem;}
.proof strong{display:block;font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.8125rem;font-weight:600;letter-spacing:0.03em;text-transform:uppercase;color:var(--blue);margin-bottom:0.4rem;}
.proof p{margin:0;font-size:0.9375rem;line-height:1.6;}
.band-dark .proof div{border-top-color:var(--taupe);}
.band-dark .proof strong{color:var(--taupe);}

/* lists */
ul.marks{margin:1rem 0 0;padding:0;list-style:none;max-width:var(--measure);}
ul.marks li{padding-left:1.15rem;position:relative;margin-bottom:0.4rem;}
ul.marks li::before{content:"";position:absolute;left:0;top:0.82em;width:6px;height:2px;background:var(--blue);}

/* two-column feature grid */
.cols{display:grid;gap:2rem;align-items:start;}
@media (min-width:52rem){ .cols{grid-template-columns:repeat(2,1fr);gap:2.5rem 3rem;} }
/* ruled: a hairline anchors each column, as in the dark band */
.cols > div{border-top:2px solid var(--blue);padding-top:1rem;}
/* labels: headings become tracked sans labels for scannable sub-points */
.cols.labels h3{
  font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.8125rem;font-weight:600;
  letter-spacing:0.05em;text-transform:uppercase;color:var(--blue);margin:0 0 0.5rem;
}
.cols.labels p{font-size:0.9375rem;line-height:1.62;margin:0;}

/* packages */
.packages{display:grid;gap:1.25rem;margin-top:1.75rem;}
@media (min-width:52rem){ .packages{grid-template-columns:repeat(3,1fr);} }
.pkg{border:1px solid var(--rule);padding:1.6rem;background:#fff;transition:border-color .15s ease,transform .15s ease;}
.pkg:hover{border-color:var(--blue);transform:translateY(-2px);}
.pkg.feature{border-color:var(--blue);border-width:2px;position:relative;}
.pkg.feature::before{content:"Recommended";position:absolute;top:-0.7rem;left:1.5rem;background:var(--blue);color:#fff;font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.6875rem;letter-spacing:0.06em;text-transform:uppercase;padding:0.2rem 0.6rem;}
.pkg-name{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.75rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--blue);margin:0 0 0.4rem;}
.pkg-price{font-size:1.6rem;font-weight:600;margin:0 0 0.3rem;letter-spacing:-0.02em;color:var(--ink);}
.pkg-hours{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.875rem;color:var(--slate);margin:0;}
.pkg ul{margin:0.9rem 0 0;padding:0;list-style:none;}
.pkg ul li{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.875rem;padding-left:1rem;position:relative;margin-bottom:0.3rem;}
.pkg ul li::before{content:"";position:absolute;left:0;top:0.75em;width:5px;height:1px;background:var(--taupe);}

/* start-here callout */
.start{background:var(--blue);color:#fff;padding:1.9rem 2rem;margin:2.25rem 0 0;max-width:52rem;}
.start p.eyebrow{color:#D3D7E4;margin-bottom:0.5rem;}
.start h3{color:#fff;font-size:1.5rem;margin:0 0 0.5rem;}
.start p{color:#E2E4EC;margin:0;max-width:52ch;}
.start .btn{background:#fff;color:var(--blue-deep);border-color:#fff;margin-top:1.1rem;}
.start .btn:hover{background:var(--ink);border-color:var(--ink);color:#fff;}

/* single-session entry tier */
.entry{display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:baseline;justify-content:space-between;
  border:1px solid var(--rule);border-left:4px solid var(--taupe);background:#fff;padding:1.4rem 1.6rem;margin-top:1.75rem;}
.entry h3{margin:0 0 0.3rem;}
.entry p{margin:0;font-size:0.9375rem;color:var(--slate);}
.entry .entry-price{font-size:1.4rem;font-weight:600;color:var(--ink);white-space:nowrap;}
.entry .entry-price small{display:block;font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.8125rem;font-weight:400;color:var(--slate);}

/* numbered steps */
.steps{display:grid;gap:1.75rem;margin-top:1.75rem;counter-reset:step;}
@media (min-width:52rem){ .steps{grid-template-columns:repeat(3,1fr);gap:2.5rem;} }
.steps div{counter-increment:step;border-top:2px solid var(--blue);padding-top:1rem;}
.steps div::before{content:counter(step,decimal-leading-zero);display:block;font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.8125rem;font-weight:600;color:var(--blue);margin-bottom:0.4rem;}
.steps h3{font-size:1.0625rem;margin-bottom:0.3rem;}
.steps p{margin:0;font-size:0.9375rem;line-height:1.6;}

/* honest qualifier */
.fit{border-left:4px solid var(--taupe);background:#fff;padding:1.4rem 1.6rem;max-width:46rem;margin-top:1.75rem;}
.fit h3{margin-top:0;font-size:1.0625rem;}
.fit p{margin:0;font-size:0.9375rem;}

/* session */
.session{display:grid;gap:0.6rem 2.25rem;padding:2rem 0;border-top:1px solid var(--rule);}
.session:first-of-type{border-top:none;padding-top:0.5rem;}
@media (min-width:52rem){ .session{grid-template-columns:8rem 1fr;} }
.session-tag{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.8125rem;color:var(--blue);font-weight:600;padding-top:0.35rem;letter-spacing:0.02em;}

.flag{background:var(--flag);padding:0 0.3em;}

/* papers */
.paper{border-top:1px solid var(--rule);padding:1.75rem 0;}
.paper:first-of-type{border-top:none;padding-top:0.5rem;}
.paper-status{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.75rem;letter-spacing:0.07em;text-transform:uppercase;color:var(--blue);margin:0 0 0.35rem;font-weight:600;}

/* signup */
.signup{background:#fff;padding:2rem;max-width:46rem;margin-top:2rem;border-left:4px solid var(--blue);box-shadow:0 1px 3px rgba(15,23,42,.05);}
.signup h3{margin-top:0;}
.signup form{display:flex;flex-wrap:wrap;gap:0.7rem;margin-top:0.9rem;}
.signup input{flex:1 1 15rem;font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.9375rem;padding:0.68rem 0.85rem;border:1px solid var(--rule);background:var(--paper);color:var(--ink);}
.signup button{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.9375rem;background:var(--blue);color:#fff;border:none;padding:0.68rem 1.3rem;cursor:pointer;}
.signup button:hover{background:var(--blue-deep);}

/* contact */
.contact-list{list-style:none;margin:0;padding:0;display:grid;gap:1.25rem;font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.9375rem;}
@media (min-width:44rem){ .contact-list{grid-template-columns:repeat(3,1fr);} }
.contact-list li{border-top:2px solid var(--blue);padding-top:0.8rem;}
.contact-list span{display:block;color:var(--slate);font-size:0.8125rem;margin-bottom:0.2rem;}

.site-footer{border-top:1px solid var(--rule);padding:1.75rem 0 2.5rem;font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:0.8125rem;color:var(--slate);}
.site-footer ul{display:flex;flex-wrap:wrap;gap:1.25rem;list-style:none;margin:0 0 0.75rem;padding:0;}