:root {
  --paper:#EEE4D2; --paper2:#E6D8C1; --ink:#17120D; --red:#8B1A1A;
  --rule:#A99A85; --white:#FFFDF8; --max:1380px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:Jost,sans-serif;font-weight:300;line-height:1.55;overflow-x:hidden;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:200;opacity:.14;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.14'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
}
a{color:inherit;text-decoration:none} button,input,select{font:inherit}
.wrap{width:min(calc(100% - 36px),var(--max));margin-inline:auto}
.hidden{display:none!important}
.topline{border-bottom:1px solid var(--ink);padding:10px 0;font-size:.63rem;text-transform:uppercase;letter-spacing:.16em}
.topline .wrap{display:flex;justify-content:space-between;gap:20px}
.masthead{padding:19px 0 12px;border-bottom:4px double var(--ink);text-align:center}
.masthead h1{font:italic 300 clamp(4.4rem,9vw,9.3rem)/.72 "Cormorant Garamond";letter-spacing:-.06em;margin:9px 0 18px}
.mast-sub{font-size:.65rem;text-transform:uppercase;letter-spacing:.22em}
.mast-sub::before,.mast-sub::after{content:"";display:inline-block;vertical-align:middle;width:85px;height:1px;background:var(--red);margin:0 15px}
.mainnav{
  position:sticky;top:0;z-index:80;background:rgba(238,228,210,.94);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--ink);
}
.navinner{min-height:48px;display:flex;align-items:center;justify-content:center;gap:29px;font-size:.71rem;text-transform:uppercase;letter-spacing:.1em}
.navinner button,.navinner a{background:none;border:0;padding:0;cursor:pointer;color:inherit}
.navinner button:hover,.navinner a:hover{color:var(--red)}
.search-btn{display:flex;align-items:center;gap:7px}
.front{display:grid;grid-template-columns:1fr 1.5fr .86fr;border-bottom:1px solid var(--ink)}
.column{padding:22px;border-right:1px solid var(--ink);min-width:0} .column:last-child{border-right:0}
.kicker{font-size:.62rem;text-transform:uppercase;letter-spacing:.18em;color:var(--red);font-weight:500}
h2,h3,h4{font-family:"Cormorant Garamond",serif;font-weight:300}
.lead h2{font-size:clamp(3.5rem,5.2vw,6rem);line-height:.82;letter-spacing:-.045em;margin:12px 0 18px}
.lead p{font:1.24rem/1.36 "Cormorant Garamond",serif}
.byline{font-size:.63rem;text-transform:uppercase;letter-spacing:.13em;margin-top:20px}
.frame{position:relative;isolation:isolate}
.frame::after{
  content:"";position:absolute;inset:-8px;border:5px solid transparent;pointer-events:none;z-index:5;
  transition:border-color .2s ease,box-shadow .2s ease;
}
.frame:hover::after{border-color:rgba(255,255,255,.98);box-shadow:0 0 0 1px rgba(255,255,255,.38)}
.media{width:100%;height:100%;overflow:hidden}
.media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .68s cubic-bezier(.22,.61,.36,1)}
.frame:hover .media img{transform:scale(1.048)}
.hero-media{height:510px}
.caption{font-size:.61rem;margin-top:8px;line-height:1.35}
.side-story{padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid var(--ink)} .side-story:last-child{border-bottom:0;margin-bottom:0}
.side-story h3{font-size:2rem;line-height:.93;margin:8px 0} .side-story p{font-size:.86rem;line-height:1.45;margin:0}
.side-image{height:160px;margin-bottom:13px}
.statement{display:grid;grid-template-columns:1.4fr .6fr;gap:28px;align-items:end;padding:27px 22px;border-bottom:1px solid var(--ink)}
.statement h2{font-size:clamp(3rem,5vw,5.9rem);line-height:.8;margin:0} .statement em{color:var(--red);font-weight:300}
.statement p{font-size:.9rem;margin:0}
.storygrid{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--ink)}
.storycard{padding:22px;border-right:1px solid var(--ink);min-width:0} .storycard:last-child{border-right:0}
.storypic{height:260px;margin-bottom:17px}
.storycard h3{font-size:2.52rem;line-height:.91;margin:10px 0} .storycard p{font-size:.88rem;line-height:1.48}
.archive-head{padding:44px 22px 16px;display:flex;align-items:end;justify-content:space-between;gap:25px;border-bottom:1px solid var(--ink)}
.archive-head h2{font-size:3.6rem;font-style:italic;line-height:.9;margin:0}
.archive-head p{max-width:480px;margin:0;font-size:.86rem}
.archive-grid{display:grid;grid-template-columns:repeat(2,1fr);border-bottom:1px solid var(--ink)}
.archive-item{display:grid;grid-template-columns:180px 1fr;gap:20px;padding:22px;border-right:1px solid var(--ink);border-bottom:1px solid rgba(23,18,13,.25)}
.archive-item:nth-child(even){border-right:0} .archive-thumb{height:125px}
.archive-item h3{font-size:2rem;line-height:.95;margin:7px 0} .archive-item p{font-size:.83rem;margin:0}
.quote{padding:72px 22px;border-bottom:1px solid var(--ink);text-align:center;clear:both}
.quote p{font:italic 300 clamp(2.8rem,5vw,5.5rem)/.9 "Cormorant Garamond";max-width:1050px;margin:auto} .quote span{color:var(--red)}
.newsletter-strip{background:var(--ink);color:var(--paper);padding:34px 0}
.newsgrid{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:center}
.newsgrid h2{font-size:3.1rem;font-style:italic;line-height:1;margin:0} .newsgrid p{margin:6px 0 0;color:#D2C4AF}
.signup{display:flex;align-items:center;border-bottom:1px solid var(--paper)} .signup input{width:100%;border:0;background:none;color:var(--paper);outline:0;padding:12px 16px} .signup button{border:0;background:none;color:var(--paper);text-transform:uppercase;letter-spacing:.09em;cursor:pointer;padding:12px 0 12px 18px;white-space:nowrap}.newsletter-status{display:none;color:var(--paper);font-size:.72rem;line-height:1.35;text-transform:uppercase;letter-spacing:.08em;margin-left:28px;padding:10px 0;max-width:390px}.signup.is-pending .newsletter-status,.signup.is-confirmed .newsletter-status{display:block}.signup.is-pending input,.signup.is-confirmed input{opacity:.58}.signup.is-confirmed{border-bottom-color:rgba(240,232,216,.55)}
footer{padding:24px 0;text-align:center;font-size:.63rem;text-transform:uppercase;letter-spacing:.12em}

/* SEARCH */
.search-overlay{position:fixed;inset:0;background:rgba(23,18,13,.76);z-index:150;display:none;align-items:flex-start;justify-content:center;padding:8vh 18px 30px}
.search-overlay.open{display:flex}
.search-panel{width:min(980px,100%);max-height:84vh;overflow:auto;background:var(--paper);border:1px solid var(--ink);padding:28px;box-shadow:14px 14px 0 rgba(23,18,13,.18)}
.search-top{display:flex;gap:15px;align-items:center;border-bottom:2px solid var(--ink);padding-bottom:13px}
.search-top input{flex:1;font:300 2.5rem/1 "Cormorant Garamond";border:0;background:transparent;outline:0;color:var(--ink)}
.close-search{border:0;background:none;font-size:1.6rem;cursor:pointer}
.filters{display:flex;flex-wrap:wrap;gap:9px;padding:17px 0;border-bottom:1px solid var(--rule)}
.filter{border:1px solid var(--ink);background:transparent;padding:7px 11px;font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;cursor:pointer}
.filter.active{background:var(--ink);color:var(--paper)}
.search-count{padding:15px 0 3px;font-size:.69rem;text-transform:uppercase;letter-spacing:.12em}
.results{display:grid}
.result{display:grid;grid-template-columns:115px 1fr;gap:18px;padding:18px 0;border-bottom:1px solid var(--rule);cursor:pointer}
.result img{width:115px;height:82px;object-fit:cover} .result h3{font-size:1.8rem;line-height:.95;margin:5px 0} .result p{font-size:.8rem;margin:0;color:#4d443b}

/* ARTICLE PAGE */
.article-view{display:none}
.article-view.active{display:block}
.home-view.inactive{display:none}
.article-top{padding:36px 0 28px;border-bottom:1px solid var(--ink)}
.article-breadcrumb{font-size:.65rem;text-transform:uppercase;letter-spacing:.14em;color:var(--red);margin-bottom:19px}
.article-header{display:grid;grid-template-columns:1.35fr .65fr;gap:50px;align-items:end}
.article-title{font:300 clamp(4rem,7.1vw,7.7rem)/.79 "Cormorant Garamond";letter-spacing:-.052em;margin:0}
.article-deck{font:1.27rem/1.38 "Cormorant Garamond";margin:0 0 15px}
.article-meta{font-size:.65rem;text-transform:uppercase;letter-spacing:.13em;line-height:1.9}
.article-hero{margin:34px auto 0;width:min(100%,1180px)}
.article-hero .frame{height:610px}
.article-credit{display:flex;justify-content:space-between;gap:20px;padding:9px 2px 0;font-size:.59rem;text-transform:uppercase;letter-spacing:.1em}
.audio-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0;border-bottom:1px solid var(--ink);border-top:1px solid var(--ink);margin-top:31px}
.listen-btn{border:1px solid var(--ink);background:transparent;padding:11px 16px;cursor:pointer;text-transform:uppercase;font-size:.68rem;letter-spacing:.1em}
.listen-btn:hover{background:var(--ink);color:var(--paper)}
.article-body{width:min(calc(100% - 36px),840px);margin:50px auto 75px}
.article-body p{font:1.34rem/1.62 "Cormorant Garamond";margin:0 0 26px}
.article-body .dropcap::first-letter{float:left;font-size:5.3rem;line-height:.68;padding:11px 10px 0 0;color:var(--red)}
.article-body h2{font-size:3rem;line-height:.95;margin:48px 0 18px}
.article-mid{width:min(calc(100% - 36px),1050px);margin:55px auto}
.article-mid .frame{height:500px}
.article-mid .caption{padding-top:8px}
.pullquote{width:min(calc(100% - 36px),1050px);margin:58px auto;padding:38px 8%;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);text-align:center}
.pullquote p{font:italic 300 clamp(2.7rem,4.8vw,4.9rem)/.93 "Cormorant Garamond";margin:0} .pullquote span{color:var(--red)}
.article-end{width:min(calc(100% - 36px),1050px);margin:0 auto 80px;display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--ink)}
.endbox{padding:30px} .endbox:first-child{border-right:1px solid var(--ink)} .endbox h3{font-size:2.5rem;line-height:.95;margin:0 0 12px} .endbox p{font-size:.86rem}
.endbutton{display:inline-block;margin-top:12px;border-bottom:1px solid var(--ink);font-size:.75rem;text-transform:uppercase;letter-spacing:.1em}
.back-home{cursor:pointer}

