/* ===== gailendavid.com, direction C "Modern Profile" =====
     Bright white, one typeface (Manrope) in bold and regular weights, rounded photos and soft colour cards.
     Each piece of work keeps its colour: sage Jetiquette, rose Aluminum Lady, brass First Flight Out, turquoise AFA and press.
     Sections are separated by space alone, no rules or dividers. */
  :root{
    --ink:#10181F; --text:#2E3A44; --gray:#4A5560; --soft:#F1F4F6; --line:#E3E8EC; --white:#FFFFFF;
    --blue:#0F93BC; --blue-deep:#0A6F91; --blue-tint:#EAF5F9;
    --sage-deep:#4C7962; --sage-tint:#EEF6F1; --rose-deep:#945C4A; --rose-tint:#F8EFEB; --brass-deep:#86713F; --brass-tint:#F6F1E4;
    --font:'Manrope','Helvetica Neue',Arial,sans-serif;
    --wrap:1180px; --r-lg:28px; --r-md:20px; --r-sm:14px;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth;scroll-padding-top:84px}
  @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
  body{background:var(--white);color:var(--ink);font-family:var(--font);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
  ::selection{background:var(--blue);color:#fff}
  a{color:inherit}
  img{max-width:100%;display:block}
  :focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:6px}
  .wrap{max-width:var(--wrap);margin:0 auto;padding:0 40px}
  @media(max-width:640px){.wrap{padding:0 20px}}
  .c-etq{--accent-deep:var(--sage-deep);--tint:var(--sage-tint)}
  .c-sat{--accent-deep:var(--rose-deep);--tint:var(--rose-tint)}
  .c-his{--accent-deep:var(--brass-deep);--tint:var(--brass-tint)}
  .c-med{--accent-deep:var(--blue-deep);--tint:var(--blue-tint)}

  /* ---------- header ---------- */
  header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(10px)}
  .nav-inner{max-width:var(--wrap);margin:0 auto;padding:18px 40px;display:flex;align-items:center;justify-content:space-between;gap:20px}
  .monogram{font-weight:800;font-size:1.2rem;text-decoration:none;color:var(--ink);letter-spacing:-.01em}
  nav.main{display:flex;align-items:center;gap:28px}
  nav.main a{font-size:.92rem;font-weight:600;color:var(--gray);text-decoration:none}
  nav.main a:hover{color:var(--ink)}
  nav.main a.nav-cta{background:var(--ink);color:#fff;padding:11px 20px;border-radius:999px}
  nav.main a.nav-cta:hover{background:var(--blue-deep)}
  .menu-btn{display:none;width:44px;height:44px;border:0;background:none;cursor:pointer;position:relative}
  .menu-btn span{position:absolute;left:11px;right:11px;height:2px;border-radius:2px;background:var(--ink);transition:transform .25s,top .25s}
  .menu-btn span:first-child{top:17px}.menu-btn span:last-child{top:25px}
  header.menu-open .menu-btn span:first-child{top:21px;transform:rotate(45deg)}
  header.menu-open .menu-btn span:last-child{top:21px;transform:rotate(-45deg)}
  @media(max-width:860px){
    .nav-inner{padding:12px 20px}
    .menu-btn{display:block}
    nav.main{display:none;position:absolute;top:100%;left:12px;right:12px;flex-direction:column;align-items:stretch;gap:2px;background:#fff;border-radius:var(--r-md);box-shadow:0 20px 40px -20px rgba(16,24,31,.35);padding:10px}
    header.menu-open nav.main{display:flex}
    nav.main a{padding:13px 14px;border-radius:12px;font-size:1rem;color:var(--ink)}
    nav.main a.nav-cta{text-align:center;margin-top:6px}
  }

  /* ---------- hero ---------- */
  .hero{padding:40px 0 0}
  .hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:56px;align-items:center}
  .pill{display:inline-flex;align-items:center;gap:8px;background:var(--blue-tint);color:var(--blue-deep);font-size:.85rem;font-weight:700;padding:8px 14px;border-radius:999px}
  .hero h1{margin-top:22px;font-weight:800;font-size:clamp(2.7rem,6vw,4.8rem);line-height:1.02;letter-spacing:-.03em;text-wrap:balance}
  .hero .intro-line{margin-top:26px;font-size:1.22rem;line-height:1.6;color:var(--text);max-width:34rem}
  .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
  .btn{display:inline-flex;align-items:center;justify-content:center;font-family:var(--font);font-weight:700;font-size:1rem;text-decoration:none;padding:16px 26px;border-radius:var(--r-sm);border:0;cursor:pointer;transition:background .2s}
  .btn-primary{background:var(--blue);color:#fff}
  .btn-primary:hover{background:var(--blue-deep)}
  .btn-soft{background:var(--soft);color:var(--ink)}
  .btn-soft:hover{background:var(--line)}
  .btn-dark{background:var(--ink);color:#fff}
  .btn-dark:hover{background:var(--blue-deep)}
  .hero-portrait{margin:0;height:640px;border-radius:32px;overflow:hidden;background:var(--soft)}
  .hero-portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
  .hero-portrait figcaption{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  @media(max-width:900px){
    .hero{padding-top:12px}
    .hero-grid{grid-template-columns:1fr;gap:32px}
    .hero-portrait{order:-1;height:min(70vh,520px);border-radius:var(--r-lg)}
  }

  /* ---------- sections ---------- */
  section{padding:112px 0 0}
  section.last{padding-bottom:112px}
  @media(max-width:640px){section{padding-top:80px}section.last{padding-bottom:80px}}
  h2{font-weight:800;font-size:clamp(2rem,3.6vw,2.75rem);line-height:1.1;letter-spacing:-.02em;max-width:22em;text-wrap:balance}
  .sub{margin-top:14px;font-size:1.12rem;line-height:1.6;color:var(--gray);max-width:44rem}
  h3.mini{font-weight:800;font-size:1.5rem;letter-spacing:-.01em;margin:72px 0 0}
  .mini-sub{margin-top:8px;color:var(--gray);font-size:1rem}
  .lede{font-size:1.08rem;line-height:1.75;color:var(--text);max-width:40rem}
  .lede+.lede{margin-top:1.1em}
  .lede a{color:var(--blue-deep);font-weight:600}

  /* ---------- about ---------- */
  .about-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
  @media(max-width:900px){.about-grid{grid-template-columns:1fr;gap:36px}}
  .about-photo img{width:100%;height:auto;border-radius:var(--r-lg)}
  .about-photo figcaption{margin-top:12px;font-size:.88rem;color:var(--gray)}
  .about-text h2{margin-bottom:22px}
  .facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:56px}
  @media(max-width:760px){.facts{grid-template-columns:repeat(2,minmax(0,1fr))}}
  .fact{background:var(--soft);border-radius:var(--r-md);padding:22px 22px 20px}
  .fact .n{font-weight:800;font-size:2rem;line-height:1;color:var(--blue-deep);letter-spacing:-.02em}
  .fact .l{margin-top:8px;font-size:.92rem;color:var(--gray);line-height:1.4}
  .quote{margin-top:28px;background:var(--blue-tint);border-radius:var(--r-md);padding:26px 28px}
  .quote p{font-weight:700;font-size:1.3rem;line-height:1.45;color:var(--ink)}
  .quote cite{display:block;margin-top:10px;font-style:normal;font-size:.9rem;color:var(--blue-deep);font-weight:600}

  /* ---------- reading lists ---------- */
  .rows{margin-top:40px;display:grid;gap:10px}
  .row{display:grid;grid-template-columns:96px 70px minmax(0,1fr) auto;gap:22px;align-items:center;padding:14px 22px 14px 14px;background:var(--soft);border-radius:var(--r-md);text-decoration:none;color:var(--ink);transition:background .2s}
  a.row:hover,button.row:hover{background:var(--line)}
  button.row{width:100%;border:0;font:inherit;text-align:left;cursor:pointer}
  .row .yr{font-weight:800;font-size:1.3rem;color:var(--accent-deep,var(--blue-deep));letter-spacing:-.01em}
  .row h3{font-weight:700;font-size:1.05rem;line-height:1.4}
  .row p{font-size:.9rem;color:var(--gray);margin-top:2px;line-height:1.45}
  .row .go{font-weight:700;font-size:.92rem;color:var(--accent-deep,var(--blue-deep));white-space:nowrap}
  .thumb{position:relative;display:block;width:96px;height:66px;border-radius:12px;overflow:hidden;background:#fff}
  .thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%}
  .th-cover{background:var(--sage-tint)}
  .th-cover img{object-fit:contain;padding:5px 0}
  .th-clip img{object-position:left top}
  .th-video i{position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.4))}
  .th-video i::after{content:"";position:absolute;left:10px;bottom:9px;border-left:10px solid #fff;border-top:6px solid transparent;border-bottom:6px solid transparent}
  .th-news{background:#fff}
  .th-news::before{content:attr(data-mast);position:absolute;left:8px;right:8px;top:8px;padding-bottom:4px;border-bottom:1.5px solid var(--ink);font:800 7.5px/1 var(--font);text-align:center;white-space:nowrap;overflow:hidden;color:var(--ink)}
  .th-news i{position:absolute;left:9px;right:9px;top:24px;bottom:8px;background:linear-gradient(var(--ink),var(--ink)) 0 0/80% 3px no-repeat,repeating-linear-gradient(180deg,rgba(16,24,31,.18) 0 1.4px,transparent 1.4px 5px) 0 9px/47% 100% no-repeat,repeating-linear-gradient(180deg,rgba(16,24,31,.18) 0 1.4px,transparent 1.4px 5px) 100% 9px/47% 100% no-repeat}
  .th-audio{background:var(--blue-tint)}
  .th-audio::before{content:attr(data-mast);position:absolute;left:9px;top:8px;font:800 8px/1 var(--font);color:var(--blue-deep)}
  .th-audio i{position:absolute;left:9px;right:9px;top:26px;bottom:12px;background:repeating-linear-gradient(90deg,var(--blue-deep) 0 2.5px,transparent 2.5px 6px);opacity:.75;clip-path:polygon(0 40%,8% 10%,16% 55%,24% 0,32% 45%,40% 20%,48% 60%,56% 5%,64% 50%,72% 25%,80% 65%,88% 15%,100% 45%,100% 100%,0 100%)}
  .th-rule{background:var(--sage-tint)}
  .th-rule::before{content:"\201C";position:absolute;left:9px;top:2px;font:800 34px/1 var(--font);color:var(--sage-deep)}
  .th-rule i{position:absolute;left:32px;right:12px;top:18px;bottom:14px;background:repeating-linear-gradient(180deg,rgba(16,24,31,.22) 0 2px,transparent 2px 7px)}
  .th-memo{background:#fff}
  .th-memo::before{content:"HDQ memo";position:absolute;left:9px;top:8px;font:800 8px/1 var(--font);color:var(--rose-deep)}
  .th-memo i{position:absolute;left:9px;right:9px;top:22px;bottom:8px;border-top:1.5px solid var(--rose-tint);background:repeating-linear-gradient(180deg,rgba(16,24,31,.16) 0 1.4px,transparent 1.4px 5px) 0 6px/70% 100% no-repeat}
  .th-memo i::after{content:"";position:absolute;right:0;bottom:0;width:20px;height:20px;border-radius:50%;border:2px solid #E2A592;transform:rotate(-12deg)}
  @media(max-width:700px){
    .row{grid-template-columns:72px minmax(0,1fr);gap:4px 14px;align-items:start;padding:12px}
    .row .thumb{grid-row:span 3;width:72px;height:56px}
    .row .yr,.row>span:nth-of-type(3),.row .go{grid-column:2}
    .row .yr{font-size:1rem}
    .row .go{font-size:.86rem}
  }
  details.more-rows{margin-top:14px}
  details.more-rows summary{cursor:pointer;display:inline-block;font-weight:700;font-size:.95rem;color:var(--blue-deep);list-style:none;padding:6px 0}
  details.more-rows summary::-webkit-details-marker{display:none}
  details.more-rows summary::after{content:" +"}
  details.more-rows[open] summary::after{content:" \2212"}
  details.more-rows .rows{margin-top:10px}

  /* ---------- the work: soft colour cards ---------- */
  .cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:40px}
  @media(max-width:820px){.cards{grid-template-columns:1fr}}
  .card{background:var(--tint);border-radius:var(--r-lg);padding:38px;scroll-margin-top:96px;display:flex;flex-direction:column}
  @media(max-width:560px){.card{padding:28px 24px}}
  .card .kicker{font-size:.9rem;font-weight:700;color:var(--accent-deep)}
  .card h3{font-weight:800;font-size:1.9rem;line-height:1.15;letter-spacing:-.015em;margin-top:8px}
  .card .tagline{font-weight:600;color:var(--gray);margin-top:2px}
  .card-img{margin:22px 0 4px;border-radius:var(--r-md);overflow:hidden}
  .card-img img{width:100%;aspect-ratio:16/9;object-fit:cover;object-position:center 25%}
  .card p.desc{margin-top:16px;color:var(--text);font-size:1.02rem;line-height:1.7}
  .card .credit{margin-top:12px;font-size:.95rem;color:var(--gray);line-height:1.6}
  .card .credit a{color:var(--accent-deep);font-weight:700}
  .card .visit{margin-top:16px;background:#fff;border-radius:var(--r-sm);padding:16px 18px;font-size:.98rem;line-height:1.55;color:var(--text)}
  .card .visit b{display:block;font-size:.85rem;color:var(--accent-deep);margin-bottom:2px}
  .card .visit a{color:var(--accent-deep);font-weight:700}
  .card .links{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:22px}
  .card .links a{font-weight:700;font-size:.92rem;color:var(--accent-deep);text-decoration:none;background:#fff;padding:10px 16px;border-radius:999px}
  .card .links a:hover{color:#fff;background:var(--accent-deep)}
  .card:target{box-shadow:0 0 0 3px var(--accent-deep)}

  /* ---------- his story ---------- */
  .timeline{margin-top:44px;display:grid;gap:10px;max-width:920px}
  .tl-row{display:grid;grid-template-columns:120px minmax(0,1fr);gap:24px;padding:24px 26px;border-radius:var(--r-md);background:var(--soft)}
  .tl-row .yr{font-weight:800;font-size:1.6rem;line-height:1.1;color:var(--blue-deep);letter-spacing:-.02em}
  .tl-row h3{font-weight:800;font-size:1.12rem;line-height:1.35}
  .tl-row p{margin-top:6px;color:var(--text);font-size:1rem;line-height:1.7}
  @media(max-width:640px){.tl-row{grid-template-columns:1fr;gap:6px;padding:20px}}

  /* ---------- archive ---------- */
  .archive{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:40px}
  @media(max-width:820px){.archive{grid-template-columns:1fr}}
  .arc{background:var(--soft);border-radius:var(--r-lg);padding:20px 20px 30px;scroll-margin-top:96px}
  .arc-img{display:block;width:100%;aspect-ratio:2/1;border-radius:var(--r-md);overflow:hidden;background:#fff;border:0;padding:0;cursor:pointer}
  .arc-img img{width:100%;height:100%;object-fit:cover}
  .arc-img.book{background:var(--sage-tint)}
  .arc-img.book img{object-fit:contain;padding:18px 0}
  .arc h3{font-weight:800;font-size:1.4rem;margin:22px 10px 0}
  .arc p{margin:8px 10px 0;color:var(--text);font-size:1rem}
  .arc .more{display:inline-block;margin:14px 10px 0;font-weight:700;color:var(--accent-deep);text-decoration:none}

  /* ---------- clipping reader ---------- */
  .clip-reader{margin:auto;width:min(1100px,94vw);max-height:92vh;padding:0;border:0;border-radius:var(--r-md);overflow:hidden;background:#F4F1EA;box-shadow:0 40px 90px -30px rgba(0,0,0,.6)}
  .clip-reader::backdrop{background:rgba(16,24,31,.72)}
  .cr-bar{position:sticky;top:0;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px 12px 20px;background:#fff;font-size:.88rem;font-weight:600;color:var(--gray)}
  .cr-close{border:0;background:var(--ink);color:#fff;border-radius:999px;padding:9px 16px;font:700 .85rem var(--font);cursor:pointer}
  .cr-scroll{overflow:auto;max-height:calc(92vh - 100px)}
  .cr-scroll img{display:block;width:100%;min-width:760px;height:auto}
  .cr-portrait{width:min(820px,94vw)}
  .cr-portrait .cr-scroll img{min-width:0;max-width:100%}
  .cr-text{background:#fff;padding:22px 26px 6px;font-size:1rem;line-height:1.7;color:var(--text)}
  .cr-text p{margin:0 0 14px}
  .cr-dek{color:var(--gray)}
  .cr-credit{font-size:.82rem;color:var(--gray);padding:10px 20px 14px;background:#fff}

  /* ---------- press (dark panel) ---------- */
  .press-panel{background:var(--ink);color:#fff;border-radius:32px;padding:64px 56px}
  @media(max-width:640px){.press-panel{padding:40px 20px;border-radius:var(--r-lg)}}
  .press-panel .sub{color:#A9B6C1}
  .press-panel .row{background:#1D2832;color:#fff}
  .press-panel a.row:hover,.press-panel button.row:hover{background:#26333F}
  .press-panel .row p{color:#A9B6C1}
  .press-panel .row .yr,.press-panel .row .go{color:#6FD0EE}
  .press-panel details.more-rows summary{color:#6FD0EE}
  .topics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:28px}
  @media(max-width:700px){.topics{grid-template-columns:1fr}}
  .topic{background:var(--tint);border-radius:var(--r-md);padding:24px 26px}
  .topic h4{font-weight:800;font-size:1.12rem;color:var(--accent-deep)}
  .topic p{margin-top:6px;color:var(--text);font-size:.98rem}
  .kit{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:28px}
  @media(max-width:700px){.kit{grid-template-columns:1fr}}
  .kit-item{border:1.5px solid var(--line);border-radius:var(--r-md);padding:22px 24px}
  .kit-item h4{font-weight:800;font-size:1.1rem}
  .kit-item p{margin-top:4px;color:var(--gray);font-size:.95rem}
  .kit-item a{color:var(--blue-deep);font-weight:700}

  /* ---------- questions ---------- */
  .faq{margin-top:40px;display:grid;gap:10px;max-width:920px}
  .faq-item{background:var(--soft);border-radius:var(--r-md);padding:26px 28px}
  .faq-item h3{font-weight:800;font-size:1.15rem;line-height:1.35}
  .faq-item p{margin-top:8px;color:var(--text);font-size:1rem;line-height:1.7}

  /* ---------- by email ---------- */
  .lt-form{margin-top:40px}
  .lt-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
  @media(max-width:760px){.lt-grid{grid-template-columns:1fr}}
  .lt-opt{position:relative;display:block;cursor:pointer;background:var(--tint);border-radius:var(--r-lg);padding:30px 70px 30px 32px;transition:box-shadow .2s}
  .lt-opt input{position:absolute;opacity:0;pointer-events:none}
  .lt-check{position:absolute;top:30px;right:28px;width:28px;height:28px;border-radius:9px;background:#fff;border:2px solid var(--accent-deep)}
  .lt-check::after{content:"";position:absolute;left:8px;top:3px;width:7px;height:13px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg);opacity:0}
  .lt-opt input:checked~.lt-check{background:var(--accent-deep)}
  .lt-opt input:checked~.lt-check::after{opacity:1}
  .lt-opt:has(input:checked){box-shadow:0 0 0 3px var(--accent-deep)}
  .lt-opt input:focus-visible~.lt-check{outline:3px solid var(--blue);outline-offset:3px}
  .lt-k{display:block;font-size:.9rem;font-weight:700;color:var(--accent-deep)}
  .lt-t{display:block;font-weight:800;font-size:1.6rem;letter-spacing:-.01em;margin-top:6px}
  .lt-d{display:block;margin-top:8px;color:var(--text);font-size:1rem;line-height:1.6}
  .lt-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
  .lt-row input{flex:1 1 300px;max-width:460px;font-family:var(--font);font-size:1rem;padding:16px 18px;border:1.5px solid var(--line);border-radius:var(--r-sm);background:#fff;color:var(--ink)}
  .lt-row input:focus{outline:none;border-color:var(--blue)}
  .lt-msg{font-size:.95rem;margin-top:14px;min-height:1.4em}
  .lt-msg.err{color:var(--rose-deep);font-weight:600} .lt-msg.ok{color:var(--sage-deep);font-weight:700}
  .lt-fine{font-size:.86rem;color:var(--gray)}
  .lt-fine a{color:var(--gray)}

  /* ---------- contact ---------- */
  .contact-panel{background:var(--blue-tint);border-radius:32px;padding:64px 56px;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;align-items:start}
  @media(max-width:900px){.contact-panel{grid-template-columns:1fr;gap:36px;padding:40px 24px;border-radius:var(--r-lg)}}
  .big-mail{display:inline-block;margin-top:26px;font-weight:800;font-size:clamp(1.25rem,2.4vw,1.7rem);color:var(--blue-deep);text-decoration:none;word-break:break-word}
  .big-mail:hover{color:var(--ink)}
  .where{margin-top:14px;color:var(--gray);font-weight:600}
  .cform{background:#fff;border-radius:var(--r-lg);padding:32px}
  @media(max-width:560px){.cform{padding:24px 20px}}
  .cf-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  @media(max-width:560px){.cf-row{grid-template-columns:1fr}}
  .cf-field{margin-bottom:16px}
  .cf-field label{display:block;font-size:.9rem;font-weight:700;margin-bottom:6px}
  .cf-field input,.cf-field select,.cf-field textarea{width:100%;font-family:var(--font);font-size:1rem;color:var(--ink);background:var(--soft);border:1.5px solid transparent;border-radius:12px;padding:13px 14px}
  .cf-field textarea{resize:vertical}
  .cf-field input:focus,.cf-field select:focus,.cf-field textarea:focus{outline:none;border-color:var(--blue);background:#fff}
  .cf-note{font-size:.9rem;color:var(--gray);margin:0 0 18px}
  .cf-note a{color:var(--blue-deep);font-weight:600}

  /* ---------- footer ---------- */
  footer{padding:48px 0 56px;border-top:1px solid var(--line);margin-top:0}
  .foot{display:flex;flex-wrap:wrap;gap:18px 40px;justify-content:space-between;align-items:center;font-size:.92rem;color:var(--gray)}
  .foot-mono{font-weight:800;font-size:1.15rem;color:var(--ink)}
  .foot-links{display:flex;flex-wrap:wrap;gap:8px 22px}
  .foot a{color:var(--gray);text-decoration:none;font-weight:600}
  .foot a:hover{color:var(--ink)}
  .foot-legal{width:100%;font-size:.86rem}

  /* ---------- v3.1: pastel press panel and premium finish ---------- */
  :root{--lav:#EEF0FB; --lav-deep:#4B57A6; --shadow-sm:0 1px 2px rgba(16,24,31,.05),0 4px 14px -6px rgba(16,24,31,.10); --shadow-md:0 1px 2px rgba(16,24,31,.05),0 18px 40px -18px rgba(16,24,31,.22)}
  /* press: soft lavender-blue panel, white rows */
  .press-panel{background:linear-gradient(160deg,#F2F4FD 0%,var(--lav) 100%);color:var(--ink);box-shadow:inset 0 0 0 1px rgba(255,255,255,.7)}
  .press-panel .sub{color:var(--gray)}
  .press-panel .row{background:#fff;color:var(--ink);box-shadow:var(--shadow-sm)}
  .press-panel a.row:hover,.press-panel button.row:hover{background:#fff;box-shadow:var(--shadow-md);transform:translateY(-2px)}
  .press-panel .row p{color:var(--gray)}
  .press-panel .row .yr,.press-panel .row .go{color:var(--lav-deep)}
  .press-panel details.more-rows summary{color:var(--lav-deep)}
  .press-panel .row .thumb{box-shadow:0 0 0 1px rgba(16,24,31,.06)}
  /* lists: white rows that lift on hover */
  .row{transition:background .2s,box-shadow .25s,transform .25s}
  a.row:hover,button.row:hover{transform:translateY(-2px)}
  .row .thumb{box-shadow:0 0 0 1px rgba(16,24,31,.06),0 6px 14px -8px rgba(16,24,31,.35)}
  /* cards: hairline highlight, soft depth, gentle lift */
  .card,.lt-opt,.arc,.topic{box-shadow:inset 0 0 0 1px rgba(255,255,255,.75),var(--shadow-sm);transition:box-shadow .25s,transform .25s}
  .card:hover,.arc:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.75),var(--shadow-md)}
  .card .links a{box-shadow:0 0 0 1px rgba(16,24,31,.06);transition:background .2s,color .2s}
  .card-img,.arc-img{box-shadow:0 10px 24px -14px rgba(16,24,31,.45)}
  /* hero: framed portrait with a frosted caption */
  .hero-portrait{position:relative;box-shadow:0 30px 60px -30px rgba(16,24,31,.45)}
  .hero-portrait figcaption{position:absolute;left:18px;bottom:18px;width:auto;height:auto;overflow:visible;clip:auto;padding:9px 14px;border-radius:999px;background:rgba(255,255,255,.72);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:.82rem;font-weight:600;color:var(--ink)}
  .pill svg{width:17px;height:17px;flex:none;transform:rotate(45deg)}
  .btn{box-shadow:var(--shadow-sm)}
  .btn-primary{box-shadow:0 10px 22px -12px rgba(10,111,145,.7)}
  /* one load moment: the opening fades up */
  @media (prefers-reduced-motion:no-preference){
    .hero-text{animation:rise .8s cubic-bezier(.2,.7,.2,1) both}
    .hero-portrait{animation:rise .9s .12s cubic-bezier(.2,.7,.2,1) both}
    @keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
  }
  /* header gains a soft shadow once the page scrolls */
  header{transition:box-shadow .25s}
  header.scrolled{box-shadow:0 1px 0 var(--line),0 10px 24px -18px rgba(16,24,31,.4)}
  /* facts and quote */
  .fact{background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
  .fact .n{font-variant-numeric:tabular-nums}
  .quote{position:relative;overflow:hidden}
  .quote::before{content:"\201C";position:absolute;right:18px;top:-18px;font-size:120px;font-weight:800;line-height:1;color:rgba(10,111,145,.10)}
  /* contact and footer */
  .contact-panel{box-shadow:inset 0 0 0 1px rgba(255,255,255,.7)}
  .cform{box-shadow:var(--shadow-md)}
  footer{background:var(--soft);border-top:0}

  /* ---------- "as featured in" strip (outlet names in house type; swap for official logo files at build) ---------- */
  .featured{margin-top:30px;background:rgba(255,255,255,.75);border-radius:var(--r-md);padding:20px 26px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.9),var(--shadow-sm)}
  .featured-label{font-size:.85rem;font-weight:700;color:var(--lav-deep)}
  .outlets{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:10px 34px;margin-top:10px}
  .outlets li{font-weight:800;font-size:1.22rem;letter-spacing:-.01em;color:#5B6472;white-space:nowrap}
  @media(max-width:640px){.outlets{gap:8px 22px}.outlets li{font-size:1.05rem}}

  .th-logo{background:#fff}
  .thumb.th-logo img{object-fit:contain;padding:10px 12px;object-position:center}


  /* =====================================================================
     WordPress build additions (theme v4). Everything above is the v3.1
     stylesheet exactly as handed over; what follows only covers what a live
     WordPress page adds: the admin bar, the forms' status lines, the hidden
     spam field, outlet logos, plain pages and the 404.
     ===================================================================== */
  .screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .skip-link:focus{position:fixed!important;left:12px;top:12px;width:auto;height:auto;clip:auto;z-index:100;background:var(--ink);color:#fff;padding:10px 16px;border-radius:999px;font-weight:700;text-decoration:none}
  .admin-bar header.site-header{top:32px}
  @media(max-width:782px){.admin-bar header.site-header{top:46px}}
  @media(max-width:600px){.admin-bar header.site-header{top:0}}
  html:has(body.admin-bar){scroll-padding-top:116px}

  /* the about section's second row, which the mockup set inline */
  .about-grid.about-second{margin-top:40px;align-items:start}
  .about-second .quote{margin-top:0}

  /* buttons that look like the mockup's links */
  button.arc-img{font:inherit}
  a.arc-img{text-decoration:none}

  /* the two forms: the hidden spam field, and the contact status line */
  .gd-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
  .lt-form,.cform{position:relative}
  .form-msg{font-size:.95rem;margin-top:14px;min-height:1.4em}
  .form-msg:empty{margin-top:0;min-height:0}
  .form-msg.err,.lt-msg.err{color:var(--rose-deep);font-weight:600}
  .form-msg.ok,.lt-msg.ok{color:var(--sage-deep);font-weight:700}
  .cform button[disabled],.lt-form button[disabled]{opacity:.6;cursor:progress}

  /* outlet logos, once Gailen supplies them: one colour, about 28px tall */
  .outlets li img{display:block;height:28px;width:auto;filter:grayscale(1) brightness(.55);opacity:.85}

  /* a notice across the top, for example after an unsubscribe */
  .gd-notice{max-width:var(--wrap);margin:16px auto 0;padding:0 40px}
  .gd-notice p{background:var(--sage-tint);color:var(--sage-deep);font-weight:700;border-radius:var(--r-sm);padding:14px 18px}
  @media(max-width:640px){.gd-notice{padding:0 20px}}

  /* plain pages: the privacy policy, and anything else added later */
  .gd-page{max-width:760px;margin:0 auto;padding:60px 20px 100px}
  .gd-page h1{font-weight:800;font-size:2.4rem;letter-spacing:-.02em;margin-bottom:8px;line-height:1.15}
  .gd-page h2{font-size:1.25rem;margin:34px 0 8px;max-width:none}
  .gd-page h3{font-size:1.08rem;margin:24px 0 6px}
  .gd-page p,.gd-page li{font-size:1rem;color:var(--text);margin-bottom:10px}
  .gd-page ul,.gd-page ol{padding-left:20px}
  .gd-page a{color:var(--blue-deep)}
  .gd-page .date{color:var(--gray);font-size:.92rem;margin-bottom:22px}
  .gd-page img{border-radius:var(--r-md);height:auto}
  .gd-page .back{display:inline-block;margin-top:34px;font-weight:700;color:var(--blue-deep);text-decoration:none}

  /* not found */
  .gd-404{max-width:760px;margin:0 auto;padding:90px 20px 120px}
  .gd-404 h1{font-weight:800;font-size:clamp(2.2rem,5vw,3.4rem);letter-spacing:-.03em;line-height:1.05}
  .gd-404 p{margin-top:16px;font-size:1.12rem;color:var(--gray)}
  .gd-404 .hero-actions{margin-top:28px}
  .gd-404{min-height:58vh}

  /* =====================================================================
     v4.1: images, tablet layout of the work, entry motion
     ===================================================================== */

  /* WordPress prints width and height attributes on every library image.
     The height attribute beats aspect-ratio, which is what stretched the
     card photos to their full pixel height. Height follows the width again;
     the slots that fill a frame (portrait, thumbs, archive) keep 100%. */
  img{height:auto}
  .card-img img{height:auto}

  /* a logo or a share graphic is shown whole, on white, rather than cropped */
  .card-img.is-contain{background:#fff}
  .card-img.is-contain img{object-fit:contain;padding:18px 26px}

  /* ---------- the work on tablets: the first card on its own landscape row,
     the rest in two columns that pack without stretching ---------- */
  @media (min-width:700px) and (max-width:1199px){
    .cards{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;grid-auto-flow:row dense}
    .cards>.card{height:auto}
    .cards>.card:first-child{grid-column:1/-1}
    .cards>.card:first-child:has(.card-img){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);column-gap:36px;align-content:start}
    .cards>.card:first-child:has(.card-img)>*{grid-column:1}
    .cards>.card:first-child:has(.card-img)>.card-img{grid-column:2;grid-row:1/span 9;margin:0;align-self:start}
    .cards>.card:first-child:has(.card-img)>.card-img img{aspect-ratio:4/3;object-position:center 35%}
    .cards>.card:first-child:has(.card-img)>.card-img.is-contain img{object-position:center}
    .cards>.card:first-child .links{margin-top:0}
  }
  /* desktop keeps the mockup's two columns, but a short card no longer
     stretches to its neighbour's height: the next card tucks in under it */
  @media (min-width:1200px){
    .cards{align-items:start}
  }
  /* packed by the script on tablets and up: rows of 4px, each card spanning
     its own height, which is masonry without a library */
  @media (min-width:700px){
    .cards.is-packed{grid-auto-rows:4px;row-gap:0}
    .cards.is-packed>.card{margin-bottom:20px}
  }
  @media (min-width:700px) and (max-width:860px){
    .cards>.card:first-child:has(.card-img){grid-template-columns:minmax(0,1fr) minmax(0,.9fr);column-gap:26px}
    .card{padding:30px 26px}
    .card h3{font-size:1.6rem}
  }

  /* ---------- gentle entry: sections, cards and rows rise into place once ---------- */
  @media (prefers-reduced-motion:no-preference){
    .js-reveal [data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .75s cubic-bezier(.2,.7,.2,1),transform .75s cubic-bezier(.2,.7,.2,1);transition-delay:var(--reveal-delay,0s);will-change:opacity,transform}
    .js-reveal [data-reveal="fade"]{transform:none}
    .js-reveal [data-reveal="scale"]{transform:translateY(16px) scale(.985)}
    .js-reveal [data-reveal].is-in{opacity:1;transform:none}
  }