@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --bg: #F6F3EC;
  --surface: #FFFFFF;
  --surface-2: #EDE8DC;
  --ink: #16140F;
  --stone: #6B6659;
  --coral: #E4552A;
  --teal: #1E6B5C;
  --mustard: #E2A63C;
  --line: rgba(22,20,15,0.14);
  --sidebar-bg: #16140F;
  --sidebar-text: #C9C3B4;
  --r: 4px;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg); color:var(--ink);
  font-family:'Inter', sans-serif; font-weight:400; line-height:1.6;
  overflow-x:hidden;
}
h1,h2,h3,.display{font-family:'Space Grotesk', sans-serif; font-weight:700; letter-spacing:-0.02em;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
::selection{background:var(--coral); color:#fff;}
button{font-family:inherit;}
.mono{font-family:'IBM Plex Mono', monospace;}

@media (prefers-reduced-motion: no-preference){
  .reveal{opacity:0; transform:translateY(16px); animation:rise 0.9s ease forwards;}
  @keyframes rise{to{opacity:1; transform:translateY(0);}}
  .observe{opacity:1; transform:translateY(0);}
  .observe.in-view{animation:rise 0.7s ease;}
}
@media (prefers-reduced-motion: reduce){ .observe{opacity:1; transform:none;} }

/* ===== SIDEBAR (structural signature) ===== */
.sidebar{
  position:fixed; top:0; left:0; bottom:0; width:230px; z-index:60;
  background:var(--sidebar-bg); color:var(--sidebar-text);
  display:flex; flex-direction:column; justify-content:space-between;
  padding:2rem 1.6rem;
}
.sidebar-top{display:flex; flex-direction:column; gap:0.3rem;}
.sidebar .logo{font-family:'Space Grotesk',sans-serif; font-size:1.5rem; font-weight:700; color:#fff;}
.sidebar .logo-sub{font-family:'IBM Plex Mono',monospace; font-size:0.7rem; color:var(--mustard); letter-spacing:0.04em;}

.sidebar nav{margin-top:3.5rem;}
.sidebar nav ul{list-style:none; display:flex; flex-direction:column; gap:0.2rem;}
.sidebar nav a{
  display:flex; align-items:center; gap:0.7rem; font-size:0.92rem; font-weight:500;
  padding:0.65rem 0.5rem; border-radius:var(--r); color:var(--sidebar-text);
  transition:background 0.2s ease, color 0.2s ease; border-left:2px solid transparent;
}
.sidebar nav a .idx{font-family:'IBM Plex Mono',monospace; font-size:0.72rem; color:var(--stone); width:1.4rem;}
.sidebar nav a:hover{color:#fff; background:rgba(255,255,255,0.06);}
.sidebar nav a.active{color:#fff; border-left-color:var(--coral); background:rgba(228,85,42,0.12);}
.sidebar nav a.active .idx{color:var(--coral);}

.sidebar-bottom{display:flex; flex-direction:column; gap:0.8rem;}
.lang-toggle{
  border:1px solid rgba(255,255,255,0.18); background:transparent; color:var(--sidebar-text);
  font-family:'IBM Plex Mono',monospace; font-size:0.72rem; letter-spacing:0.05em; padding:0.6rem 0.8rem; cursor:pointer; border-radius:var(--r);
  transition:border-color 0.2s, color 0.2s;
}
.lang-toggle:hover{color:#fff; border-color:#fff;}
.sidebar-cta{text-align:center;}

.nav-toggle{
  display:none; position:fixed; top:1.2rem; right:1.2rem; z-index:70;
  background:var(--sidebar-bg); border:none; color:#fff; font-size:1.2rem; border-radius:var(--r); width:44px; height:44px;
}

/* ===== PAGE WRAPPER ===== */
.page{margin-left:230px;}

/* Page banner */
.page-banner{min-height:34vh; display:flex; flex-direction:column; justify-content:center; padding:4.5rem 4vw 2.6rem; position:relative;}
.page-banner .eyebrow{font-family:'IBM Plex Mono',monospace; font-size:0.76rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--coral); margin-bottom:1rem;}
.page-banner h1{font-size:clamp(2.1rem, 4.6vw, 3.6rem);}
.page-banner p{max-width:46ch; color:var(--stone); margin-top:1rem; font-size:1.02rem;}

/* HERO */
.hero{min-height:92vh; display:flex; flex-direction:column; justify-content:center; padding:0 4vw; position:relative; overflow:hidden;}
.hero-eyebrow{font-family:'IBM Plex Mono',monospace; font-size:0.78rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--coral); margin-bottom:1.2rem;}
.hero h1{font-size:clamp(2.4rem, 6.6vw, 5rem); line-height:1.03; max-width:17ch;}
.hero h1 .thin{font-weight:500; font-style:italic; color:var(--teal); font-family:'Inter',sans-serif;}
.hero p{max-width:40ch; margin-top:1.5rem; color:var(--stone); font-size:1.05rem;}
.hero-cta{margin-top:2.2rem; display:flex; gap:1rem; flex-wrap:wrap;}
.btn{padding:0.85rem 1.7rem; font-size:0.82rem; letter-spacing:0.02em; text-transform:uppercase; font-weight:600; border:1.5px solid transparent; transition:all 0.2s ease; display:inline-block; cursor:pointer; border-radius:var(--r);}
.btn-primary{background:var(--coral); color:#fff;}
.btn-primary:hover{background:#c94620;}
.btn-ghost{background:transparent; border-color:var(--line); color:var(--ink);}
.btn-ghost:hover{border-color:var(--ink);}
.contours{position:absolute; right:-4%; top:6%; height:80%; width:42%; opacity:0.9; pointer-events:none;}
.contours svg{width:100%; height:100%;}

section{padding:5.5rem 4vw;}
.section-head{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:2.6rem; padding-bottom:1.2rem; flex-wrap:wrap; gap:1rem; border-bottom:2px solid var(--ink);}
.section-head .eyebrow{font-family:'IBM Plex Mono',monospace; font-size:0.76rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--coral);}
.section-head h2{font-size:clamp(1.7rem, 3.2vw, 2.5rem);}
.section-head p{color:var(--stone); max-width:34ch; font-size:0.95rem;}

.bg-soft{background:var(--surface-2);}

/* teasers */
.teasers{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line);}
.teaser-card{background:var(--surface); display:flex; flex-direction:column; gap:0.9rem; overflow:hidden;}
.teaser-card:hover .teaser-img img{transform:scale(1.05);}
.teaser-img{width:100%; aspect-ratio:16/10; overflow:hidden;}
.teaser-img img{width:100%; height:100%; object-fit:cover; transition:transform 0.4s ease;}
.teaser-card h3, .teaser-card p, .teaser-card .go, .teaser-card .icon-badge{margin-left:1.5rem; margin-right:1.5rem;}
.teaser-card .icon-badge{margin-top:1.3rem;}
.teaser-card .go, .teaser-card p{margin-bottom:0;}
.teaser-card .go{margin-bottom:1.5rem;}

/* bold simple icons */
.icon-badge{width:2.4rem; height:2.4rem; display:flex; align-items:center; justify-content:center; border-radius:var(--r); background:var(--surface-2); color:var(--coral); flex-shrink:0;}
.icon-badge svg{width:1.3rem; height:1.3rem;}
.icon-badge-lg{width:3.2rem; height:3.2rem;}
.icon-badge-lg svg{width:1.7rem; height:1.7rem;}

.teaser-card h3{font-size:1.15rem;}
.teaser-card p{color:var(--stone); font-size:0.87rem;}
.teaser-card .go{font-family:'IBM Plex Mono',monospace; font-size:0.72rem; text-transform:uppercase; letter-spacing:0.04em; color:var(--teal);}
.teaser-card .go::after{content:' →'; color:var(--coral);}

/* especialidades */
.specialties{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line);}
.specialty-card{background:var(--surface); overflow:hidden; display:block;}
.specialty-card img{width:100%; aspect-ratio:4/3; object-fit:cover; filter:grayscale(15%);}
.specialty-body{padding:1.4rem 1.6rem;}
.specialty-body h3{font-size:1.05rem; margin-bottom:0.5rem;}
.specialty-body p{color:var(--stone); font-size:0.87rem; margin-bottom:0.9rem;}
.specialty-body .dish-price{font-family:'IBM Plex Mono',monospace; font-weight:500; color:var(--coral); font-size:1rem;}

/* feature grid */
.feature-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line);}
.feature-item{background:var(--bg-soft, var(--surface-2)); padding:2rem 1.6rem; display:flex; flex-direction:column; gap:0.9rem;}
.feature-item h3{font-size:1.05rem;}
.feature-item p{color:var(--stone); font-size:0.87rem;}

/* full-width image banner */
.image-banner{position:relative; padding:0; height:46vh; min-height:300px; overflow:hidden;}
.image-banner img{width:100%; height:100%; object-fit:cover; filter:grayscale(20%);}
.image-banner::after{content:''; position:absolute; inset:0; background:linear-gradient(0deg, rgba(22,20,15,0.85), rgba(22,20,15,0.1) 60%);}
.image-banner-copy{position:absolute; left:4vw; bottom:2.2rem; z-index:2; max-width:32ch;}
.image-banner-copy .eyebrow{font-family:'IBM Plex Mono',monospace; font-size:0.76rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--mustard); margin-bottom:0.5rem; display:block;}
.image-banner-copy h2{font-size:clamp(1.6rem,3.2vw,2.3rem); color:#fff;}

/* CARTA — list format with mono index */
.menu-grid{display:flex; flex-direction:column; gap:0;}
.menu-group{border-top:2px solid var(--ink); padding:2rem 0;}
.menu-group h3{font-family:'IBM Plex Mono',monospace; font-size:0.82rem; text-transform:uppercase; letter-spacing:0.08em; font-weight:500; color:var(--coral); margin-bottom:1.3rem;}
.dish{display:flex; justify-content:space-between; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--line);}
.dish:last-child{border-bottom:none;}
.dish-name{font-family:'Space Grotesk', sans-serif; font-size:1.15rem; font-weight:600;}
.dish-desc{color:var(--stone); font-size:0.88rem; margin-top:0.3rem; max-width:40ch;}
.dish-price{font-family:'IBM Plex Mono', monospace; white-space:nowrap; color:var(--ink); font-size:1.05rem;}
.menu-download{margin-top:2.4rem; display:flex; align-items:center; gap:1rem; flex-wrap:wrap;}
.menu-download p{color:var(--stone); font-size:0.85rem;}