/* POPUP */
.popup{position:fixed;right:28px;bottom:28px;width:min(430px,calc(100% - 36px));background:var(--paper);border:1px solid var(--ink);padding:26px;z-index:140;display:none;box-shadow:10px 10px 0 rgba(23,18,13,.22)}
.popup.show{display:block}
.popup-close{position:absolute;right:13px;top:10px;border:0;background:none;font-size:1.2rem;cursor:pointer}
.popup h3{font-size:2.5rem;line-height:.95;margin:0 28px 10px 0} .popup p{font-size:.85rem;margin:0 0 18px}
.popup form{display:flex;align-items:center;border-bottom:1px solid var(--ink)} .popup input{flex:1;background:none;border:0;outline:0;padding:10px 12px} .popup button[type=submit]{border:0;background:none;text-transform:uppercase;font-size:.68rem;cursor:pointer;white-space:nowrap}.popup .newsletter-status{color:var(--ink);margin-left:18px;max-width:250px}.popup form.is-pending .newsletter-status,.popup form.is-confirmed .newsletter-status{display:block}

@media(max-width:950px){
  .front,.storygrid,.statement,.newsgrid,.article-header,.article-end{grid-template-columns:1fr}
  .column,.storycard{border-right:0;border-bottom:1px solid var(--ink)}
  .archive-grid{grid-template-columns:1fr} .archive-item,.archive-item:nth-child(even){border-right:0}
  .hero-media{height:380px} .article-hero .frame{height:420px} .article-mid .frame{height:380px}
  .endbox:first-child{border-right:0;border-bottom:1px solid var(--ink)}
  .navinner{justify-content:flex-start;overflow:auto;padding:0 18px}
}
@media(max-width:620px){
  .topline .wrap{flex-direction:column;gap:4px} .mast-sub::before,.mast-sub::after{width:25px;margin:0 8px}
  .column,.storycard{padding:18px} .hero-media{height:300px}
  .archive-item{grid-template-columns:110px 1fr;padding:16px} .archive-thumb{height:90px}
  .article-hero .frame{height:310px} .article-mid .frame{height:290px}
  .article-credit,.audio-row{align-items:flex-start;flex-direction:column}
  .popup{right:18px;bottom:18px}
}

