/*
Theme Name: Revista Jardim Europa
Theme URI: https://institutojardimeuropa.com.br
Author: AZ Press Brasil
Author URI: https://azpress.com.br
Description: Tema editorial sofisticado para a Revista Jardim Europa — arquitetura, design, lifestyle, gastronomia, negócios e arte. Layout de revista em múltiplas colunas, tipografia serifada de alto padrão e paleta creme/dourado. Desenvolvido por AZ Press Brasil.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: jardim-europa
Tags: editorial, magazine, blog, custom-menu, featured-images, translation-ready, right-sidebar
*/

/* ============================================================
   TOKENS
   ============================================================ */
:root{
  --cream:      #f4f1ea;
  --paper:      #ffffff;
  --paper-warm: #faf7f0;
  --ink:        #1b1a17;
  --ink-soft:   #33312c;
  --muted:      #78756d;
  --muted-2:    #9a968c;
  --line:       #e3ddd0;
  --line-soft:  #ece7db;
  --gold:       #c79b5e;
  --gold-dark:  #b0864a;
  --olive:      #494c3d;
  --olive-dark: #3c3f31;
  --dark:       #1a1917;
  --dark-2:     #23211d;

  --serif:  "Cormorant", Georgia, "Times New Roman", serif;
  --body:   "EB Garamond", Georgia, serif;
  --sans:   "Jost", "Helvetica Neue", Arial, sans-serif;

  --maxw: 1560px;
  --gap: 34px;
}

/* ============================================================
   RESET / BASE
   ============================================================ */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:var(--body);
  font-size:18px;
  line-height:1.72;
  font-feature-settings:"kern" 1,"liga" 1;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; transition:color .2s ease, opacity .2s ease; }
a:hover{ color:var(--gold-dark); }
button{ font-family:inherit; cursor:pointer; }
h1,h2,h3,h4{ margin:0; font-weight:400; }

.eyebrow,.cat,.meta,.label,.kicker{
  font-family:var(--sans);
  text-transform:uppercase;
  letter-spacing:.22em;
  font-weight:400;
}
.eyebrow{ font-size:11px; color:var(--gold-dark); }
.cat{ font-size:10.5px; color:var(--gold-dark); }
.meta{ font-size:10.5px; color:var(--muted-2); letter-spacing:.2em; }

