/* ========================================================================
   RESET & BASE
   ======================================================================== */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  box-sizing: border-box;
}

/* Normalize any HTML5 elements for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
  display: block;
}
body {
  line-height: 1.6;
}
ol, ul {
  list-style: none;
}
a {
  text-decoration: none;
  color: inherit;
}
img, picture, svg {
  display: block;
  max-width: 100%;
  height: auto;
  border:0;
}

button, input, select, textarea {
  font-family: inherit;
  font-size: 1rem;
  background: none;
  border: none;
  outline: none;
}
button {
  cursor:pointer;
}


/* ========================================================================
   BRAND VARIABLES for LUXURY PREMIUM THEME
   ======================================================================== */
:root {
  --color-primary:#325441;
  --color-secondary:#A2CFA6;
  --color-accent: #E7E4D9;
  --color-black:#141610;
  --color-dark:#26271c;
  --color-neutral:#F7F6F2;
  --color-white:#fff;
  --color-gold:#C8AF6B;
  --color-gold-soft:#EFDCAC;
  --color-card-shadow:rgba(50,50,40,0.04);
  --color-border:#D2C89B;
  --transition-main: all 0.28s cubic-bezier(.34,1.36,.64,1);
  --radius-main: 20px;
  --radius-s: 12px;
  --shadow-card:0 4px 20px rgba(32,36,25,0.06), 0 1.5px 3.5px rgba(200,175,107,0.03);
  --font-display:'Nunito',sans-serif;
  --font-body:'Montserrat',sans-serif;
}

@media (max-width:480px) {
  html { font-size: 15px; }
}
@media (max-width:768px) {
  html { font-size: 16px; }
}
@media (min-width:769px) {
  html { font-size: 17px; }
}

body {
  background:var(--color-neutral);
  font-family:var(--font-body);
  color:var(--color-dark);
  font-size:1.08rem;
  min-height:100vh;
  letter-spacing:0.04em;
  -webkit-font-smoothing:antialiased;
  font-weight:400;
}

.container {
  width:100%;
  max-width:1280px;
  margin:0 auto;
  padding:0 20px;
  display:flex;
  flex-direction:column;
  gap:0px;
}

.content-wrapper {
  width:100%;
  display:flex;
  flex-direction:column;
  gap:24px;
  align-items:flex-start;
}

/* =======================================================================
   TYPOGRAPHY
   ======================================================================= */
h1, h2, h3, h4, h5, h6 {
  font-family:var(--font-display);
  color:var(--color-black);
  font-weight:800;
  line-height:1.2;
  margin-bottom:16px;
}
h1 {
  font-size:2.5rem;
  margin-top:0;
  margin-bottom:12px;
}
h2 {
  font-size:2rem;
  margin-bottom:8px;
}
h3 {
  font-size:1.35rem;
  font-weight:700;
}
h4,h5,h6 {
  font-size:1.1rem;
}

p {
  margin-bottom:12px;
  font-size:1rem;
  color:var(--color-primary);
  font-weight:400;
}
.content-wrapper > p:last-child,
.content-wrapper > ul:last-child {
  margin-bottom:0;
}

strong, b {
  font-weight:700;
  color:var(--color-black);
}

/* Lists */
ul, ol {
  margin-bottom: 12px;
}
ul li, ol li {
  margin-left: 1.2em;
  position: relative;
  margin-bottom: 8px;
  color: var(--color-primary);
  font-size: 1rem;
  padding-left: 0.5em;
}
ul li img {
  width: 26px;
  height: 26px;
  object-fit: contain;
  vertical-align: middle;
  margin-right: 12px;
  display: inline-block;
}

address {
  font-style: normal;
  color: var(--color-dark);
  font-size: 1rem;
  margin-bottom: 0.5em;
}


/* =======================================================================
   HEADER & NAVIGATION
   ======================================================================= */