/* ===== MOBILE / SMALL TABLET CORRECTIONS ===== */
@media (max-width: 820px){
  .wrap{
    width:min(calc(100% - 28px),var(--max));
  }

  .topline{
    padding:8px 0;
  }
  .topline .wrap{
    flex-direction:column;
    align-items:center;
    gap:2px;
    text-align:center;
    font-size:.58rem;
  }

  .masthead{
    padding:14px 0 10px;
  }
  .masthead h1{
    font-size:clamp(3.7rem,16vw,6.1rem);
    line-height:.78;
    margin:8px 0 14px;
  }
  .mast-sub{
    font-size:.57rem;
    letter-spacing:.17em;
  }
  .mast-sub::before,
  .mast-sub::after{
    width:28px;
    margin:0 7px;
  }

  .mainnav{
    overflow:hidden;
  }
  .navinner{
    min-height:44px;
    justify-content:flex-start;
    gap:21px;
    overflow-x:auto;
    padding:0 14px;
    scrollbar-width:none;
    white-space:nowrap;
  }
  .navinner::-webkit-scrollbar{display:none}

  /* Home lead */
  .front{
    display:block;
  }
  .column{
    border-right:0;
    border-bottom:1px solid var(--ink);
    padding:18px 0;
  }
  .lead h2{
    font-size:clamp(3rem,12vw,4.8rem);
    line-height:.86;
    margin:10px 0 15px;
  }
  .lead p{
    font-size:1.12rem;
    line-height:1.4;
  }
  .hero-media{
    height:auto;
    aspect-ratio:16/10;
  }
  .side-image{
    height:auto;
    aspect-ratio:16/10;
  }

  .statement{
    display:block;
    padding:25px 0;
  }
  .statement h2{
    font-size:clamp(2.8rem,11vw,4.7rem);
    line-height:.85;
    margin-bottom:18px;
  }

  .storygrid{
    display:block;
  }
  .storycard{
    border-right:0;
    border-bottom:1px solid var(--ink);
    padding:22px 0;
  }
  .storypic{
    height:auto;
    aspect-ratio:16/10;
  }
  .storycard h3{
    font-size:2.25rem;
    line-height:.95;
  }

  .archive-head{
    padding:34px 0 15px;
    display:block;
  }
  .archive-head h2{
    font-size:3rem;
    margin-bottom:12px;
  }
  .archive-grid{
    display:block;
  }
  .archive-item{
    display:grid;
    grid-template-columns:110px 1fr;
    gap:14px;
    padding:17px 0;
    border-right:0;
  }
  .archive-thumb{
    height:86px;
  }
  .archive-item h3{
    font-size:1.65rem;
    line-height:.98;
  }
  .archive-item p{
    font-size:.78rem;
  }

  .quote{
    padding:48px 0;
  }
  .quote p{
    font-size:clamp(2.4rem,10vw,4rem);
    line-height:.93;
  }

  .newsgrid{
    display:block;
  }
  .newsgrid h2{
    font-size:2.7rem;
    margin-bottom:6px;
  }
  .signup{
    margin-top:22px;
  }

  /* Article page */
  .article-top{
    padding:27px 0 20px;
  }
  .article-header{
    display:block;
  }
  .article-title{
    font-size:clamp(3.35rem,14vw,5.8rem);
    line-height:.82;
    margin-bottom:22px;
  }
  .article-deck{
    font-size:1.12rem;
    line-height:1.4;
  }

  .article-hero{
    width:min(calc(100% - 28px),1180px);
    margin-top:24px;
  }
  .article-hero .frame{
    height:auto;
    aspect-ratio:16/10;
  }
  .article-credit{
    display:block;
    line-height:1.45;
  }
  .article-credit span{
    display:block;
  }

  .audio-row{
    align-items:flex-start;
    flex-direction:column;
    margin-top:20px;
    padding:18px 0;
  }

  .article-body{
    width:min(calc(100% - 34px),840px);
    margin:38px auto 52px;
  }
  .article-body p{
    font-size:1.18rem;
    line-height:1.58;
    margin-bottom:22px;
  }
  .article-body .dropcap::first-letter{
    font-size:4.25rem;
    line-height:.72;
    padding-top:8px;
  }
  .article-body h2{
    font-size:2.6rem;
    line-height:.98;
    margin-top:40px;
  }

  .article-mid{
    width:min(calc(100% - 28px),1050px);
    margin:42px auto;
  }
  .article-mid .frame{
    height:auto;
    aspect-ratio:16/10;
  }

  .pullquote{
    width:min(calc(100% - 28px),1050px);
    margin:45px auto;
    padding:30px 7%;
  }
  .pullquote p{
    font-size:clamp(2.25rem,9.5vw,3.8rem);
    line-height:.96;
  }

  .article-end{
    width:min(calc(100% - 28px),1050px);
    display:block;
    margin-bottom:55px;
  }
  .endbox{
    padding:24px;
  }
  .endbox:first-child{
    border-right:0;
    border-bottom:1px solid var(--ink);
  }
  .endbox h3{
    font-size:2.2rem;
  }

  /* Search */
  .search-overlay{
    padding:4vh 10px 16px;
    align-items:flex-start;
  }
  .search-panel{
    padding:18px;
    max-height:92vh;
  }
  .search-top input{
    font-size:1.9rem;
    min-width:0;
  }
  .filters{
    gap:7px;
  }
  .filter{
    font-size:.62rem;
    padding:6px 9px;
  }
  .result{
    grid-template-columns:88px 1fr;
    gap:12px;
    padding:14px 0;
  }
  .result img{
    width:88px;
    height:66px;
  }
  .result h3{
    font-size:1.45rem;
  }

  /* Popup */
  .popup{
    left:14px;
    right:14px;
    bottom:14px;
    width:auto;
    padding:22px;
  }
  .popup h3{
    font-size:2.15rem;
  }

  /* Avoid oversized hover frame colliding with neighboring rules on touch/mobile */
  .frame::after{
    inset:-5px;
    border-width:4px;
  }
}