/* GALERIA */
.gallery-grid{display:grid; grid-template-columns:repeat(4, 1fr); grid-auto-rows:170px; gap:2px; background:var(--line);}
.gallery-grid a{grid-column:span 1; grid-row:span 1; overflow:hidden; position:relative; cursor:zoom-in;}
.gallery-grid a:nth-child(1){grid-column:span 2; grid-row:span 2;}
.gallery-grid a:nth-child(4){grid-row:span 2;}
.gallery-grid img{width:100%; height:100%; object-fit:cover; filter:grayscale(30%); transition:transform 0.4s ease, filter 0.4s ease;}
.gallery-grid a:hover img{transform:scale(1.06); filter:grayscale(0%);}
.lightbox{position:fixed; inset:0; background:rgba(22,20,15,0.94); z-index:100; display:none; align-items:center; justify-content:center; padding:4vw;}
.lightbox.open{display:flex;}
.lightbox img{max-height:85vh; max-width:90vw; object-fit:contain;}
.lightbox-close{position:absolute; top:2rem; right:3rem; color:#fff; font-size:1.4rem; background:rgba(255,255,255,0.12); border:none; cursor:pointer; width:44px; height:44px; border-radius:var(--r);}

/* NOSOTROS — editorial pull-quote */
.nosotros{display:grid; grid-template-columns:0.8fr 1.2fr; gap:3rem; align-items:center;}
.nosotros img{width:100%; aspect-ratio:4/5; object-fit:cover; filter:grayscale(25%);}
.nosotros .quote{font-family:'Space Grotesk',serif; font-weight:600; font-size:1.7rem; color:var(--ink); margin:1.6rem 0; line-height:1.35; border-left:3px solid var(--coral); padding-left:1.2rem;}
.nosotros p{color:var(--stone); margin-bottom:1.1rem;}
.signature{font-family:'IBM Plex Mono',monospace; font-size:0.85rem; color:var(--teal); margin-top:1.4rem;}

.timeline{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin-top:1rem; background:var(--line);}
.timeline-item{background:var(--surface); padding:1.6rem;}
.timeline-item .year{font-family:'IBM Plex Mono',monospace; font-weight:500; color:var(--coral); font-size:1.05rem;}
.timeline-item p{color:var(--stone); font-size:0.87rem; margin-top:0.5rem;}

/* TESTIMONIOS — horizontal scroll row */
.test-grid{display:flex; gap:1.2rem; overflow-x:auto; padding-bottom:0.6rem; scrollbar-width:thin;}
.test-card{background:var(--surface); border:1px solid var(--line); padding:1.8rem; display:flex; flex-direction:column; gap:1rem; min-width:300px; flex:1;}
.stars{color:var(--mustard); letter-spacing:0.12em; font-size:0.9rem;}
.test-card p{font-family:'Space Grotesk',sans-serif; font-weight:500; color:var(--ink); font-size:1rem;}
.test-name{font-family:'IBM Plex Mono',monospace; color:var(--stone); font-size:0.74rem; text-transform:uppercase; letter-spacing:0.05em;}

/* EVENTOS */
.eventos{display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center;}
.eventos img{width:100%; aspect-ratio:4/3; object-fit:cover; filter:grayscale(20%);}
.eventos ul{list-style:none; margin:1.5rem 0; display:flex; flex-direction:column; gap:0.7rem;}
.eventos li{color:var(--stone); padding-left:1.4rem; position:relative; font-size:0.95rem;}
.eventos li::before{content:'—'; position:absolute; left:0; color:var(--coral);}

.event-types{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:1rem; background:var(--line);}
.event-type{background:var(--surface); padding:2rem;}
.event-type .icon-badge-lg{margin-bottom:1.2rem;}
.event-type h3{font-size:1.1rem; margin-bottom:0.7rem;}
.event-type p{color:var(--stone); font-size:0.9rem;}

/* RESERVAS */
.reservas-inner{display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:start;}
.reservas .info p{color:var(--stone); margin-bottom:1.5rem;}
.info-line{display:flex; gap:1rem; padding:0.85rem 0; border-bottom:1px solid var(--line); font-size:0.92rem;}
.info-line span:first-child{font-family:'IBM Plex Mono',monospace; color:var(--stone); width:8rem; flex-shrink:0; text-transform:uppercase; font-size:0.72rem; letter-spacing:0.05em; padding-top:0.15rem;}

.floorplan{margin-top:1.2rem; border:1px solid var(--line); padding:1.6rem;}
.floorplan-legend{display:flex; gap:1.2rem; font-family:'IBM Plex Mono',monospace; font-size:0.7rem; color:var(--stone); margin-bottom:1rem; flex-wrap:wrap;}
.legend-dot{display:inline-block; width:9px; height:9px; margin-right:5px; vertical-align:middle;}
.table-seat{cursor:pointer; transition:opacity 0.2s ease;}
.table-seat:hover{opacity:0.85;}
.table-seat.occupied{cursor:not-allowed;}
.table-seat.insufficient{cursor:not-allowed; opacity:0.32;}

.res-step-label{
  display:flex; align-items:center; gap:0.6rem; margin:2rem 0 1rem;
  font-family:'IBM Plex Mono',monospace; font-size:0.78rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--ink);
}
.res-step-label:first-of-type{margin-top:1.6rem;}
.res-step-label .idx{
  width:1.6rem; height:1.6rem; border-radius:50%; background:var(--ink); color:var(--bg);
  display:flex; align-items:center; justify-content:center; font-size:0.68rem; flex-shrink:0;
}