header {
  background: var(--color-white);
  border-bottom: 1.5px solid var(--color-border);
  box-shadow: 0 1px 10px 0 rgba(50,84,65,0.04);
  position:sticky;
  top: 0;
  z-index: 99;
}
header .container {
  flex-direction:row;
  align-items:center;
  justify-content:space-between;
  gap:0px;
  min-height:70px;
}
header nav {
  display:flex;
  flex-direction:row;
  align-items:center;
  gap: 30px;
}
header nav a {
  font-family: var(--font-display);
  font-size: 1.03rem;
  font-weight:600;
  color: var(--color-primary);
  padding:8px 10px;
  border-radius:var(--radius-s);
  transition: var(--transition-main);
  position:relative;
  letter-spacing:0.03em;
}
header nav a:hover, header nav a:focus {
  background:var(--color-accent);
  color:var(--color-black);
  box-shadow:0 1.5px 4px #c8af6b22;
}
header img[alt="Verde Rifugio"]{
  height:38px;
  width:auto;
  display:block;
  margin-right:8px;
}

.mobile-menu-toggle {
  display: none;
  background: var(--color-gold);
  color: var(--color-black);
  border-radius: 50%;
  width: 48px;
  height: 48px;
  font-size:1.7rem;
  align-items:center;
  justify-content:center;
  transition: var(--transition-main);
  border: 2px solid var(--color-gold-soft);
  margin-left: 16px;
  z-index:105;
}
.mobile-menu-toggle:hover,
.mobile-menu-toggle:focus {
  background: var(--color-white);
  color: var(--color-primary);
  border-color: var(--color-gold);
}

/* =======================================================================
   MOBILE MENU OVERLAY
   ======================================================================= */
.mobile-menu {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap:0;
  position: fixed;
  top: 0; left: 0; bottom:0; right: 0;
  width:100vw;
  height:100vh;
  background:rgba(232,227,211,0.98);
  z-index:150;
  transform: translateX(100vw);
  transition: transform 0.44s cubic-bezier(.68,-0.55,.27,1.55);
  box-shadow: -12px 0 32px 0 rgba(50,84,65,0.07);
  overflow-y: auto;
  pointer-events: none;
  opacity:0;
}
.mobile-menu.active {
  transform: translateX(0);
  pointer-events: auto;
  opacity:1;
}
.mobile-menu-close {
  background: var(--color-gold);
  border: none;
  border-radius: 50%;
  color: var(--color-black);
  font-size: 2.2rem;
  width: 56px;
  height: 56px;
  align-self: flex-end;
  margin: 18px 18px 0 0;
  box-shadow: 0 2px 7px #c8af6b21;
  transition: var(--transition-main);
  z-index:155;
}
.mobile-menu-close:hover { 
  background:var(--color-white);
  color:var(--color-primary);
  border:2.5px solid var(--color-gold);
}
.mobile-nav {
  display: flex;
  flex-direction: column;
  gap: 18px;
  margin: 24px 0 0 32px;
}
.mobile-nav a {
  font-size: 1.3rem;
  font-family: var(--font-display);
  color: var(--color-dark);
  font-weight:700;
  padding: 12px 8px;
  border-radius: var(--radius-s);
  transition: var(--transition-main);
}
.mobile-nav a:hover, .mobile-nav a:focus {
  background: var(--color-gold-soft);
  color:var(--color-black);
  box-shadow: 0 3px 8px #4e442620;
}

@media (max-width:1079px) {
  header nav {
    display: none;
  }
  .mobile-menu-toggle {
    display: flex;
  }
}
@media (min-width:1080px) {
  .mobile-menu { display: none !important; }
  .mobile-menu-toggle { display: none !important; }
  header nav { display: flex !important; }
}

/* =======================================================================
   SECTIONS, LAYOUTS, FLEXBOX SPACING
   ======================================================================= */
section {
  margin-bottom:60px;
  padding:40px 20px;
  background:var(--color-white);
  border-radius:var(--radius-main);
  box-shadow:0 2.5px 19px var(--color-card-shadow);
  display:flex;
  flex-direction:column;
  gap:0;
}
/* Remove white for hero/cta on index (not to clash) */
section:nth-of-type(odd):not(.no-style) {
  background:var(--color-accent);
}
/* First hero always larger*/
main > section:first-child {
  background:var(--color-neutral);
  border:none;
  box-shadow:none;
  padding-top:48px;
}