@media (max-width: 460px){
  .wrap{
    width:min(calc(100% - 22px),var(--max));
  }

  .masthead h1{
    font-size:3.55rem;
  }

  .lead h2{
    font-size:3.25rem;
  }

  .statement h2{
    font-size:3rem;
  }

  .archive-item{
    grid-template-columns:94px 1fr;
  }
  .archive-thumb{
    height:76px;
  }

  .article-title{
    font-size:3.35rem;
  }

  .article-body{
    width:min(calc(100% - 28px),840px);
  }

  .article-body p{
    font-size:1.12rem;
  }

  .signup{
    display:block;
    border-bottom:0;
  }
  .signup input{
    border-bottom:1px solid var(--paper);
  }
  .signup button{
    padding:12px 0 0;
  }

  .result{
    grid-template-columns:1fr;
  }
  .result img{
    width:100%;
    height:auto;
    aspect-ratio:16/9;
  }
}


/* =========================================================
   CLEAN FIX v6 — ONLY requested changes
   ========================================================= */

/* 1) REMOVE ALL GLOW / WHITE BOX / HOVER FRAME EFFECTS */
.frame::before,
.frame::after,
.article-selectable::before,
.article-selectable::after,
.article-selectable.text-hover::after{
  content:none !important;
  display:none !important;
}

.frame,
.article-selectable,
.frame:hover,
.article-selectable:hover,
.frame:focus,
.article-selectable:focus{
  outline:none !important;
  box-shadow:none !important;
  background:transparent !important;
  transform:none !important;
}

/* Keep only image zoom */
.frame:hover .media img,
.article-selectable:hover .media img{
  transform:scale(1.045);
}

/* 2) REMOVE THE INTERNAL DIVIDER BETWEEN LEAD TEXT + LEAD IMAGE */
.front > .column:first-child{
  border-right:0 !important;
}

/* Preserve only the divider between the lead article area and right rail */
.front > .column:nth-child(2){
  border-right:1px solid var(--ink);
}

/* 3) FIX OVERLAPS / OVERFLOW */
.front,
.statement,
.storygrid,
.archive-head,
.archive-grid,
.quote,
.newsletter-strip,
.article-top,
.article-body,
.article-mid,
.pullquote,
.article-end{
  position:relative;
  clear:both;
}

.column,
.lead,
.side-story,
.storycard,
.archive-item,
.article-header,
.article-body,
.endbox{
  min-width:0;
}

.lead h2,
.statement h2,
.storycard h3,
.side-story h3,
.archive-item h3,
.article-title,
.article-body h2,
.endbox h3{
  max-width:100%;
  overflow-wrap:break-word;
}

.statement{
  overflow:hidden;
  align-items:center;
}

.storycard{
  min-height:0;
}

.quote{
  background:var(--paper);
  isolation:isolate;
}

.popup{
  max-height:calc(100vh - 36px);
  overflow:auto;
}

/* 4) STANDARDISE ALL EDITORIAL MEDIA TO 16:9 */
.hero-media,
.side-image,
.storypic,
.archive-thumb,
.article-hero .frame,
.article-mid .frame{
  height:auto !important;
  aspect-ratio:16 / 9 !important;
}

.media{
  width:100%;
  height:100%;
  overflow:hidden;
}

.media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* 5) RESPONSIVE SAFETY */
@media(max-width:950px){
  .front > .column:first-child,
  .front > .column:nth-child(2){
    border-right:0 !important;
  }

  .hero-media,
  .side-image,
  .storypic,
  .article-hero .frame,
  .article-mid .frame{
    aspect-ratio:16 / 9 !important;
  }
}


/* =========================================================
   FIX v7 — TRUE 16:9 MEDIA + NO TEXT OVERLAP
   ONLY these two corrections.
   ========================================================= */

/* A. TRUE 16:9: explicit width + aspect-ratio + no inherited fixed heights */
.hero-media,
.side-image,
.storypic,
.archive-thumb,
.article-hero .frame,
.article-mid .frame{
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  aspect-ratio:16 / 9 !important;
  display:block !important;
  overflow:hidden !important;
}

.hero-media .media,
.side-image .media,
.storypic .media,
.archive-thumb .media,
.article-hero .frame .media,
.article-mid .frame .media{
  width:100% !important;
  height:100% !important;
  aspect-ratio:16 / 9 !important;
  overflow:hidden !important;
}

.hero-media img,
.side-image img,
.storypic img,
.archive-thumb img,
.article-hero .frame img,
.article-mid .frame img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}

/* B. STORY GRID MUST TAKE THE FULL HEIGHT OF ITS CONTENT */
.storygrid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  align-items:stretch !important;
  position:relative !important;
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
  clear:both !important;
}

.storycard{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
  padding:22px !important;
}

.storycard .storypic{
  flex:0 0 auto !important;
  margin:0 0 17px 0 !important;
}

.storycard h3{
  flex:0 0 auto !important;
  margin:10px 0 9px !important;
}

.storycard p{
  flex:0 0 auto !important;
  margin:0 !important;
}

.storycard .byline{
  flex:0 0 auto !important;
  margin-top:22px !important;
  padding-top:0 !important;
}

/* C. ARCHIVE HEADER STARTS ONLY AFTER STORY GRID FINISHES */
.archive-head{
  position:relative !important;
  clear:both !important;
  height:auto !important;
  min-height:0 !important;
  margin-top:0 !important;
  padding-top:44px !important;
  overflow:visible !important;
}