.btn{
  display:inline-block;
  font-family:var(--sans);
  text-transform:uppercase;
  letter-spacing:.22em;
  font-size:11px;
  padding:15px 30px;
  background:var(--ink);
  color:var(--cream);
  border:1px solid var(--ink);
}
.btn:hover{ background:transparent; color:var(--ink); }
.btn--light{ background:transparent; color:#f4f1ea; border:1px solid rgba(244,241,234,.5); }
.btn--light:hover{ background:#f4f1ea; color:var(--dark); border-color:#f4f1ea; }
.btn--gold{ background:var(--gold); border-color:var(--gold); color:#fff; }
.btn--gold:hover{ background:transparent; color:var(--gold-dark); }

.more{
  font-family:var(--sans); text-transform:uppercase; letter-spacing:.2em;
  font-size:10px; color:var(--gold-dark);
}
.more::after{ content:" →"; }

/* ============================================================
   HEADER
   ============================================================ */
.site-header{
  background:var(--olive);
  border-bottom:1px solid var(--olive-dark);
  position:relative; z-index:60;
}

/* --- top utility strip --- */
.masthead-top{ border-bottom:1px solid rgba(244,241,234,.14); }
.mt-inner{
  max-width:var(--maxw); margin:0 auto; padding:10px 40px;
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:20px;
}
.mt-edition{
  justify-self:center; font-family:var(--sans); text-transform:uppercase;
  letter-spacing:.34em; font-size:9.5px; color:var(--gold);
}
.mt-right{ justify-self:end; display:flex; align-items:center; gap:20px; }
.mt-subscribe{
  font-family:var(--sans); text-transform:uppercase; letter-spacing:.24em;
  font-size:9.5px; color:#e9e5db;
}
.mt-subscribe:hover{ color:var(--gold); }
.menu-toggle{
  display:flex; align-items:center; gap:11px; justify-self:start;
  background:none; border:none; padding:0;
  font-family:var(--sans); text-transform:uppercase; letter-spacing:.24em;
  font-size:10px; color:#f0ece2;
}
.menu-toggle .bars{ display:inline-flex; flex-direction:column; gap:3.5px; }
.menu-toggle .bars span{ width:18px; height:1.4px; background:#f0ece2; display:block; }
.search-toggle{ background:none; border:none; padding:2px; color:#f0ece2; display:flex; }
.search-toggle svg{ width:17px; height:17px; }

/* --- centered brand (masthead) --- */
.masthead-brand{ text-align:center; padding:32px 20px 24px; }
.site-logo{ display:inline-block; line-height:0; }
.site-logo .logo-img{ height:124px; width:auto; margin:0 auto; }
/* text fallback if no logo image is used */
.site-logo .logo-kicker{
  font-family:var(--sans); font-size:9px; letter-spacing:.42em;
  text-transform:uppercase; color:var(--gold); display:block; margin-bottom:6px;
}
.site-logo .logo-name{
  font-family:var(--serif); font-weight:500; font-size:40px;
  letter-spacing:.12em; line-height:.9; display:block; text-transform:uppercase; color:#f4f1ea;
}

/* --- primary nav rule --- */
.masthead-nav{ border-top:1px solid rgba(244,241,234,.14); }
.primary-nav ul{
  list-style:none; margin:0 auto; padding:14px 40px; max-width:var(--maxw);
  display:flex; gap:30px; flex-wrap:wrap; justify-content:center;
}
.primary-nav a{
  font-family:var(--sans); text-transform:uppercase; letter-spacing:.2em;
  font-size:10.5px; color:rgba(244,241,234,.82); position:relative; padding-bottom:3px;
}
.primary-nav a:hover,.primary-nav .current-menu-item>a{ color:var(--gold); }
.primary-nav a::after{
  content:""; position:absolute; left:0; bottom:0; width:0; height:1px;
  background:var(--gold); transition:width .25s ease;
}
.primary-nav a:hover::after{ width:100%; }

/* mobile nav */
.mobile-nav{ display:none; }

/* ============================================================
   HERO SEARCH DRAWER
   ============================================================ */
.search-drawer{
  max-width:var(--maxw); margin:0 auto; padding:0 40px;
  max-height:0; overflow:hidden; transition:max-height .35s ease;
}
.search-drawer.open{ max-height:120px; }
.search-drawer form{ display:flex; gap:0; padding:22px 0; border-bottom:1px solid var(--line); }
.search-drawer input[type=search]{
  flex:1; border:none; background:none; font-family:var(--serif); font-size:26px;
  color:var(--ink); padding:6px 0; outline:none;
}
.search-drawer input[type=search]::placeholder{ color:var(--muted-2); font-style:italic; }
.search-drawer button{
  background:none; border:none; font-family:var(--sans); text-transform:uppercase;
  letter-spacing:.2em; font-size:11px; color:var(--gold-dark);
}

/* ============================================================
   MAIN GRID
   ============================================================ */
.layout{
  max-width:var(--maxw); margin:0 auto; padding:38px 40px 0;
  display:grid;
  grid-template-columns:88px minmax(0,2fr) minmax(0,1.12fr) minmax(0,.76fr);
  gap:var(--gap);
  align-items:start;
}

/* -------- RAIL (col 1) -------- */
.rail{ position:sticky; top:110px; padding-top:4px; }
.rail .edition{
  font-family:var(--sans); font-size:9.5px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--ink); line-height:1.9; margin-bottom:30px;
}
.rail .edition strong{ font-weight:500; display:block; }
.rail-cats{ display:flex; flex-direction:column; gap:14px; }
.rail-cats a{
  font-family:var(--sans); font-size:10px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--ink-soft); writing-mode:horizontal-tb;
}
.rail-cats a:hover{ color:var(--gold-dark); }
.rail-divider{ width:26px; height:1px; background:var(--gold); margin:26px 0; }
.rail-anuncie{
  font-family:var(--sans); font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--ink); display:block; margin-bottom:auto;
}
.rail-social{ display:flex; flex-direction:column; gap:16px; margin-top:34px; color:var(--muted); }
.rail-social a{ display:flex; }
.rail-social svg{ width:16px; height:16px; }
.rail-social a:hover{ color:var(--gold-dark); }

/* -------- HERO COLUMN (col 2) -------- */
.col-hero{ display:flex; flex-direction:column; gap:44px; }

.hero{ position:relative; }
.hero-media{ position:relative; overflow:hidden; background:#cfc8bb; aspect-ratio:16/11; }
.hero-media img{ width:100%; height:100%; object-fit:cover; }
.hero-content{
  position:absolute; left:44px; bottom:52px; right:44px; color:#f4f1ea;
}
.hero-content .eyebrow{ color:#e9d9bd; }
.hero-content h1{
  font-family:var(--serif); font-weight:400; text-transform:uppercase;
  font-size:clamp(38px,4.4vw,74px); line-height:.98; letter-spacing:.01em;
  margin:14px 0 16px; max-width:12ch;
  text-shadow:0 2px 30px rgba(0,0,0,.35);
}
.hero-content p{
  font-family:var(--body); font-style:italic; font-size:19px; max-width:34ch;
  margin:0 0 26px; color:#efe9de; line-height:1.5;
}
.hero-dots{
  position:absolute; left:44px; bottom:22px; display:flex; gap:20px;
  font-family:var(--sans); font-size:10.5px; letter-spacing:.15em; color:rgba(244,241,234,.55);
}
.hero-dots span{ cursor:pointer; }
.hero-dots span.active{ color:#f4f1ea; border-bottom:1px solid var(--gold); padding-bottom:2px; }
/* dark hero button override */
.hero .btn{ background:var(--cream); color:var(--ink); border-color:var(--cream); }
.hero .btn:hover{ background:transparent; color:#f4f1ea; border-color:#f4f1ea; }

/* -------- DESTAQUES -------- */
.section-head{
  display:flex; align-items:baseline; justify-content:space-between;
  border-top:1px solid var(--line); padding-top:16px; margin-bottom:26px;
}
.section-head h2{
  font-family:var(--serif); font-size:22px; letter-spacing:.02em;
  display:flex; align-items:center; gap:16px; text-transform:none; font-weight:500;
}
.section-head h2::after{ content:""; width:34px; height:1px; background:var(--gold); }
.section-head .more{ font-size:9.5px; }

.destaque-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.card{ display:flex; flex-direction:column; }
.card .thumb{ overflow:hidden; background:#d8d1c4; aspect-ratio:5/6; margin-bottom:16px; }
.card .thumb img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.card:hover .thumb img{ transform:scale(1.04); }
.card .cat{ margin-bottom:9px; display:block; }
.card h3{
  font-family:var(--serif); font-size:20px; line-height:1.18; font-weight:500;
  margin-bottom:12px;
}
.card .meta{ margin-top:auto; }

/* -------- EDIÇÃO DIGITAL -------- */
.digital-edition{
  background:var(--olive); color:#e9e5db; display:grid; grid-template-columns:1fr 1fr;
  align-items:center; overflow:hidden; min-height:210px;
}
.digital-edition .de-text{ padding:44px 40px; }
.digital-edition h2{
  font-family:var(--sans); text-transform:uppercase; letter-spacing:.22em; font-size:12px;
  color:#f4f1ea; margin-bottom:16px;
}
.digital-edition p{ font-family:var(--body); font-size:16px; color:#b7b2a6; max-width:30ch; margin:0 0 26px; }
.digital-edition .de-media{ position:relative; height:100%; min-height:210px; background:#111; }
.digital-edition .de-media img{ width:100%; height:100%; object-fit:cover; }

/* -------- FEATURE COLUMN (col 3) -------- */
/* -------- MAIS LIDAS (col hero) -------- */
.mais-lidas .section-head{ margin-bottom:4px; }
.ml-list{ list-style:none; margin:0; padding:0; }
.ml-list li{ padding:22px 0; border-top:1px solid var(--line); }
.ml-list li:first-child{ border-top:none; padding-top:12px; }
.ml-list a{ display:grid; grid-template-columns:56px 1fr; gap:24px; align-items:center; }
.ml-num{ font-family:var(--serif); font-weight:500; font-size:40px; line-height:.8;
  color:transparent; -webkit-text-stroke:1px var(--gold); }
.ml-body .cat{ display:block; margin-bottom:7px; }
.ml-body h4{ font-family:var(--serif); font-weight:500; font-size:23px; line-height:1.22; color:var(--ink); }
.ml-list a:hover .ml-body h4{ color:var(--gold-dark); }

/* -------- FEATURE COLUMN (col 3) -------- */
.col-feature{ display:flex; flex-direction:column; gap:26px; }
.feature-card{ background:var(--paper); border:1px solid var(--line-soft); padding:38px 40px 34px; text-align:center; }
.feature-card .eyebrow{ display:block; margin-bottom:18px; }
.feature-card h2{
  font-family:var(--serif); font-weight:400; text-transform:uppercase;
  font-size:clamp(26px,2.3vw,34px); line-height:1.06; letter-spacing:.01em; margin-bottom:18px;
}
.feature-card .lede{ font-family:var(--body); font-size:16px; color:var(--muted); font-style:italic; max-width:36ch; margin:0 auto 22px; }
.byline{ font-family:var(--sans); text-transform:uppercase; letter-spacing:.16em; font-size:9.5px; color:var(--muted-2); }
.byline span{ color:var(--gold-dark); }

.feature figure{ margin:0; overflow:hidden; background:#d0c9bc; }
.feature figure img{ width:100%; object-fit:cover; }
.feature figure.tall{ aspect-ratio:16/10; }
.feature figure.wide{ aspect-ratio:16/9; }

.feature-body{ font-family:var(--body); font-size:18px; line-height:1.8; color:var(--ink-soft); }
.feature-body::after{ content:""; display:block; clear:both; }
.feature-body p{ margin:0 0 20px; }
.feature-body p.dropcap::first-letter{
  font-family:var(--serif); font-size:74px; line-height:.72; float:left;
  padding:8px 14px 0 0; color:var(--ink); font-weight:500;
}
.pullquote{
  font-family:var(--serif); font-style:italic; font-size:26px; line-height:1.35;
  text-align:center; color:var(--ink); margin:14px 30px; position:relative; font-weight:500;
}
.pullquote::before,.pullquote::after{ content:"“"; color:var(--gold); font-size:34px; }
.pullquote::after{ content:"”"; }

.leia-tambem{ border-top:1px solid var(--line); padding-top:22px; }
.leia-tambem h4{
  font-family:var(--sans); text-transform:uppercase; letter-spacing:.22em; font-size:11px;
  color:var(--ink); margin-bottom:20px;
}
.lt-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.lt-grid .thumb{ aspect-ratio:4/3; overflow:hidden; background:#d5cec1; margin-bottom:12px; }
.lt-grid .thumb img{ width:100%; height:100%; object-fit:cover; }
.lt-grid .cat{ display:block; margin-bottom:7px; }
.lt-grid h5{ font-family:var(--serif); font-weight:500; font-size:16px; line-height:1.2; margin:0 0 8px; }
.lt-grid .meta{ font-size:9px; }

.share{ display:flex; align-items:center; gap:18px; border-top:1px solid var(--line); padding-top:20px; }
.share .label{ font-size:10px; color:var(--ink); }
.share a{ color:var(--muted); display:flex; }
.share a:hover{ color:var(--gold-dark); }
.share svg{ width:17px; height:17px; }

/* -------- ASIDE COLUMN (col 4) -------- */
.col-aside{ position:sticky; top:110px; display:flex; flex-direction:column; gap:36px; }
.aside-head{
  display:flex; align-items:baseline; justify-content:space-between;
  border-top:1px solid var(--line); padding-top:14px; margin-bottom:16px;
}
.aside-head h3{
  font-family:var(--sans); text-transform:uppercase; letter-spacing:.22em; font-size:12px; color:var(--ink);
}
.aside-head .more{ font-size:9px; }

.aside-media{ overflow:hidden; background:#cdc6b9; aspect-ratio:16/9; margin-bottom:14px; }
.aside-media img{ width:100%; height:100%; object-fit:cover; }
.soc .cat{ display:block; margin-bottom:8px; }
.soc h4,.personagem h4{ font-family:var(--serif); font-weight:500; font-size:20px; line-height:1.16; margin-bottom:12px; }
.soc .more,.personagem .more{ font-size:9px; }

.personagem{ display:block; border-top:1px solid var(--line); padding-top:14px; }
.personagem .p-photo{ width:100%; aspect-ratio:4/3; overflow:hidden; background:#bdb6a9; margin:4px 0 14px; }
.personagem .p-photo img{ width:100%; height:100%; object-fit:cover; }
.personagem .cat{ display:block; margin-bottom:8px; }

.agenda-item{ display:grid; grid-template-columns:56px 1fr; gap:20px; padding:20px 0; border-bottom:1px solid var(--line-soft); }
.agenda-item:last-child{ border-bottom:none; }
.agenda-date{ text-align:center; line-height:1; }
.agenda-date .d{ font-family:var(--serif); font-size:36px; font-weight:500; display:block; }
.agenda-date .m{ font-family:var(--sans); font-size:9px; letter-spacing:.18em; color:var(--gold-dark); text-transform:uppercase; }
.agenda-item h5{ font-family:var(--body); font-weight:500; font-size:17px; line-height:1.25; margin:0 0 5px; }
.agenda-item .place{ font-family:var(--sans); font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted-2); display:block; margin-bottom:7px; }
.agenda-item .more{ font-size:8.5px; }

.partner{ background:var(--dark); color:#e6e2d8; padding:26px; }
.partner .plabel{ font-family:var(--sans); text-transform:uppercase; letter-spacing:.24em; font-size:8.5px; color:var(--gold); margin-bottom:16px; display:block; }
.partner .p-inner{ display:grid; grid-template-columns:1fr auto; gap:18px; align-items:center; }
.partner h4{ font-family:var(--serif); font-size:24px; letter-spacing:.1em; text-transform:uppercase; font-weight:500; line-height:1; }
.partner p{ font-family:var(--body); font-size:13px; color:#a7a294; margin:8px 0 14px; }
.partner .more{ color:var(--gold); font-size:9px; }
.partner .p-visual{ width:104px; height:104px; border-radius:50%; overflow:hidden; background:#000; }
.partner .p-visual img{ width:100%; height:100%; object-fit:cover; }

.newsletter{ border-top:1px solid var(--line); padding-top:22px; }
.newsletter h3{ font-family:var(--serif); font-weight:500; font-size:24px; margin-bottom:12px; }
.newsletter p{ font-family:var(--body); font-size:15px; color:var(--muted); margin:0 0 18px; }
.newsletter form{ display:flex; border:1px solid var(--line); }
.newsletter input{ flex:1; border:none; background:var(--paper); padding:13px 14px; font-family:var(--body); font-size:14px; outline:none; }
.newsletter button{ background:var(--ink); color:var(--cream); border:none; padding:0 20px; font-family:var(--sans); text-transform:uppercase; letter-spacing:.18em; font-size:10px; }
.newsletter button:hover{ background:var(--gold-dark); }

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer{ margin-top:70px; border-top:1px solid var(--line); background:var(--cream); }
.footer-inner{
  max-width:var(--maxw); margin:0 auto; padding:52px 40px 40px;
  display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; align-items:start;
}
.footer-brand .logo-img{ height:52px; width:auto; margin-bottom:16px; }
.footer-brand .tagline{ font-family:var(--sans); text-transform:uppercase; letter-spacing:.26em; font-size:9px; color:var(--muted); }
.footer-brand .logo-kicker{ font-family:var(--sans); font-size:8px; letter-spacing:.4em; text-transform:uppercase; color:var(--muted); display:block; margin-bottom:5px; }
.footer-brand .logo-name{ font-family:var(--serif); font-weight:500; font-size:26px; letter-spacing:.12em; text-transform:uppercase; line-height:.9; }
.footer-col h4{ font-family:var(--sans); text-transform:uppercase; letter-spacing:.2em; font-size:10px; color:var(--ink); margin-bottom:16px; }
.footer-col ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px; }
.footer-col a{ font-family:var(--body); font-size:15px; color:var(--muted); }
.footer-col a:hover{ color:var(--gold-dark); }
.footer-bottom{ max-width:var(--maxw); margin:0 auto; padding:22px 40px; border-top:1px solid var(--line-soft);
  font-family:var(--sans); font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted-2);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; }

/* ============================================================
   GENERIC (single / archive / page)
   ============================================================ */
.content-wrap{ max-width:1180px; margin:0 auto; padding:56px 40px; display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:60px; align-items:start; }
.content-wrap.single-narrow{ max-width:820px; grid-template-columns:1fr; }
.article-head{ text-align:center; margin-bottom:38px; }
.article-head .eyebrow{ display:block; margin-bottom:16px; }
.article-head h1{ font-family:var(--serif); font-weight:400; font-size:clamp(34px,4vw,56px); line-height:1.04; margin-bottom:18px; }
.article-head .lede{ font-family:var(--body); font-style:italic; font-size:20px; color:var(--muted); max-width:42ch; margin:0 auto 20px; }
.article-content{ font-family:var(--body); font-size:19px; line-height:1.8; color:var(--ink-soft); }
.article-content p{ margin:0 0 24px; }
.article-content h2{ font-family:var(--serif); font-size:30px; font-weight:500; margin:44px 0 18px; }
.article-content h3{ font-family:var(--serif); font-size:24px; font-weight:500; margin:34px 0 14px; }
.article-content img{ margin:34px 0; }
.article-content blockquote{ border-left:2px solid var(--gold); padding-left:26px; font-style:italic; font-family:var(--serif); font-size:24px; color:var(--ink); margin:34px 0; }
.article-content a{ color:var(--gold-dark); text-decoration:underline; text-underline-offset:3px; }
.featured-banner{ margin-bottom:44px; overflow:hidden; background:#d0c9bc; }
.featured-banner img{ width:100%; }

.archive-head{ text-align:center; padding:60px 40px 20px; }
.archive-head .eyebrow{ display:block; margin-bottom:14px; }
.archive-head h1{ font-family:var(--serif); font-weight:400; font-size:clamp(38px,5vw,64px); }
.archive-grid{ max-width:1180px; margin:0 auto; padding:30px 40px 60px; display:grid; grid-template-columns:repeat(3,1fr); gap:38px; }

.pagination{ max-width:1180px; margin:0 auto; padding:0 40px 70px; display:flex; gap:12px; justify-content:center; }
.pagination .page-numbers{ font-family:var(--sans); font-size:12px; letter-spacing:.1em; padding:10px 15px; border:1px solid var(--line); color:var(--ink-soft); }
.pagination .current{ background:var(--ink); color:var(--cream); border-color:var(--ink); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1280px){
  .layout{ grid-template-columns:72px minmax(0,1.7fr) minmax(0,1.15fr); }
  .col-aside{ grid-column:1 / -1; position:static; display:grid; grid-template-columns:repeat(2,1fr); gap:40px 40px; margin-top:20px; align-items:start; }
  .col-aside .newsletter{ grid-column:1 / -1; }
}
@media (max-width:1000px){
  .primary-nav{ display:none; }
  .site-logo .logo-img{ height:82px; }
  .layout{ grid-template-columns:1fr; gap:44px; }
  .rail{ position:static; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:24px; padding-bottom:18px; border-bottom:1px solid var(--line); }
  .rail-cats{ flex-direction:row; flex-wrap:wrap; gap:16px; }
  .rail-divider{ display:none; }
  .rail-social{ flex-direction:row; margin-top:0; }
  .destaque-grid{ grid-template-columns:repeat(2,1fr); }
  .col-aside{ grid-template-columns:1fr; }
  .content-wrap{ grid-template-columns:1fr; }
  .archive-grid{ grid-template-columns:repeat(2,1fr); }
  .footer-inner{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  body{ font-size:17px; }
  .mt-inner{ padding:9px 20px; }
  .mt-edition{ display:none; }
  .masthead-brand{ padding:18px 16px 14px; }
  .site-logo .logo-img{ height:58px; }
  .menu-toggle span.txt{ display:none; }
  .layout{ padding:26px 20px 0; }
  .hero-content{ left:22px; right:22px; bottom:34px; }
  .hero-content h1{ font-size:34px; }
  .destaque-grid{ grid-template-columns:1fr 1fr; gap:18px; }
  .digital-edition{ grid-template-columns:1fr; }
  .digital-edition .de-media{ order:-1; min-height:180px; aspect-ratio:16/10; }
  .lt-grid{ grid-template-columns:1fr; }
  .col-aside{ grid-template-columns:1fr; }
  .footer-inner{ grid-template-columns:1fr; gap:30px; }
  .archive-grid{ grid-template-columns:1fr; }
  .search-drawer input[type=search]{ font-size:20px; }
}

/* mobile slide-in menu */
.mobile-nav{
  position:fixed; inset:0 0 0 auto; width:min(84vw,360px); background:var(--cream);
  transform:translateX(100%); transition:transform .35s ease; z-index:120; padding:30px 30px;
  border-left:1px solid var(--line); overflow-y:auto;
}
.mobile-nav.open{ transform:translateX(0); }
.mobile-nav .close{ background:none; border:none; font-family:var(--sans); letter-spacing:.2em; font-size:11px; text-transform:uppercase; margin-bottom:30px; }
.mobile-nav ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:20px; }
.mobile-nav a{ font-family:var(--serif); font-size:24px; text-transform:uppercase; letter-spacing:.06em; }
.nav-overlay{ position:fixed; inset:0; background:rgba(20,18,16,.4); opacity:0; visibility:hidden; transition:.3s; z-index:110; }
.nav-overlay.open{ opacity:1; visibility:visible; }