.card-container {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}
.card {
  margin-bottom:20px;
  position:relative;
  border-radius:var(--radius-main);
  background:var(--color-white);
  box-shadow: var(--shadow-card);
  padding:32px 28px;
  transition:box-shadow var(--transition-main), border-color 0.24s;
  border:1.5px solid var(--color-border);
}
.card:hover {
  box-shadow:0 10px 36px #35170018, 0 1px 3px #c8af6b14;
  border-color:var(--color-gold);
}

.content-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: space-between;
}

.text-image-section {
  display: flex;
  align-items: center;
  gap: 30px;
  flex-wrap: wrap;
}
@media (max-width: 768px) {
  .text-image-section {
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
  }
}

.testimonial-card {
  display:flex;
  align-items:center;
  gap:20px;
  padding:20px 30px;
  margin-bottom: 20px;
  background:var(--color-white);
  border-radius:var(--radius-s);
  box-shadow:0 2px 9px #c8af6b10;
  border-left: 6px solid var(--color-gold);
}
.testimonial-card blockquote {
  color:var(--color-black);
  font-style:italic;
  font-size:1.08rem;
  margin-bottom:0;
  quotes: "\201C" "\201D" "\2018" "\2019";
}
.testimonial-card blockquote:before {
  content: open-quote;
  color: var(--color-gold);
  font-size:1.7em;
  vertical-align: -0.2em;
  margin-right:3px;
  font-weight:700;
}
.testimonial-card > div {
  color:var(--color-dark);
  font-size:1rem;
  font-family:var(--font-body);
  font-weight:600;
  margin-left:auto;
}

.feature-item {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:15px;
}

.product-list, .articles-grid, .blog-teasers {
  display:flex;
  flex-wrap:wrap;
  gap:24px;
  margin-top:12px;
}
.product-card, .blog-card {
  flex:1 1 240px;
  min-width:240px;
  max-width:340px;
  margin-bottom:20px;
  border-radius:var(--radius-s);
  box-shadow: var(--shadow-card);
  background:var(--color-white);
  border:1px solid var(--color-border);
  padding:28px 18px;
  display:flex;
  flex-direction:column;
  gap:16px;
  transition:box-shadow var(--transition-main), border-color 0.24s;
  position:relative;
}
.product-card:hover, .blog-card:hover {
  border-color:var(--color-gold);
  box-shadow:0 8px 26px #c8af6b16,0 1px 3px #6d661020;
}
.product-card h2, .blog-card h2 {
  font-size:1.25rem;
  color:var(--color-primary);
  font-weight:800;
  margin-bottom:0.6em;
}
.product-card .badge {
  background:var(--color-gold);
  color:var(--color-white);
  border-radius:10px;
  font-size:0.93em;
  font-family:var(--font-display);
  font-weight:700;
  padding:3.5px 12px;
  margin-left:10px;
  vertical-align:middle;
  letter-spacing:0.05em;
}

.articles-grid {
  width:100%;
}

@media (max-width:900px) {
  .product-list, .articles-grid, .blog-teasers {
    flex-direction:column;
    gap:22px;
  }
}

.faq-accordion {
  display: flex;
  flex-direction: column;
  gap:20px;
}
.faq-accordion > div {
  background: var(--color-accent);
  border-radius: var(--radius-s);
  padding:20px 18px;
  box-shadow: 0 1.5px 6px #efdcac11;
  border-left: 5px solid var(--color-gold);
}
.faq-accordion h3 {
  font-size:1.11rem;
  color: var(--color-primary);
  font-family: var(--font-display);
}
.faq-accordion p {
  font-size: 0.97rem;
  color: var(--color-dark);
}
.tips {
  background: var(--color-white);
  border-radius: var(--radius-s);
  padding: 9px 16px;
  font-size: 1.01rem;
  color: var(--color-secondary);
  border-left: 4px solid var(--color-secondary);
  margin-top: 8px;
}


/* =======================================================================
   BUTTONS, CTAs, BADGES
   ======================================================================= */