.archive-grid{
  position:relative !important;
  clear:both !important;
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
}

/* D. Prevent headings/excerpts from escaping their own article area */
.storycard,
.storycard h3,
.storycard p,
.archive-head,
.archive-head h2,
.archive-head p{
  max-width:100% !important;
  overflow-wrap:break-word !important;
}

/* E. Responsive: preserve 16:9 exactly */
@media(max-width:950px){
  .storygrid{
    display:block !important;
  }
  .storycard{
    display:block !important;
    height:auto !important;
  }
  .hero-media,
  .side-image,
  .storypic,
  .archive-thumb,
  .article-hero .frame,
  .article-mid .frame{
    aspect-ratio:16 / 9 !important;
  }
}


/* =========================================================
   FIX v8 — LEAD ARTICLE STACKED: IMAGE TOP, TEXT BELOW
   Preserve newspaper aesthetic, remove dead space.
   ========================================================= */

/* First row keeps lead area + right rail */
.front{
  display:grid !important;
  grid-template-columns:minmax(0,3fr) minmax(300px,1fr) !important;
  align-items:start !important;
}

/* Turn the first two columns into one visual lead composition */
.front > .column:first-child,
.front > .column:nth-child(2){
  grid-column:1 !important;
  border-right:1px solid var(--ink) !important;
  min-width:0 !important;
}

/* Image first */
.front > .column:nth-child(2){
  grid-row:1 !important;
  padding:22px 22px 0 22px !important;
  border-bottom:0 !important;
}

/* Text immediately below image */
.front > .column:first-child{
  grid-row:2 !important;
  padding:22px !important;
  border-top:0 !important;
  display:grid !important;
  grid-template-columns:minmax(0,1.45fr) minmax(260px,.55fr) !important;
  column-gap:42px !important;
  align-items:end !important;
}

/* Right rail spans both lead rows */
.front > aside.column{
  grid-column:2 !important;
  grid-row:1 / span 2 !important;
  border-right:0 !important;
  padding:22px !important;
  min-width:0 !important;
}

/* Lead image stays true 16:9 */
.front > .column:nth-child(2) .hero-media{
  width:100% !important;
  aspect-ratio:16 / 9 !important;
  height:auto !important;
  margin:0 !important;
}

/* Reorganise lead text below image */
.front > .column:first-child .kicker{
  grid-column:1 / -1 !important;
  margin-bottom:10px !important;
}

.front > .column:first-child h2{
  grid-column:1 !important;
  font-size:clamp(4rem,5.6vw,6.4rem) !important;
  line-height:.82 !important;
  margin:0 !important;
  max-width:100% !important;
}

.front > .column:first-child p{
  grid-column:2 !important;
  align-self:start !important;
  margin:0 !important;
  font-size:1.06rem !important;
  line-height:1.5 !important;
}

.front > .column:first-child .byline{
  grid-column:2 !important;
  margin-top:18px !important;
  align-self:end !important;
}

/* Caption sits naturally under hero */
.front > .column:nth-child(2) .caption{
  margin-top:7px !important;
}

/* No internal divider between image and lead text */
.front > .column:first-child,
.front > .column:nth-child(2){
  border-top:0 !important;
  border-bottom:0 !important;
}
.front{
  border-bottom:1px solid var(--ink) !important;
}

/* Responsive */
@media(max-width:1000px){
  .front > .column:first-child{
    grid-template-columns:1fr !important;
    row-gap:16px !important;
  }
  .front > .column:first-child h2,
  .front > .column:first-child p,
  .front > .column:first-child .byline{
    grid-column:1 !important;
  }
  .front > .column:first-child h2{
    font-size:clamp(3.6rem,7vw,5.4rem) !important;
  }
}

@media(max-width:820px){
  .front{
    display:block !important;
  }
  .front > .column:nth-child(2),
  .front > .column:first-child,
  .front > aside.column{
    display:block !important;
    border-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }
  .front > .column:nth-child(2){
    padding-top:18px !important;
  }
  .front > .column:first-child h2{
    font-size:clamp(3.2rem,13vw,4.8rem) !important;
    margin-bottom:18px !important;
  }
  .front > .column:first-child p{
    font-size:1.08rem !important;
  }
}


/* =========================================================
   UX v9 — FULL ARTICLE CLICK AREA + TWO MORE RIGHT-RAIL ITEMS
   ========================================================= */

/* Entire article block is the hit area */
.side-story,
.storycard,
.archive-item,
.lead,
.lead-article{
  cursor:pointer;
}

/* Title gets a subtle scale cue, not a colour/light box */
.side-story h3,
.storycard h3,
.archive-item h3,
.lead h2,
.lead-article h2{
  transform-origin:left center;
  transition:transform .18s ease;
}

.side-story:hover h3,
.storycard:hover h3,
.archive-item:hover h3,
.lead:hover h2,
.lead-article:hover h2{
  transform:scale(1.018);
}

/* Images continue to zoom softly */
.side-story:hover .media img,
.storycard:hover .media img,
.archive-item:hover .media img,
.lead:hover .media img,
.lead-article:hover .media img{
  transform:scale(1.045);
}

/* Visible keyboard focus without introducing a card box */
.side-story:focus-visible,
.storycard:focus-visible,
.archive-item:focus-visible,
.lead:focus-visible,
.lead-article:focus-visible{
  outline:1px dashed var(--red);
  outline-offset:4px;
}

/* Keep rail compact and editorial */
.front > aside.column{
  align-self:stretch;
}
.side-story{
  padding-bottom:20px;
  margin-bottom:20px;
}
.side-story.with-image .side-image{
  margin-bottom:13px;
}
.side-story.no-image h3{
  margin-top:8px;
}


/* =========================================================
   FIX v9.1 — ONLY requested changes
   ========================================================= */

/* Keep the exact v9 structure. Create one continuous divider between
   the main lead area and the right rail, without relying on child borders. */
.front{
  position:relative !important;
}

/* remove old fragmented vertical borders */
.front > .column:first-child,
.front > .column:nth-child(2),
.front > aside.column{
  border-right:0 !important;
}