.time-chips{display:flex; flex-wrap:wrap; gap:0.5rem; margin-bottom:0.7rem;}
.time-chip{
  font-family:'IBM Plex Mono',monospace; font-size:0.82rem; padding:0.5rem 0.9rem;
  border:1px solid var(--line); background:var(--surface); color:var(--ink); cursor:pointer; border-radius:var(--r);
  transition:all 0.15s ease;
}
.time-chip:hover{border-color:var(--ink);}
.time-chip.active{background:var(--ink); border-color:var(--ink); color:#fff;}

.res-summary{
  margin-top:1.8rem; border:1px solid var(--ink); padding:1.4rem 1.5rem;
}
.res-summary-title{font-family:'IBM Plex Mono',monospace; font-size:0.74rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--coral); margin-bottom:0.9rem;}
.res-summary-row{display:flex; justify-content:space-between; padding:0.5rem 0; border-bottom:1px solid var(--line); font-size:0.92rem;}
.res-summary-row:last-child{border-bottom:none;}
.res-summary-row span:first-child{color:var(--stone);}
.res-summary-row span:last-child{font-family:'IBM Plex Mono',monospace; font-weight:500;}

form{display:flex; flex-direction:column; gap:1.1rem;}
.field{display:flex; flex-direction:column; gap:0.45rem;}
.field label{font-family:'IBM Plex Mono',monospace; font-size:0.72rem; text-transform:uppercase; letter-spacing:0.04em; color:var(--stone);}
.row-2{display:grid; grid-template-columns:1fr 1fr; gap:1.1rem;}
input, select, textarea{background:var(--surface); border:1px solid var(--line); color:var(--ink); font-family:'Inter', sans-serif; font-size:1rem; padding:0.7rem 0.85rem; transition:border-color 0.2s ease; border-radius:var(--r);}
input:focus, select:focus, textarea:focus{outline:none; border-color:var(--coral);}
select option{background:var(--surface);}
textarea{resize:vertical; min-height:70px;}
form .btn{align-self:flex-start; margin-top:0.5rem; cursor:pointer; font:inherit; letter-spacing:0.02em;}
.selected-table-note{font-family:'IBM Plex Mono',monospace; font-size:0.8rem; color:var(--coral); min-height:1.2em;}