.cta, button, .product-list button, .articles-grid button {
  background:var(--color-gold);
  color:var(--color-black);
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.11rem;
  padding: 12px 28px;
  border: none;
  border-radius: 25px;
  box-shadow: 0 2px 13px #c8af6b18;
  cursor:pointer;
  transition: var(--transition-main);
  margin-top: 6px;
  margin-bottom: 8px;
}
.cta.primary {
  background: var(--color-primary);
  color: var(--color-white);
  border:2px solid var(--color-gold);
}
.cta.secondary {
  background: var(--color-gold);
  color: var(--color-black);
  border:2px solid var(--color-primary);
}
.cta:hover, .cta:focus, button:hover, .product-list button:hover, .cta.primary:hover, .cta.secondary:hover {
  background: var(--color-gold-soft);
  color: var(--color-primary);
  box-shadow:0 4px 16px #c8af6b21,0 1px 3px #6d661020;
  border-color:var(--color-gold);
}
button:active, .cta:active {
  background:var(--color-gold);
  color:var(--color-black);
  opacity:0.87;
}

/* Inline or category filter buttons (not main CTA) */
.content-wrapper > div > button,
.content-wrapper > button,
div > button {
  display:inline-flex;
  align-items:center;
  gap:4px;
  font-family:var(--font-body);
  font-weight:500;
  font-size:1.01rem;
  background: var(--color-accent);
  color:var(--color-primary);
  border: 1px solid var(--color-border);
  padding:7px 19px;
  border-radius:18px;
  margin-right:6px;
  margin-bottom:8px;
  box-shadow:none;
  transition:var(--transition-main);
}
.content-wrapper > div > button:hover, .content-wrapper > div > button:focus {
  border-color: var(--color-gold);
  background:var(--color-gold-soft);
  color:var(--color-black);
  font-weight:700;
}

/* =======================================================================
   BADGES, LABELS
   ======================================================================= */
.badge {
  display:inline-block;
  padding: 2.5px 9px;
  background: var(--color-gold);
  color: var(--color-white);
  font-size: 0.88rem;
  font-family: var(--font-display);
  border-radius: 9px;
  margin-left:7px;
  vertical-align:middle;
  letter-spacing:0.04em;
}


/* =======================================================================
   FOOTER
   ======================================================================= */
footer {
  background: var(--color-primary);
  color: var(--color-accent);
  padding: 40px 0 32px 0;
  border-top:2px solid var(--color-gold);
  font-size: 1rem;
}
footer .container {
  align-items:center;
  justify-content:center;
  gap:16px;
  text-align:center;
  flex-direction:column;
}
footer nav {
  margin: 18px auto 8px auto;
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:16px;
  justify-content:center;
}
footer nav a {
  color: var(--color-gold);
  font-family:var(--font-display);
  font-size:1.07rem;
  font-weight:400;
  padding:4px 4px;
  border-radius:8px;
  transition: var(--transition-main);
}
footer nav a:hover {
  background: var(--color-gold);
  color: var(--color-primary);
  font-weight:700;
}
footer img[alt="Verde Rifugio"] {
  height:32px;
  margin:0 auto 6px auto;
}
.contact-details {
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  gap:20px;
  align-items:center;
  justify-content:center;
  font-family:var(--font-body);
  margin-bottom:8px;
  font-size:0.99rem;
}
.contact-details span {
  display:flex;
  align-items:center;
  gap:8px;
}
.contact-details img {
  width:22px;
  height:22px;
}
footer small {
  display:block;
  color: var(--color-gold);
  margin-top: 14px;
  font-size: 0.94rem;
  opacity:0.78;
}

/* =======================================================================
   RESPONSIVE RULES
   ======================================================================= */
@media (max-width:900px) {
  .container {
    padding-left:8px; padding-right:8px;
  }
  section {
    padding:28px 7px;
  }
  .card, .product-card, .blog-card {
    padding:18px 7px;
  }
}
@media (max-width:768px) {
  section {
    padding:25px 2px;
    margin-bottom:40px;
  }
  .container {
    padding-left:3px; padding-right:3px;
  }
  .content-wrapper {
    padding:0 2px;
  }
  h1 { font-size:2.15rem; }
  h2 { font-size:1.4rem; margin-bottom:2px;}
  h3 { font-size:1.1rem; }
  .product-card, .blog-card {
    min-width:94%;
    max-width:100%;
  }
  .testimonial-card {
    padding:15px 8px;
    font-size:1rem;
  }
  .contact-details {
    flex-direction: column;
    align-items: flex-start;
    gap:6px;
  }
}