/* continuous divider at the 3fr / 1fr boundary */
.front::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:75%;
  width:1px;
  background:var(--ink);
  pointer-events:none;
  z-index:2;
}

/* Reduce ONLY the gap between the main image and its lead text */
.front > .column:nth-child(2){
  padding-bottom:0 !important;
}

.front > .column:first-child{
  padding-top:8px !important;
}

/* Added right-rail article is text-only, with no reserved image gap */
.side-story.no-image{
  padding-top:0 !important;
}

/* Mobile: no vertical divider */
@media(max-width:820px){
  .front::after{
    display:none !important;
  }
}

/* ===== META / CLICKABILITY FIX ===== */

/* Lead: metadata aligned with the bottom edge of the title column */
.front > .column:first-child{
  align-items:end !important;
}
.front > .column:first-child .byline{
  grid-column:2 !important;
  align-self:end !important;
  margin-top:0 !important;
  padding-top:14px !important;
  white-space:nowrap;
}

/* Compact, consistent article metadata everywhere */
.byline,
.rail-meta{
  font-size:.63rem !important;
  text-transform:uppercase !important;
  letter-spacing:.13em !important;
}
.rail-meta{
  margin-top:14px;
}

/* Full article zone clickable, but with no box/glow */
.article-clickable{
  cursor:pointer;
}
.article-clickable:hover h2,
.article-clickable:hover h3{
  transform:scale(1.015);
  transform-origin:left center;
}
.article-clickable h2,
.article-clickable h3{
  transition:transform .18s ease;
}

/* Summary text participates in the click target */
.article-clickable p{
  cursor:pointer;
}

/* Prevent any caption space under lead hero */
.front .caption{
  display:none !important;
}

/* Mobile keeps metadata on its own line */
@media(max-width:820px){
  .front > .column:first-child .byline{
    white-space:normal;
    margin-top:14px !important;
  }
}

/* ===== MOBILE ONLY: ARTICLE SEPARATION ===== */
@media(max-width:820px){

  /* Desktop/browser untouched. Only mobile gets article separators. */

  /* Separate the main lead article from the following story */
  .front > .column:nth-child(2){
    border-bottom:1px solid var(--ink) !important;
    padding-bottom:18px !important;
    margin-bottom:18px !important;
  }

  /* Separate each right-rail article on mobile */
  .front > aside.column .side-story{
    border-bottom:1px solid var(--ink) !important;
    padding-bottom:20px !important;
    margin-bottom:20px !important;
  }

  .front > aside.column .side-story:last-child{
    border-bottom:0 !important;
    margin-bottom:0 !important;
  }
}


/* ===== INTERMEDIATE WIDTH FIX: TABLET MODE ===== */
/* Desktop >1180px untouched. Mobile <=820px untouched.
   Between them, use a clean stacked editorial layout instead of squeezing columns. */
@media (min-width:821px) and (max-width:1180px){

  /* Stop the desktop divider before it can cross text */
  .front::after{
    display:none !important;
  }

  /* Stack the lead image, lead copy, then the former right rail */
  .front{
    display:block !important;
    grid-template-columns:none !important;
  }

  .front > .column:first-child,
  .front > .column:nth-child(2),
  .front > aside.column{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    grid-column:auto !important;
    grid-row:auto !important;
    border-right:0 !important;
  }

  /* Keep clear newspaper separation between distinct articles/areas */
  .front > .column:nth-child(2){
    border-bottom:1px solid var(--ink) !important;
    padding-bottom:20px !important;
  }

  .front > .column:first-child{
    border-bottom:1px solid var(--ink) !important;
    padding-top:18px !important;
    padding-bottom:24px !important;
  }

  .front > aside.column{
    padding-top:24px !important;
  }

  .front > aside.column .side-story{
    border-bottom:1px solid var(--ink) !important;
    padding-bottom:20px !important;
    margin-bottom:20px !important;
  }

  .front > aside.column .side-story:last-child{
    border-bottom:0 !important;
  }

  /* Keep the 16:9 media rule */
  .hero-media,
  .side-image{
    width:100% !important;
    height:auto !important;
    aspect-ratio:16 / 9 !important;
  }

  /* Let lead text breathe instead of being squeezed into narrow columns */
  .front > .column:first-child{
    grid-template-columns:1fr !important;
  }

  .front > .column:first-child h2,
  .front > .column:first-child p,
  .front > .column:first-child .byline{
    grid-column:1 !important;
  }

  .front > .column:first-child h2{
    font-size:clamp(3.8rem,7vw,5.6rem) !important;
    margin-bottom:18px !important;
  }

  .front > .column:first-child .byline{
    margin-top:18px !important;
    white-space:normal !important;
  }
}


/* ===== FINAL CARD META ALIGNMENT ===== */
/* Keep the three editorial cards equal-height and pin date/read-time to the bottom */
.storygrid{
  align-items:stretch !important;
}

.storycard{
  display:flex !important;
  flex-direction:column !important;
  height:100% !important;
}

.storycard .storypic{
  flex:0 0 auto !important;
}

.storycard .kicker,
.storycard h3,
.storycard p{
  flex:0 0 auto !important;
}

.storycard .byline{
  margin-top:auto !important;
  padding-top:20px !important;
  align-self:flex-start !important;
}

/* On stacked tablet/mobile layouts, natural flow is preserved */
@media(max-width:950px){
  .storycard{
    height:auto !important;
  }
  .storycard .byline{
    margin-top:18px !important;
    padding-top:0 !important;
  }
}



/* Build preview overrides */
.blog-generated .article-view{display:block}
.blog-generated .home-view{display:block}
.blog-generated .home-view.inactive{display:none}
.blog-generated .article-view.active{display:block}
.blog-empty{padding:70px 22px;text-align:center;border-bottom:1px solid var(--ink)}
.blog-empty h2{font:italic 300 3rem/1 "Cormorant Garamond",serif;margin:0 0 12px}
.blog-empty p{max-width:620px;margin:auto}
.body-image{margin:42px 0}
.body-image img{width:100%;height:auto;display:block}
.body-video{margin:42px 0;width:100%}
.body-video video{width:100%;display:block}
.article-body blockquote{font:italic 300 2rem/1.2 "Cormorant Garamond",serif;border-left:2px solid var(--red);margin:34px 0;padding-left:22px}
.article-body ul,.article-body ol{font:1.22rem/1.58 "Cormorant Garamond",serif;margin:0 0 26px;padding-left:1.4em}
.article-body hr{border:0;border-top:1px solid var(--rule);margin:45px 0}
.article-body a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.preview-banner{background:var(--red);color:var(--white);text-align:center;padding:7px 12px;font-size:.62rem;letter-spacing:.15em;text-transform:uppercase}
@media(max-width:820px){.preview-banner{font-size:.56rem}}