/* CONTACTO */
.contact-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:3rem;}
.contact-grid .info-line span:first-child{width:6rem;}
.map-embed{border:1px solid var(--line); height:100%; min-height:340px; overflow:hidden;}
.map-embed iframe{width:100%; height:100%; min-height:340px; border:0; filter:grayscale(80%);}

/* NEWSLETTER */
.newsletter{background:var(--sidebar-bg); color:#fff; text-align:center;}
.newsletter h2{font-size:clamp(1.4rem,3vw,2.1rem); margin-bottom:0.8rem; color:#fff;}
.newsletter p{color:rgba(255,255,255,0.65); max-width:44ch; margin:0 auto 1.8rem;}
.newsletter form{flex-direction:row; max-width:440px; margin:0 auto; gap:0.6rem;}
.newsletter input{flex:1; border:1px solid rgba(255,255,255,0.2); background:rgba(255,255,255,0.05); color:#fff; padding:0.8rem 1rem;}
.newsletter .btn{margin:0;}
.newsletter-msg{margin-top:1rem; color:rgba(255,255,255,0.7); font-size:0.85rem; display:none;}

/* ===== FOOTER — big wordmark band ===== */
.site-footer{background:var(--sidebar-bg); color:var(--sidebar-text); padding:0;}
.textile-stripe{display:none;}
.footer-top{display:grid; grid-template-columns:1.4fr 0.8fr 1fr 1fr; gap:3rem; padding:4rem 4vw 2.6rem; border-bottom:1px solid rgba(255,255,255,0.1);}
.footer-brand .logo{font-family:'Space Grotesk',sans-serif; font-size:2.4rem; color:#fff; display:block; margin-bottom:1rem; font-weight:700;}
.footer-brand .logo em{font-style:normal; color:var(--coral);}
.footer-brand p{color:var(--sidebar-text); font-size:0.92rem; max-width:32ch; margin-bottom:1.4rem;}
.footer-social{display:flex; gap:0.6rem;}
.footer-social a{width:36px; height:36px; border:1px solid rgba(255,255,255,0.16); display:flex; align-items:center; justify-content:center; transition:border-color 0.2s ease, background 0.2s ease;}
.footer-social a:hover{border-color:var(--coral); background:rgba(228,85,42,0.12);}
.footer-social svg{width:16px; height:16px; fill:#fff;}
.footer-col h4{font-family:'IBM Plex Mono',monospace; font-size:0.72rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--coral); margin-bottom:1.2rem;}
.footer-col ul{list-style:none; display:flex; flex-direction:column; gap:0.7rem;}
.footer-col a{color:var(--sidebar-text); font-size:0.9rem; transition:color 0.2s ease;}
.footer-col a:hover{color:#fff;}
.footer-col address{font-style:normal; color:var(--sidebar-text); font-size:0.9rem; display:flex; flex-direction:column; gap:0.7rem;}
.footer-hours-row{display:flex; justify-content:space-between; gap:1rem; font-size:0.85rem; color:var(--sidebar-text);}
.footer-hours-row span:last-child{color:#fff; font-family:'IBM Plex Mono',monospace;}
.footer-bottom{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; padding:1.3rem 4vw; color:var(--stone); font-family:'IBM Plex Mono',monospace; font-size:0.76rem;}
.footer-bottom a{color:var(--stone);}
.footer-bottom a:hover{color:#fff;}
.footer-legal{display:flex; gap:1.2rem;}

/* WHATSAPP FLOAT */
.wa-float{position:fixed; bottom:1.6rem; right:1.6rem; z-index:70; width:54px; height:54px; border-radius:50%; background:#25D366; display:flex; align-items:center; justify-content:center; border:1.5px solid #1fb958; transition:transform 0.2s ease;}
.wa-float:hover{transform:scale(1.06);}
.wa-float svg{width:26px; height:26px;}

@media (max-width: 1080px){
  .sidebar{width:76px; padding:1.6rem 0.8rem; align-items:center;}
  .sidebar .logo-sub, .sidebar nav a span:not(.idx), .sidebar-cta{display:none;}
  .sidebar nav a{justify-content:center;}
  .page{margin-left:76px;}
}
@media (max-width: 900px){
  .menu-grid, .nosotros, .eventos, .reservas-inner, .contact-grid{grid-template-columns:1fr;}
  .teasers, .specialties, .feature-grid, .timeline, .event-types{grid-template-columns:repeat(2,1fr);}
  .gallery-grid{grid-template-columns:repeat(2,1fr); grid-auto-rows:150px;}
  .gallery-grid a:nth-child(1){grid-column:span 2; grid-row:span 2;}
  .footer-top{grid-template-columns:1fr 1fr; gap:2.2rem;}
  .image-banner{height:36vh;}
}
@media (max-width: 620px){
  .teasers, .specialties, .feature-grid, .timeline, .event-types{grid-template-columns:1fr;}
  .gallery-grid{grid-template-columns:1fr; grid-auto-rows:210px;}
  .gallery-grid a:nth-child(1){grid-column:span 1; grid-row:span 1;}
  section{padding:3.6rem 5vw;}
  .hero-cta{flex-direction:column; align-items:stretch;}
  .hero-cta .btn{text-align:center;}
  .dish{flex-wrap:wrap;}
  .info-line{flex-direction:column; gap:0.3rem;}
  .info-line span:first-child{width:auto;}
  .wa-float{width:46px; height:46px; bottom:1.2rem; right:1.2rem;}
  .wa-float svg{width:22px; height:22px;}
  .image-banner{height:30vh; min-height:220px;}
  .test-card{min-width:82vw;}
}
@media (max-width: 700px){
  .sidebar{
    width:100%; height:auto; bottom:auto; flex-direction:row; align-items:center; justify-content:space-between;
    padding:1rem 1.2rem; transform:translateY(0);
  }
  .sidebar-top{flex-direction:row; align-items:center; gap:0.6rem;}
  .sidebar nav{position:fixed; top:64px; left:0; right:0; margin-top:0; background:var(--sidebar-bg); padding:1rem 1.2rem;
    transform:translateY(-110%); opacity:0; pointer-events:none; transition:all 0.25s ease; z-index:59;}
  .sidebar nav.open{transform:translateY(0); opacity:1; pointer-events:auto;}
  .sidebar nav a{justify-content:flex-start;}
  .sidebar nav a span:not(.idx){display:inline;}
  .sidebar-bottom{display:none;}
  .nav-toggle{display:block;}
  .page{margin-left:0; margin-top:64px;}
  .row-2{grid-template-columns:1fr;}
  .contours{display:none;}
  .newsletter form{flex-direction:column; gap:0.7rem;}
  .footer-top{grid-template-columns:1fr;}
}