@media (max-width:540px) {
  h1{font-size:1.45rem;}
  h2{font-size:1.1rem;}
}

/* =======================================================================
   COOKIE CONSENT BANNER
   ======================================================================= */
.cookie-banner {
  position: fixed;
  bottom: 0;
  left: 0; right:0;
  background: var(--color-white);
  color: var(--color-primary);
  border-top: 2.5px solid var(--color-gold);
  box-shadow: 0 -2px 20px #c8af6b19;
  width: 100vw;
  z-index:2000;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 22px 18px 22px 16px;
  gap: 18px;
  opacity:1;
  transition:transform 0.5s cubic-bezier(.68,-0.6,.32,1.6), opacity 0.33s;
}
.cookie-banner.hide {
  transform:translateY(100%);
  opacity:0;
  pointer-events:none;
}
.cookie-banner__message {
  font-size: 1.02rem;
  color: var(--color-dark);
  max-width:460px;
  margin-right:8px;
}
.cookie-banner__actions {
  display: flex;
  flex-direction: row;
  gap:12px;
}
.cookie-banner button {
  padding:9px 21px;
  border-radius:19px;
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.01rem;
  border:none;
  background:var(--color-gold-soft);
  color:var(--color-black);
  transition: var(--transition-main);
  outline:none;
  margin:1px 0;
}
.cookie-banner .accept-btn {
  background:var(--color-gold);
  color:var(--color-white);
}
.cookie-banner .accept-btn:hover {
  background:var(--color-primary);
  color:var(--color-gold);
}
.cookie-banner .reject-btn {
  background:var(--color-white);
  color:var(--color-primary);
  border:2px solid var(--color-gold);
}
.cookie-banner .reject-btn:hover {
  background:var(--color-gold-soft);
  color:var(--color-black);
}
.cookie-banner .settings-btn {
  background:var(--color-secondary);
  color:var(--color-primary);
}
.cookie-banner .settings-btn:hover {
  background:var(--color-gold-soft);
  color:var(--color-black);
}
@media (max-width: 600px) {
  .cookie-banner {
    flex-direction:column;
    align-items:flex-start;
    gap:14px;
    padding:16px 7px 16px 6px;
  }
}

/* Cookie Settings Modal */
.cookie-modal {
  position:fixed;
  top:0; left:0; right:0; bottom:0;
  z-index:2500;
  background:rgba(44,43,32,0.44);
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
  opacity:0;
  transition: opacity 0.25s;
}
.cookie-modal.active {
  pointer-events:auto;
  opacity:1;
}
.cookie-modal__dialog {
  background:var(--color-white);
  border-radius:var(--radius-main);
  box-shadow:0 12px 60px #c8af6b26, 0 2px 10px #14161015;
  padding: 30px 38px 30px 32px;
  min-width:280px;
  max-width:96vw;
  width:420px;
  display:flex;
  flex-direction:column;
  gap:18px;
  position:relative;
  animation:cookieModalShow 0.45s cubic-bezier(.38,1.04,.64,1.18);
}
@keyframes cookieModalShow {
  0% { transform:scale(0.93) translateY(32px); opacity:0; }
  100% { transform:scale(1) translateY(0); opacity:1; }
}
.cookie-modal__close {
  position:absolute;
  top:14px; right:14px;
  background:var(--color-gold);
  border:none;
  width:38px; height:38px;
  border-radius:50%;
  font-size:1.6rem;
  color:var(--color-black);
  display:flex; align-items:center; justify-content:center;
  transition: var(--transition-main);
}
.cookie-modal__close:hover, .cookie-modal__close:focus {
  background:var(--color-primary);
  color:var(--color-gold);
}
.cookie-modal__title {
  font-size:1.3rem;
  font-family:var(--font-display);
  color:var(--color-primary);
  font-weight:700;
}
.cookie-modal__categories {
  display:flex;
  flex-direction:column;
  gap:13px;
  margin-bottom:16px;
  margin-top:3px;
}
.cookie-category {
  background:var(--color-accent);
  border-radius:var(--radius-s);
  padding:13px 17px;
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:12px;
  font-size:1.04rem;
  color:var(--color-primary);
  border:1px solid var(--color-border);
}
.cookie-category .toggle {
  margin-left:auto;
}
.cookie-category .toggle input[type=checkbox] {
  display:none;
}
.cookie-category .toggle label {
  cursor:pointer;
  width:38px; height:22px;
  background: var(--color-secondary);
  border-radius:14px;
  position:relative;
  display:block;
  transition: background 0.2s;
  border:1px solid var(--color-gold);
}
.cookie-category .toggle label:before {
  content:'';
  position:absolute;
  left:3px; top:3px; width:16px; height:16px;
  background:var(--color-white);
  border-radius:12px;
  transition:transform 0.23s cubic-bezier(.44,1.2,.7,.7);
  box-shadow: 0 1.5px 4px #c8af6b22;
}
.cookie-category .toggle input[type=checkbox]:checked + label {
  background: var(--color-gold);
}
.cookie-category .toggle input[type=checkbox]:checked + label:before {
  transform:translateX(16px);
}
/* Essential Cookies - Always on */
.cookie-category.essential .toggle label {
  background:var(--color-accent);
  opacity:0.85;
  pointer-events:none;
  border:1px dashed var(--color-secondary);
}
.cookie-category.essential .toggle label:before {
  background:var(--color-gold);
}
.cookie-modal__actions {
  margin-top:3px;
  display:flex;
  flex-direction:row;
  gap:15px;
}
.cookie-modal__actions button {
  padding:9px 19px;
  border-radius:16px;
  font-size:1.04rem;
  font-family:var(--font-display);
  font-weight:700;
  border:none;
  background:var(--color-gold);
  color:var(--color-white);
  transition: var(--transition-main);
  margin:1px 0;
}
.cookie-modal__actions button.secondary {
  background:var(--color-secondary);
  color:var(--color-primary);
}
.cookie-modal__actions button:hover,
.cookie-modal__actions button.secondary:hover {
  background:var(--color-gold-soft);
  color:var(--color-black);
}
@media (max-width:540px){
  .cookie-modal__dialog {
    padding:15px 4vw;
    min-width:90vw;
    max-width:97vw;
  }
}