/* v2 nav consistency: language switch + Search same size as the other items */
.search-btn{font:inherit !important;font-size:inherit !important;line-height:inherit !important;text-transform:uppercase !important;letter-spacing:inherit !important;font-weight:inherit !important}
.lang-switch{display:inline-flex;align-items:center;gap:.42em;font:inherit;font-size:inherit;line-height:inherit;text-transform:uppercase;letter-spacing:inherit;white-space:nowrap}
.lang-switch .lang-option{font:inherit;font-size:inherit;line-height:inherit;letter-spacing:inherit}
.lang-switch a.lang-option:hover{color:var(--red)}
.lang-active{color:var(--red);font-weight:500}
.lang-separator{opacity:.55}
.lang-disabled{opacity:.35;cursor:default}


/* Smart article-title sizing: desktop only.
   Short titles gain presence; longer titles step down automatically. */
@media (min-width:821px){
  .article-title.title-short{font-size:clamp(6rem,9.6vw,10rem);line-height:.74}
  .article-title.title-medium{font-size:clamp(4rem,7.1vw,7.7rem);line-height:.79}
  .article-title.title-long{font-size:clamp(3.65rem,6.1vw,6.6rem);line-height:.82}
  .article-title.title-xlong{font-size:clamp(3.2rem,5.15vw,5.5rem);line-height:.86}
}

/* v5: Notion body hierarchy and quote fidelity */
.article-body h3{
  font-family:"Cormorant Garamond",serif;
  font-weight:300;
  font-size:2.2rem;
  line-height:1;
  margin:38px 0 15px;
  letter-spacing:-.015em;
}
.article-body .notion-quote{
  width:min(calc(100vw - 36px),1050px);
  position:relative;
  left:50%;
  transform:translateX(-50%);
  margin:54px 0;
  padding:34px 7%;
  border-left:0;
  border-top:1px solid var(--ink);
  border-bottom:1px solid var(--ink);
  text-align:center;
  font:italic 300 clamp(2.35rem,4.3vw,4.5rem)/.96 "Cormorant Garamond",serif;
}
.article-body .notion-heading-1{font-size:3.25rem}
@media(max-width:820px){
  .article-body h3{font-size:1.9rem;margin-top:32px}
  .article-body .notion-quote{padding:28px 5%;font-size:clamp(2rem,8vw,3rem)}
}

/* =========================================================
   HOME STRUCTURE v7 — LOCKED EDITORIAL RULES
   Approved composition: 1 lead + up to 4 rail stories.
   Rail shows at most one image; remaining rail stories are text-only.
   Layout adapts to real content without reserving empty card space.
   ========================================================= */

/* Stable two-column shell. Lead and rail flow independently, so rail height
   can never push the lead copy away from its image. */
.front{
  display:grid !important;
  grid-template-columns:minmax(0,3fr) minmax(280px,1fr) !important;
  align-items:start !important;
  position:relative !important;
  border-bottom:1px solid var(--ink) !important;
}
.front.rail-count-0{
  grid-template-columns:1fr !important;
}
.front.rail-count-0::after{
  display:none !important;
}
.front::after{
  content:"" !important;
  position:absolute !important;
  top:0 !important;
  bottom:0 !important;
  left:75% !important;
  width:1px !important;
  background:var(--ink) !important;
  pointer-events:none !important;
  z-index:2 !important;
}

.front-main{
  min-width:0;
  padding:22px 22px 0;
}
.front-main .lead-hero{
  display:block;
  width:100% !important;
  height:auto !important;
  aspect-ratio:16 / 9 !important;
  margin:0 !important;
}
.front-main .lead{
  padding:10px 0 26px !important;
  margin:0 !important;
  border:0 !important;
  min-width:0;
}
.front-main .lead > .kicker{
  margin:0 0 10px !important;
}
.lead-copy-grid{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(250px,.55fr);
  column-gap:42px;
  align-items:end;
}
.front-main .lead h2{
  grid-column:1;
  margin:0 !important;
  max-width:100%;
  line-height:.82 !important;
  letter-spacing:-.045em !important;
  overflow-wrap:anywhere;
}
.front-main .lead h2.home-title-short{font-size:clamp(4.8rem,6vw,6.8rem) !important}
.front-main .lead h2.home-title-medium{font-size:clamp(4.2rem,5.35vw,6rem) !important}
.front-main .lead h2.home-title-long{font-size:clamp(3.65rem,4.8vw,5.35rem) !important}
.front-main .lead h2.home-title-xlong{font-size:clamp(3.15rem,4.15vw,4.75rem) !important}
.lead-support{
  grid-column:2;
  align-self:stretch;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  min-width:0;
}
.front-main .lead .lead-support p{
  margin:0 !important;
  font-size:1.06rem !important;
  line-height:1.5 !important;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:5;
  overflow:hidden;
}
.front-main .lead .lead-support .byline{
  margin-top:18px !important;
  padding-top:0 !important;
  white-space:normal !important;
}

/* Right rail: exactly one visual image slot when media is available.
   Positions decide presentation, not the mere presence of media in Notion. */
.front-rail{
  min-width:0;
  padding:22px;
  display:flex;
  flex-direction:column;
  align-self:start;
}
.front-rail .side-story{
  display:flex;
  flex-direction:column;
  min-width:0;
  padding:0 0 18px !important;
  margin:0 0 18px !important;
  border-bottom:1px solid var(--ink) !important;
}
.front-rail .side-story:last-child{
  border-bottom:0 !important;
  margin-bottom:0 !important;
  padding-bottom:0 !important;
}
.front-rail .side-story.with-image .side-image{
  display:block;
  width:100%;
  height:auto !important;
  aspect-ratio:16 / 9 !important;
  margin:0 0 13px !important;
}
.front-rail .side-story.no-image .side-image{
  display:none !important;
}
.front-rail .side-story h3{
  font-size:clamp(1.55rem,1.62vw,2rem) !important;
  line-height:.94 !important;
  margin:7px 0 8px !important;
  overflow-wrap:anywhere;
}
.front-rail .side-story p{
  font-size:.82rem !important;
  line-height:1.43 !important;
  margin:0 !important;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  overflow:hidden;
}
.front-rail .side-story .rail-meta{
  margin-top:12px !important;
  padding-top:0 !important;
  white-space:normal;
}

/* Secondary editorial grid adapts to the number of stories actually present. */
.storygrid.count-3{grid-template-columns:repeat(3,minmax(0,1fr)) !important}
.storygrid.count-2{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
.storygrid.count-1{grid-template-columns:1fr !important}
.storygrid .storycard p{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:4;
  overflow:hidden;
}

/* One remaining story gets its own balanced composition instead of a fake
   three-column row with two empty slots. */
.storygrid.count-1 .storycard{
  display:grid !important;
  grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);
  grid-template-rows:auto auto 1fr auto;
  column-gap:28px;
  height:auto !important;
  align-items:start;
}
.storygrid.count-1 .storycard .storypic{
  grid-column:1;
  grid-row:1 / span 4;
  width:100%;
  height:auto !important;
  aspect-ratio:16 / 9 !important;
  margin:0 !important;
}
.storygrid.count-1 .storycard .kicker,
.storygrid.count-1 .storycard h3,
.storygrid.count-1 .storycard p,
.storygrid.count-1 .storycard .byline{
  grid-column:2;
}
.storygrid.count-1 .storycard .kicker{grid-row:1}
.storygrid.count-1 .storycard h3{grid-row:2}
.storygrid.count-1 .storycard p{grid-row:3}
.storygrid.count-1 .storycard .byline{
  grid-row:4;
  margin-top:18px !important;
  padding-top:0 !important;
}

/* Archive also obeys actual count. */
.archive-grid.count-1{
  grid-template-columns:1fr !important;
}
.archive-grid.count-1 .archive-item{
  border-right:0 !important;
}

/* Tablet: one clean reading column. No squeezed half-desktop layout. */
@media (min-width:821px) and (max-width:1180px){
  .front{
    display:block !important;
    grid-template-columns:none !important;
  }
  .front::after{display:none !important}
  .front-main{
    padding:22px 22px 0 !important;
    border-bottom:1px solid var(--ink);
  }
  .lead-copy-grid{
    grid-template-columns:minmax(0,1.35fr) minmax(240px,.65fr);
    column-gap:32px;
  }
  .front-main .lead h2.home-title-short{font-size:clamp(4.5rem,7.3vw,6rem) !important}
  .front-main .lead h2.home-title-medium{font-size:clamp(4rem,6.7vw,5.5rem) !important}
  .front-main .lead h2.home-title-long{font-size:clamp(3.55rem,6vw,5rem) !important}
  .front-main .lead h2.home-title-xlong{font-size:clamp(3.15rem,5.3vw,4.5rem) !important}
  .front-rail{
    padding:22px !important;
  }
}

/* Mobile: natural stacking, no reserved spaces and no desktop divider. */
@media(max-width:820px){
  .front{
    display:block !important;
    grid-template-columns:none !important;
  }
  .front::after{display:none !important}
  .front-main{
    padding:18px 18px 0 !important;
  }
  .lead-copy-grid{
    display:block;
  }
  .front-main .lead h2{
    margin-bottom:18px !important;
  }
  .front-main .lead h2.home-title-short{font-size:clamp(3.6rem,14vw,4.9rem) !important}
  .front-main .lead h2.home-title-medium{font-size:clamp(3.35rem,12.5vw,4.55rem) !important}
  .front-main .lead h2.home-title-long{font-size:clamp(3.05rem,11vw,4.15rem) !important}
  .front-main .lead h2.home-title-xlong{font-size:clamp(2.8rem,10vw,3.8rem) !important}
  .lead-support{display:block}
  .front-main .lead .lead-support p{
    -webkit-line-clamp:unset;
    overflow:visible;
  }
  .front-rail{
    padding:20px 18px !important;
    border-top:1px solid var(--ink);
  }
  .front-rail .side-story p{
    -webkit-line-clamp:unset;
    overflow:visible;
  }
  .storygrid.count-1,
  .storygrid.count-2,
  .storygrid.count-3{
    display:block !important;
  }
  .storygrid.count-1 .storycard{
    display:block !important;
  }
  .storygrid.count-1 .storycard .storypic{
    width:100%;
    aspect-ratio:16 / 9 !important;
    margin-bottom:17px !important;
  }
}


/* Newsletter popup: clear pending/confirmed state */
.popup form.is-pending,
.popup form.is-confirmed{
  border-bottom:0;
  display:block;
}
.popup form.is-pending input[name="EMAIL"],
.popup form.is-confirmed input[name="EMAIL"]{
  display:none;
}
.popup form.is-pending .newsletter-status,
.popup form.is-confirmed .newsletter-status{
  display:block;
  margin:6px 0 0;
  padding:10px 0 2px;
  max-width:none;
  width:100%;
  font-size:.72rem;
  line-height:1.55;
  letter-spacing:.08em;
}
.popup.submitted{
  min-height:0;
}

/* ===== NEWSLETTER: PENDING STATE READS AS A SENTENCE, NOT A LABEL ===== */
.signup.is-pending,
.signup.is-confirmed{
  display:block;
  border-bottom:0;
}
.signup.is-pending .newsletter-status,
.signup.is-confirmed .newsletter-status{
  display:block;
  margin-left:0;
  padding:12px 0 2px;
  max-width:52ch;
  width:100%;
  text-transform:none;
  letter-spacing:.01em;
  font-size:.82rem;
  line-height:1.6;
}
.popup form.is-pending .newsletter-status,
.popup form.is-confirmed .newsletter-status{
  text-transform:none;
  letter-spacing:.01em;
  font-size:.8rem;
}