/* =======================================================================
   MICRO-INTERACTIONS & UTILITY
   ======================================================================= */
.card, .product-card, .blog-card, .testimonial-card, .faq-accordion > div, .cookie-modal__dialog {
  transition:box-shadow 0.28s, border-color 0.22s;
}
.cta, .cta.primary, .cta.secondary, button, .cookie-banner button, .cookie-modal__actions button {
  transition:background 0.22s,color 0.22s,box-shadow 0.28s,border-color 0.19s;
}

/* Decorative gold underline for luxury headings */
h1, h2 {
  position:relative;
}
h2:after, h1:after {
  content:'';
  display:block;
  width: 50px;
  height: 3.5px;
  background: var(--color-gold);
  border-radius: 2px;
  margin-top: 8px;
}
h1:after {
  width: 83px;
  height: 4.5px;
  margin-top: 12px;
}

/* Improved accessibility: focus outline */
a:focus, button:focus, .cta:focus {
  outline:2.5px solid var(--color-gold);
  outline-offset:2px;
}

/* Hide visually but accessible (for accessibility, optional)*/
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}

/* =======================================================================
   MISC (forms, newsletter, addresses, etc.)
   ======================================================================= */
input[type="text"],
input[type="email"],
input[type="tel"],
textarea {
  width: 100%;
  padding: 12px 15px;
  border-radius: var(--radius-s);
  border: 1px solid var(--color-border);
  font-family: var(--font-body);
  font-size: 1rem;
  margin-bottom: 18px;
  background: var(--color-accent);
  color: var(--color-dark);
  box-shadow: 0 2px 9px #c8af6b09;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
textarea:focus {
  border-color: var(--color-gold);
  background: var(--color-white);
}

/* Newsletter signup (acts like section) */
.newsletter {
  background: var(--color-accent);
  border-radius: var(--radius-main);
  padding: 32px 18px;
  box-shadow: 0 1.5px 9px #a2cfa610;
  margin-bottom:20px;
}

/* =======================================================================
   PRINT
   ======================================================================= */
@media print {
  header, footer, .cookie-banner, .mobile-menu { display:none !important; }
  section, .container { box-shadow:none; border-radius:0; background:#fff !important; }
}
