:root {

    /* ======================================================================
       Typography
       ====================================================================== */

    --cms-font-sans: "Acumin Pro", sans-serif;
	
    --cms-font-serif: "The Silver Editorial Normal", serif;
	--cms-font-script: "The Silver Editorial", serif;
	
	--cms-font-light: 300;

    --cms-font-regular: 400;
    --cms-font-medium: 500;
    --cms-font-semibold: 600;
	--cms-font-bold: 700;

}


@font-face {
    font-family: "Acumin Pro";
    src: url("../fonts/acumin-pro.woff2") format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
	 
}

@font-face {
    font-family: "The Silver Editorial";
    src: url("../fonts/TheSilverEditorial-Italic.woff") format("woff");
    font-weight: 400;
    font-style: italic;
    font-display: swap;
	
} 


@font-face {
    font-family: "The Silver Editorial Normal";
    src: url("../fonts/TheSilverEditorial-Regular.woff") format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
	
}

   
  




/* =============================================
       RESET & BASE
    ============================================= */
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    :root {
      --ocean:    #f1eada;
      --adriatic: #b59e7d;
      --gold:     #c3a283;
      --sand:     #584738;
      --white:    #FFFFFF;
      --charcoal: #113c5f;
      --mid:      #aaa396;
      --border:   #f1ece9;

      --ff-display: 'The Silver Editorial Normal', Georgia, serif;
      --ff-body:    'Acumin Pro', system-ui, sans-serif;

      --max-w: 1200px;
      --section-gap: 100px;
    }

    html { scroll-behavior: smooth; }

    body {
      font-family: var(--ff-body);
      background: var(--white);
      color: var(--charcoal);
      font-size: 16px;
      line-height: 1.6;
      overflow-x: hidden;
    }

    img { display: block; width: 100%; object-fit: cover; }
    a   { text-decoration: none; color: inherit; }
    ul  { list-style: none; }

    .container {
      max-width: var(--max-w);
      margin: 0 auto;
      padding: 0 24px;
    }

    /* =============================================
       NAVBAR
    ============================================= */
    .navbar {
      position: fixed;
      top: 0; left: 0; right: 0;
      z-index: 1000;
      padding: 0 40px;
      height: 72px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      background: #f1eada;
      backdrop-filter: blur(0px);
      border-bottom: 1px solid transparent;
      transition: background 0.4s, backdrop-filter 0.4s, border-color 0.4s;
    }

    .navbar.scrolled {
      background: #f1eada;
      backdrop-filter: blur(12px);
      border-bottom-color: rgba(201, 169, 110, 0.2);
    }

    .nav-logo {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 1px;
    }

    .nav-logo-name {
      font-family: var(--ff-display);
      font-size: 22px;
      font-weight: 500;
      letter-spacing: 0.08em;
      color: #584738;
      line-height: 1;
	  width: 180px;
    }

    .nav-logo-tag {
      font-family: var(--ff-body);
      font-size: 9px;
      font-weight: 400;
      letter-spacing: 0.3em;
      text-transform: uppercase;
      color: #584738;
    }

    .nav-links {
      display: flex;
      align-items: center;
      gap: 36px;
    }

    .nav-links a {
      font-size: 11px;
      font-weight: 500;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: #584738;
      transition: color 0.2s;
      position: relative;
    }

    

    .nav-links a:hover { color: #aaa396; }
    .nav-links a:hover::after { transform: scaleX(1); }

    

    /* Hamburger */
    .hamburger {
      display: none;
      flex-direction: column;
      gap: 5px;
      cursor: pointer;
      padding: 4px;
	  background: none;
	  border: none;
    }

    .hamburger span {
      width: 30px; height: 2px;
      background: #584738;
      display: block;
      transition: 0.3s;
    }

    /* Mobile Menu */
    .mobile-menu {
      display: none;
      position: fixed;
      top: 72px; left: 0; right: 0; bottom: 0;
      background: var(--ocean);
      z-index: 999;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 40px;
    }

    .mobile-menu.open { display: flex; }

    .mobile-menu a {
      font-family: var(--ff-display);
      font-size: 25px;
      font-weight: 300;
      color: #584738;
      letter-spacing: 0.05em;
      transition: color 0.2s;
	  text-transform: uppercase;
    }

    .mobile-menu a:hover { color: #aaa396; }

    /* =============================================
       HERO
    ============================================= */
    .hero {
      position: relative;
      min-height: 100svh;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      background: var(--ocean);
    }

    .hero-bg {
      position: absolute;
      inset: 0;
      background:
        linear-gradient(to bottom, rgba(88, 71, 56, 0.78) 0%, rgba(88, 71, 56, 0.55) 45%, rgba(88, 71, 56,0.88) 100%),
        url('../img/travel-guides-travel-with-pipa.webp') center/cover no-repeat;
      transform: scale(1.04);
      animation: heroZoom 12s ease-out forwards;
    }

    @keyframes heroZoom {
      from { transform: scale(1.04); }
      to   { transform: scale(1.0); }
    }

    /* Signature: giant PIPA watermark */
    .hero-watermark {
      position: absolute;
      bottom: -2%;
      left: 50%;
      transform: translateX(-50%);
      font-family: var(--ff-display);
      font-size: clamp(160px, 28vw, 380px);
      font-weight: 600;
      letter-spacing: -0.02em;
      color: transparent;
      -webkit-text-stroke: 1px rgba(255,255,255,0.1);
      white-space: nowrap;
      pointer-events: none;
      line-height: 0.85;
      user-select: none;
    }

    .hero-content {
      position: relative;
      z-index: 2;
      text-align: center;
      padding: 0 24px;
      max-width: 920px;
    }

    .hero-eyebrow {
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.35em;
      text-transform: uppercase;
      color: #f1eada;
      margin-bottom: 20px;
    }

    .hero-headline {
      font-family: var(--ff-display);
      font-size: clamp(40px, 9vw, 60px);
      font-weight: 400;
      color: var(--white);
      line-height: 1.35;
      margin-bottom: 10px;
	  text-transform: uppercase;
    }

    .hero-headline em {
      font-style: normal;
      font-weight: 400;
      color: #f1eada;
	  text-transform: uppercase;
    }

    .hero-sub {
      font-size: 16px;
      font-weight: 300;
      letter-spacing: 0em;
      text-transform: none;
      color: #f1eada;
      margin-bottom: 48px;
	  margin-top: 48px;
    }

    .hero-btns {
      display: flex;
      gap: 16px;
      justify-content: center;
      flex-wrap: wrap;
    }

    .btn-primary {
      display: inline-block;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      background: #f1eada;
      color: #584738;
      padding: 14px 36px;
      transition: background 0.25s, transform 0.2s;
    }

    .btn-primary:hover { background: #cec1a8; color:#f1eada; transform: translateY(-1px); }

    .btn-outline {
      display: inline-block;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: #584738;
      border: none;
      padding: 14px 36px;
	  background: #cec1a8;
      transition: border-color 0.25s, background 0.25s;
    }

    .btn-outline:hover { border-color: none; color: #f1eada; background: #b59e7d; }

    .hero-scroll {
      position: absolute;
      bottom: 32px;
      left: 50%;
      transform: translateX(-50%);
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 10px;
      z-index: 2;
    }

    .hero-scroll span {
      font-size: 9px;
      letter-spacing: 0.3em;
      text-transform: uppercase;
      color: #f1eada;
    }

    .scroll-line {
      width: 1px; height: 50px;
      background: linear-gradient(to bottom, rgba(255,255,255,0.5), transparent);
      animation: scrollPulse 2s ease-in-out infinite;
    }

    @keyframes scrollPulse {
      0%, 100% { opacity: 0.5; }
      50%       { opacity: 1; }
    }

    /* =============================================
       SECTION LABELS
    ============================================= */
    .section-label {
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.35em;
      text-transform: uppercase;
      color: #cec1a8;
      margin-bottom: 14px;
    }

    .section-title {
      font-family: var(--ff-display);
      font-size: clamp(34px, 5vw, 46px);
      font-weight: 300;
      line-height: 1.2;
      color: #f1eada;
	  text-transform: uppercase;
    }

    .section-title em { font-style: italic; }

    .section-title.light { color: var(--white); }

    .section-body {
      font-size: 15px;
      font-weight: 300;
      color: var(--mid);
      max-width: 540px;
      line-height: 1.75;
    }

    .divider {
      width: 40px; height: 1px;
      background: var(--gold);
      margin: 24px 0;
	  text-align: center !important;
    }

    /* =============================================
       FEATURED STRIP (stats)
    ============================================= */
    .strip {
      background: #cec1a8;
      padding: 40px 0;
    }

    .strip-inner {
      display: flex;
      justify-content: center;
      gap: 64px;
      flex-wrap: wrap;
    }

    .strip-stat {
      text-align: center;
    }

    .strip-num {
      font-family: var(--ff-display);
      font-size: 40px;
      font-weight: 300;
      color: #584738;
      line-height: 1;
    }

    .strip-label {
      font-size: 9px;
      font-weight: 500;
      letter-spacing: 0.28em;
      text-transform: uppercase;
      color: #b59e7d;
      margin-top: 6px;
    }

    /* =============================================
       DESTINOS
    ============================================= */
    .destinos {
      padding: var(--section-gap) 0;
      background: #f1eada;
    }
	
	.destinos .section-label { color: #b59e7d; }
	
	.destinos .section-title { color: #584738; }

    .destinos-header {
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
      margin-bottom: 56px;
      gap: 24px;
      flex-wrap: wrap;
    }

    .destinos-tabs {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }

    .tab-btn {
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      padding: 8px 18px;
      border: 1px solid #584738;
      background: transparent;
      color: #584738;
      cursor: pointer;
      transition: all 0.2s;
    }

    .tab-btn.active, .tab-btn:hover {
      background: var(--ocean);
      border-color: #b59e7d;
      color: #b59e7d;
    }

    /* Cards grid */
    .cards-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 2px;
    }

    .card {
      position: relative;
      overflow: hidden;
      aspect-ratio: 3/4;
      cursor: pointer;
    }

    .card:first-child {
      grid-row: span 2;
      aspect-ratio: unset;
    }

    .card-img {
      width: 100%; height: 100%;
      object-fit: cover;
      transition: transform 0.6s ease;
    }

    .card:hover .card-img { transform: scale(1.05); }

    .card-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(88, 71, 56,0.88) 0%, transparent 55%);
      transition: opacity 0.3s;
    }

    .card-body {
      position: absolute;
      bottom: 0; left: 0; right: 0;
      padding: 28px 24px;
    }

    .card-region {
      font-size: 8px;
      font-weight: 600;
      letter-spacing: 0.3em;
      text-transform: uppercase;
      color: #b59e7d;
      margin-bottom: 6px;
    }

    .card-name {
      font-family: var(--ff-display);
      font-size: 22px;
      font-weight: 400;
      color: #f1eada;
      line-height: 1.2;
      margin-bottom: 6px;
	  text-transform: uppercase;
    }

    .card-desc {
      font-size: 12px;
      font-weight: 300;
      color: #f1eada;
      letter-spacing: 0.04em;
    }

    .card-cta {
      display: inline-block;
      margin-top: 14px;
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: #f1eada;
      border: 1px solid #f1eada;
      padding: 7px 16px;
      transition: all 0.2s;
      opacity: 0;
      transform: translateY(6px);
      transition: opacity 0.3s, transform 0.3s, background 0.2s;
    }

    .card:hover .card-cta {
      opacity: 1;
      transform: translateY(0);
    }

    .card-cta:hover { background: #f1eada; color: #584738; }

    /* =============================================
       ROTEIROS (Blog preview)
    ============================================= */
    .roteiros {
      padding: var(--section-gap) 0;
      background: var(--white);
    }

    .roteiros-header {
      text-align: center;
      margin-bottom: 60px;
    }

    .roteiros-header .section-body {
      margin: 0 auto;
      text-align: center;
    }

    .posts-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 40px;
    }

    .post-card {
      display: flex;
      flex-direction: column;
    }

    .post-img-wrap {
      position: relative;
      overflow: hidden;
      aspect-ratio: 4/3;
      margin-bottom: 24px;
    }

    .post-img {
      width: 100%; height: 100%;
      object-fit: cover;
      transition: transform 0.5s;
    }

    .post-card:hover .post-img { transform: scale(1.04); }

    .post-tag {
      position: absolute;
      top: 16px; left: 16px;
      font-size: 8px;
      font-weight: 600;
      letter-spacing: 0.25em;
      text-transform: uppercase;
      background: var(--gold);
      color: var(--ocean);
      padding: 5px 12px;
    }

    .post-date {
      font-size: 10px;
      letter-spacing: 0.15em;
      color: var(--mid);
      margin-bottom: 8px;
    }

    .post-title {
      font-family: var(--ff-display);
      font-size: 16px;
      font-weight: 400;
      color: #584738;
      line-height: 1.25;
      margin-bottom: 10px;
	  text-transform: uppercase;
    }

    .post-excerpt {
      font-size: 13px;
      font-weight: 300;
      color: var(--mid);
      line-height: 1.7;
      flex: 1;
      margin-bottom: 18px;
    }

    .post-link {
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--adriatic);
      display: flex;
      align-items: center;
      gap: 8px;
      transition: gap 0.2s;
    }

    .post-link::after { content: '→'; }
    .post-card:hover .post-link { gap: 14px; }

    /* =============================================
       EBOOKS
    ============================================= */
    .ebooks {
      padding: var(--section-gap) 0;
      background: var(--ocean);
      position: relative;
      overflow: hidden;
    }

    .ebooks::before {
      content: 'EBOOKS';
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      font-family: var(--ff-display);
      font-size: clamp(80px, 16vw, 220px);
      font-weight: 600;
      color: transparent;
      -webkit-text-stroke: 1px rgba(255,255,255,0.04);
      white-space: nowrap;
      pointer-events: none;
      letter-spacing: 0.1em;
    }

    .ebooks-inner {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 80px;
      align-items: center;
    }

    .ebooks-text .section-body { color: #aaa396; }

    .ebooks-list {
      display: flex;
      flex-direction: column;
      gap: 16px;
      margin-top: 36px;
    }

    .ebook-item {
      display: flex;
      align-items: center;
      gap: 18px;
      padding: 18px 20px;
      border: 1px solid rgba(255,255,255,0.1);
      background: rgba(255,255,255,0.04);
      transition: border-color 0.2s, background 0.2s;
      cursor: pointer;
    }

    .ebook-item:hover {
      border-color: rgba(201,169,110,0.4);
      background: rgba(201,169,110,0.06);
    }

    .ebook-cover {
      width: 52px;
      height: 68px;
      object-fit: cover;
      flex-shrink: 0;
    }

    .ebook-info { flex: 1; }

    .ebook-cat {
      font-size: 8px;
      letter-spacing: 0.25em;
      text-transform: uppercase;
      color: #b59e7d;
      margin-bottom: 4px;
    }

    .ebook-title {
      font-family: var(--ff-display);
      font-size: 17px;
      color: #584738;
      margin-bottom: 4px;
    }

    .ebook-price {
      font-size: 12px;
      color: #aaa396;
      font-weight: 300;
    }

    .ebook-arrow {
      font-size: 18px;
      color: var(--gold);
      opacity: 0;
      transition: opacity 0.2s, transform 0.2s;
    }

    .ebook-item:hover .ebook-arrow { opacity: 1; transform: translateX(4px); }

    .ebooks-visual {
      position: relative;
    }

    .ebooks-mockup {
      width: 100%;
      aspect-ratio: 4/5;
      object-fit: cover;
      position: relative;
      z-index: 1;
    }

    .ebooks-accent {
      position: absolute;
      top: -20px; right: -20px;
      width: 60%; height: 60%;
      border: 1px solid rgba(201,169,110,0.25);
      z-index: 0;
    }

    /* =============================================
       EXPERIÊNCIAS / CTA BANNER
    ============================================= */
    .cta-banner {
      position: relative;
      padding: 120px 0;
      overflow: hidden;
    }

    .cta-banner-bg {
      position: absolute;
      inset: 0;
      background:
        linear-gradient(to right, rgba(88, 71, 56,0.92) 0%, rgba(88, 71, 56,0.5) 60%, rgba(88, 71, 56,0.1) 100%),
        url('../img/travel-with-pipa-explore-destinations.webp') center/cover no-repeat;
    }

    .cta-content {
      position: relative;
      z-index: 1;
      max-width: 580px;
    }
	
	.cta-banner a {
		 background: #f1eada;
		 color: #584738;
	}
	
	
	.cta-banner a:hover {
		 background: #cec1a8;
	}

    .cta-content .section-body { color: rgba(255,255,255,0.65); margin-bottom: 36px; }

    /* =============================================
       NEWSLETTER
    ============================================= */
    .newsletter {
      padding: 80px 0;
      background: #aaa396;
      border-top: 1px solid var(--border);
    }

    .newsletter-inner {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 40px;
      flex-wrap: wrap;
    }

    .newsletter-text h3 {
      font-family: var(--ff-display);
      font-size: 32px;
      font-weight: 300;
      color: #f1eada;
      margin-bottom: 6px;
	  text-transform: uppercase;
    }

    .newsletter-text p {
      font-size: 13px;
      font-weight: 300;
      color: #f1eada;
    }

    .newsletter-form {
      display: flex;
      gap: 0;
      flex-wrap: wrap;
    }

    .newsletter-form input {
      font-family: var(--ff-body);
      font-size: 13px;
      padding: 13px 20px;
      border: none;
      border-right: none;
      background: var(--white);
      color: #aaa396;
      width: 280px;
      outline: none;
      transition: border-color 0.2s;
    }
	
	.newsletter-form input::placeholder {  color: #aaa396; }

    .newsletter-form input:focus { border-color: none; }

    .newsletter-form button {
      font-family: var(--ff-body);
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      background: #f1eada;
      color: #584738;
      border: none;
      padding: 13px 24px;
      cursor: pointer;
      transition: background 0.2s;
      white-space: nowrap;
    }

    .newsletter-form button:hover { background: var(--adriatic); border-color: var(--adriatic); color: #f1eada;}

    /* =============================================
       FOOTER
    ============================================= */
    .footer {
      background: #f1eada;
      padding: 72px 0 32px;
    }

    .footer-top {
      display: grid;
      grid-template-columns: 2fr 1fr 1fr 1fr;
      gap: 48px;
      margin-bottom: 56px;
    }

    .footer-brand-name {
      font-family: var(--ff-display);
      font-size: 24px;
      font-weight: 400;
      color: #584738;
	  width: 280px;
      margin-bottom: 4px;
	  margin-top: -40px;
    }

    .footer-brand-tag {
      font-size: 8px;
      letter-spacing: 0.3em;
      text-transform: uppercase;
      color: #584738;
      margin-bottom: 18px;
    }

    .footer-about {
      font-size: 13px;
      font-weight: 300;
      color: #584738;
      line-height: 1.7;
      margin-bottom: 24px;
	  margin-top: 24px;
	  width: 280px;
	  
    }

    .footer-social {
      display: flex;
      gap: 14px;
    }

    .footer-social a {
      width: auto;
	  
      border: none;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      color: #584738;
      transition: border-color 0.2s, color 0.2s;
    }

    .footer-social a:hover { border-color: var(--gold); color: var(--gold); }

    .footer-col h5 {
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.28em;
      text-transform: uppercase;
      color: #584738;
      margin-bottom: 20px;
    }

    .footer-col ul li {
      margin-bottom: 10px;
    }

    .footer-col ul li a {
      font-size: 13px;
      font-weight: 300;
      color: #584738;
      transition: color 0.2s;
    }

    .footer-col ul li a:hover { color: var(--gold); }

    .footer-bottom {
      border-top: 1px solid #584738;
      padding-top: 28px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      gap: 12px;
    }

    .footer-copy {
      font-size: 11px;
      color: #584738;
      font-weight: 300;
    }

    .footer-legal {
      display: flex;
      gap: 24px;
    }

    .footer-legal a {
      font-size: 11px;
      color: #584738;
      transition: color 0.2s;
    }

    .footer-legal a:hover { color: #584738; }

    /* =============================================
       RESPONSIVE
    ============================================= */
    @media (max-width: 1024px) {
      .cards-grid { grid-template-columns: repeat(2, 1fr); }
      .card:first-child { grid-row: span 1; }
      .posts-grid { grid-template-columns: repeat(2, 1fr); }
      .footer-top { grid-template-columns: 1fr 1fr; }
      .ebooks-inner { gap: 48px; }
    }

    @media (max-width: 768px) {
      :root { --section-gap: 72px; }

      .navbar { padding: 0 20px; }
      .nav-links { display: none; }
      .hamburger { display: flex; }

      .hero-headline { font-size: clamp(40px, 12vw, 72px); }

      .cards-grid { grid-template-columns: 1fr; gap: 2px; }
      .card { aspect-ratio: 4/3; }
      .card:first-child { aspect-ratio: 4/3; grid-row: span 1; }

      .destinos-header { flex-direction: column; align-items: flex-start; }

      .posts-grid { grid-template-columns: 1fr; gap: 48px; }

      .ebooks-inner { grid-template-columns: 1fr; gap: 48px; }
      .ebooks-visual { order: -1; }
      .ebooks-accent { display: none; }

      .footer-top { grid-template-columns: 1fr; gap: 36px; }
      .footer-bottom { flex-direction: column; align-items: flex-start; }

      .newsletter-inner { flex-direction: column; align-items: flex-start; }
      .newsletter-form input { width: 100%; }
      .newsletter-form { width: 100%; flex-wrap: nowrap; }
    }

    @media (max-width: 480px) {
      .strip-inner { gap: 36px; }
      .hero-btns { flex-direction: column; align-items: center; }
    }

    @media (prefers-reduced-motion: reduce) {
      .hero-bg { animation: none; }
      .scroll-line { animation: none; }
    }

    /* =============================================
       PAGE HERO (inner pages — blog list, article, etc.)
    ============================================= */
    .page-hero {
      position: relative;
      padding: 180px 0 90px;
      background: var(--ocean);
      overflow: hidden;
    }

    .page-hero-bg {
      position: absolute;
      inset: 0;
      background:
        linear-gradient(to bottom, rgba(88, 71, 56,0.7) 0%, rgba(88, 71, 56,0.92) 100%),
        url('../img/travel-with-pipa-about-me.webp') center/cover no-repeat;
    }

    .page-hero-watermark {
      position: absolute;
      bottom: -10%;
      left: 50%;
      transform: translateX(-50%);
      font-family: var(--ff-display);
      font-size: clamp(120px, 20vw, 280px);
      font-weight: 600;
      color: transparent;
      -webkit-text-stroke: 1px rgba(255,255,255,0.06);
      white-space: nowrap;
      pointer-events: none;
      line-height: 0.85;
    }

    .page-hero-content {
      position: relative;
      z-index: 1;
      text-align: center;
      max-width: 720px;
      margin: 0 auto;
    }

    .breadcrumbs {
      display: flex;
      justify-content: center;
      gap: 8px;
      font-size: 10px;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: rgba(255,255,255,0.45);
      margin-bottom: 22px;
    }

    .breadcrumbs a { color: rgba(255,255,255,0.45); transition: color 0.2s; }
    .breadcrumbs a:hover { color: var(--gold); }
    .breadcrumbs span.sep { color: rgba(255,255,255,0.25); }
    .breadcrumbs span.current { color: var(--gold); }

    .page-hero-title {
      font-family: var(--ff-display);
      font-size: clamp(38px, 6vw, 54px);
      font-weight: 300;
      color: var(--white);
      line-height: 1.35;
      margin-bottom: 16px;
	  text-transform: uppercase;
    }

    .page-hero-title em { font-style: italic; color: var(--gold); }

    .page-hero-sub {
      font-size: 14px;
      font-weight: 300;
      color: rgba(255,255,255,0.6);
      max-width: 520px;
      margin: 0 auto;
      line-height: 1.7;
    }

    /* =============================================
       BLOG LISTING — Filters & Search
    ============================================= */
    .blog-toolbar {
      background: var(--sand);
      border-bottom: 1px solid var(--border);
      padding: 28px 0;
      position: sticky;
      top: 72px;
      z-index: 50;
    }

    .blog-toolbar-inner {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 24px;
      flex-wrap: wrap;
    }

    .blog-categories {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }

    .cat-pill {
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      padding: 9px 18px;
      border: 1px solid var(--border);
      background: var(--white);
      color: var(--mid);
      cursor: pointer;
      transition: all 0.2s;
      white-space: nowrap;
    }

    .cat-pill.active, .cat-pill:hover {
      background: var(--ocean);
      border-color: var(--ocean);
      color: var(--white);
    }

    .blog-search {
      position: relative;
      width: 260px;
      max-width: 100%;
    }

    .blog-search input {
      width: 100%;
      font-family: var(--ff-body);
      font-size: 13px;
      padding: 10px 16px;
      border: 1px solid var(--border);
      background: var(--white);
      color: var(--charcoal);
      outline: none;
      transition: border-color 0.2s;
    }

    .blog-search input:focus { border-color: var(--adriatic); }

    .blog-search svg {
      position: absolute;
      right: 14px;
      top: 50%;
      transform: translateY(-50%);
      width: 14px; height: 14px;
      stroke: var(--mid);
      pointer-events: none;
    }

    /* =============================================
       BLOG LISTING — Layout (main + sidebar)
    ============================================= */
    .blog-section {
      padding: 64px 0 var(--section-gap);
      background: var(--white);
    }

    .blog-layout {
      display: grid;
      grid-template-columns: 1fr 320px;
      gap: 64px;
      align-items: start;
    }

    /* Featured post (first item, large) */
    .featured-post {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 0;
      margin-bottom: 56px;
      border: 1px solid var(--border);
      overflow: hidden;
    }

    .featured-post-img-wrap {
      position: relative;
      overflow: hidden;
      min-height: 320px;
    }

    .featured-post-img {
      width: 100%; height: 100%;
      object-fit: cover;
      position: absolute;
      inset: 0;
      transition: transform 0.5s;
    }

    .featured-post:hover .featured-post-img { transform: scale(1.04); }

    .featured-post-tag {
      position: absolute;
      top: 18px; left: 18px;
      font-size: 8px;
      font-weight: 600;
      letter-spacing: 0.25em;
      text-transform: uppercase;
      background: var(--gold);
      color: var(--ocean);
      padding: 6px 14px;
      z-index: 1;
    }

    .featured-post-body {
      padding: 44px 40px;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .featured-post-meta {
      display: flex;
      gap: 14px;
      align-items: center;
      font-size: 10px;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--mid);
      margin-bottom: 16px;
    }

    .featured-post-meta .dot { width: 3px; height: 3px; border-radius: 50%; background: var(--mid); }

    .featured-post-title {
      font-family: var(--ff-display);
      font-size: 32px;
      font-weight: 400;
      color: #584738;
      line-height: 1.15;
      margin-bottom: 14px;
	  text-transform: uppercase;
    }

    .featured-post-excerpt {
      font-size: 14px;
      font-weight: 300;
      color: var(--mid);
      line-height: 1.75;
      margin-bottom: 22px;
    }

    /* Grid of regular posts (reuses .post-card from homepage) */
    .blog-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 48px 40px;
      margin-bottom: 56px;
    }

    /* Pagination */
    .pagination {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 8px;
    }

    .page-btn {
      width: 38px; height: 38px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      font-weight: 500;
      border: 1px solid var(--border);
      color: var(--mid);
      background: var(--white);
      transition: all 0.2s;
    }

    .page-btn.active, .page-btn:hover {
      background: var(--ocean);
      border-color: var(--ocean);
      color: var(--white);
    }

    .page-btn.arrow { font-size: 14px; }

    /* =============================================
       BLOG SIDEBAR
    ============================================= */
    .sidebar { display: flex; flex-direction: column; gap: 44px; }

    .widget-title {
      font-family: var(--ff-display);
      font-size: 19px;
      font-weight: 500;
      color: #b59e7d;
      margin-bottom: 20px;
      padding-bottom: 14px;
      border-bottom: 1px solid var(--border);
	  text-transform: uppercase;
    }

    /* About widget */
    .widget-about-img {
      width: 84px; height: 84px;
      border-radius: 50%;
      object-fit: cover;
      margin-bottom: 16px;
    }

    .widget-about p {
      font-size: 13px;
      font-weight: 300;
      color: var(--mid);
      line-height: 1.7;
      margin-bottom: 16px;
    }

    /* Popular posts widget */
    .widget-popular-item {
      display: flex;
      gap: 14px;
      margin-bottom: 18px;
      cursor: pointer;
    }

    .widget-popular-item:last-child { margin-bottom: 0; }

    .widget-popular-img {
      width: 64px; height: 64px;
      object-fit: cover;
      flex-shrink: 0;
    }

    .widget-popular-num {
      font-family: var(--ff-display);
      font-size: 22px;
      color: var(--gold);
      width: 64px;
      height: 64px;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      border: 1px solid var(--border);
    }

    .widget-popular-text h6 {
      font-family: var(--ff-display);
      font-size: 14px;
      font-weight: 500;
      color: #aaa396;
      line-height: 1.35;
      margin-bottom: 4px;
      transition: color 0.2s;
	  text-transform: uppercase;
    }

    .widget-popular-item:hover h6 { color: var(--adriatic); }

    .widget-popular-text span {
      font-size: 10px;
      color: var(--mid);
      letter-spacing: 0.05em;
    }

    /* Categories widget */
    .widget-cats li {
      display: flex;
      justify-content: space-between;
      padding: 10px 0;
      border-bottom: 1px solid var(--border);
      font-size: 13px;
    }

    .widget-cats li:last-child { border-bottom: none; }

    .widget-cats a {
      color: #aaa396;
      transition: color 0.2s;
    }

    .widget-cats li:hover a { color: var(--adriatic); }

    .widget-cats .count {
      color: var(--mid);
      font-size: 11px;
    }

    /* Tags widget */
    .widget-tags { display: flex; flex-wrap: wrap; gap: 8px; }

    .tag-pill {
      font-size: 10px;
      letter-spacing: 0.05em;
      color: var(--mid);
      border: 1px solid var(--border);
      padding: 7px 14px;
      transition: all 0.2s;
    }

    .tag-pill:hover { background: var(--ocean); border-color: var(--ocean); color: var(--white); }

    /* Ebook promo widget (sidebar) */
    .widget-ebook {
      background: var(--ocean);
      padding: 32px 24px;
      text-align: center;
    }

    .widget-ebook img {
      width: 96px;
      margin: 0 auto 18px;
      box-shadow: 0 12px 30px rgba(0,0,0,0.35);
    }

    .widget-ebook h6 {
      font-family: var(--ff-display);
      font-size: 18px;
      color: #584738;
      margin-bottom: 8px;
    }

    .widget-ebook p {
      font-size: 12px;
      font-weight: 300;
      color: #aaa396;
      margin-bottom: 18px;
      line-height: 1.6;
    }
	
	.widget-ebook .btn-primary {
		
		background: #b59e7d;
	}

    /* Sidebar newsletter widget */
    .widget-newsletter {
      background: var(--sand);
      border: 1px solid var(--border);
      padding: 28px 24px;
      text-align: center;
    }

    .widget-newsletter p {
      font-size: 12px;
      font-weight: 300;
      color: var(--mid);
      margin-bottom: 16px;
      line-height: 1.6;
    }

    .widget-newsletter input {
      width: 100%;
      font-family: var(--ff-body);
      font-size: 12px;
      padding: 11px 14px;
      border: 1px solid var(--border);
      background: var(--white);
      margin-bottom: 10px;
      outline: none;
    }

    .widget-newsletter input:focus { border-color: var(--adriatic); }

    .widget-newsletter button {
      width: 100%;
      font-family: var(--ff-body);
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      background: var(--ocean);
      color: var(--white);
      border: 1px solid var(--ocean);
      padding: 12px;
      cursor: pointer;
      transition: background 0.2s;
    }

    .widget-newsletter button:hover { background: var(--adriatic); }

    /* =============================================
       SINGLE ARTICLE PAGE
    ============================================= */
    .article-section {
      padding: 64px 0 var(--section-gap);
      background: var(--white);
    }

    .article-layout {
      display: grid;
      grid-template-columns: 1fr 320px;
      gap: 64px;
      align-items: start;
    }

    .article-main { max-width: 720px; }

    .article-meta-row {
      display: flex;
      align-items: center;
      gap: 16px;
      flex-wrap: wrap;
      margin-bottom: 18px;
    }

    .article-author {
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .article-author img {
      width: 36px; height: 36px;
      border-radius: 50%;
      object-fit: cover;
    }

    .article-author-name {
      font-size: 12px;
      font-weight: 500;
      color: var(--ocean);
    }

    .article-meta-row .meta-divider {
      width: 1px; height: 14px;
      background: var(--border);
    }

    .article-meta-item {
      font-size: 11px;
      letter-spacing: 0.05em;
      color: var(--mid);
    }

    .article-title {
      font-family: var(--ff-display);
      font-size: clamp(30px, 4.5vw, 46px);
      font-weight: 400;
      color: #584738;
      line-height: 1.15;
      margin-bottom: 18px;
    }

    .article-lede {
      font-size: 16px;
      font-weight: 300;
      color: var(--mid);
      line-height: 1.75;
      margin-bottom: 32px;
    }

    .article-hero-img {
      width: 100%;
      aspect-ratio: 16/9;
      object-fit: cover;
      margin-bottom: 12px;
    }

    .article-hero-caption {
      font-size: 11px;
      color: var(--mid);
      font-style: italic;
      margin-bottom: 44px;
    }

    /* Article body typography */
    .article-body h2 {
      font-family: var(--ff-display);
      font-size: 30px;
      font-weight: 500;
      color: #584738;
      margin: 48px 0 18px;
      line-height: 1.25;
    }

    .article-body h3 {
      font-family: var(--ff-display);
      font-size: 22px;
      font-weight: 500;
      color: #584738;
      margin: 36px 0 14px;
    }

    .article-body p {
      font-size: 15.5px;
      font-weight: 300;
      color: var(--charcoal);
      line-height: 1.85;
      margin-bottom: 22px;
    }

    .article-body a {
      color: var(--adriatic);
      text-decoration: underline;
      text-underline-offset: 3px;
      transition: color 0.2s;
    }

    .article-body a:hover { color: var(--gold); }

    .article-body ul, .article-body ol {
      margin: 0 0 22px 20px;
    }

    .article-body li {
      font-size: 15.5px;
      font-weight: 300;
      color: var(--charcoal);
      line-height: 1.85;
      margin-bottom: 8px;
    }

    .article-body img.inline-img {
      width: 100%;
      margin: 12px 0 8px;
    }

    .article-body .img-caption {
      font-size: 11px;
      color: var(--mid);
      font-style: italic;
      margin-bottom: 28px;
    }

    .article-pullquote {
      font-family: var(--ff-display);
      font-size: 26px;
      font-weight: 400;
      font-style: italic;
      color: #aaa396;
      line-height: 1.4;
      border-left: 2px solid var(--gold);
      padding: 6px 0 6px 28px;
      margin: 40px 0;
    }

    .article-pullquote cite {
      display: block;
      font-family: var(--ff-body);
      font-style: normal;
      font-size: 11px;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--mid);
      margin-top: 12px;
    }

    /* Info box (tip / practical info inside article) */
    .article-infobox {
      background: var(--sand);
      border: 1px solid var(--border);
      padding: 28px 32px;
      margin: 36px 0;
    }

    .article-infobox h4 {
      font-family: var(--ff-display);
      font-size: 18px;
      color: var(--ocean);
      margin-bottom: 12px;
    }

    .article-infobox ul { margin: 0; list-style: none; }

    .article-infobox li {
      display: flex;
      justify-content: space-between;
      padding: 9px 0;
      border-bottom: 1px solid var(--border);
      font-size: 13px;
      font-weight: 300;
	  color: var(--ocean);
    }

    .article-infobox li:last-child { border-bottom: none; }
    .article-infobox li strong { font-weight: 500; color: var(--ocean); }

    /* Tags + share row */
    .article-footer-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      gap: 20px;
      margin-top: 48px;
      padding-top: 28px;
      border-top: 1px solid var(--border);
    }

    .article-tags { display: flex; gap: 8px; flex-wrap: wrap; }

    .share-row { display: flex; align-items: center; gap: 10px; }

    .share-label {
      font-size: 10px;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: var(--mid);
    }

    .share-btn {
      width: 34px; height: 34px;
      border: 1px solid var(--border);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      color: var(--mid);
      transition: all 0.2s;
    }

    .share-btn:hover { background: var(--ocean); border-color: var(--ocean); color: var(--white); }

    /* Author box */
    .author-box {
      display: flex;
      gap: 22px;
      align-items: center;
      background: var(--sand);
      border: 1px solid var(--border);
      padding: 32px;
      margin-top: 40px;
    }

    .author-box img {
      width: 76px; height: 76px;
      border-radius: 50%;
      object-fit: cover;
      flex-shrink: 0;
    }

    .author-box-name {
      font-family: var(--ff-display);
      font-size: 19px;
      color: var(--ocean);
      margin-bottom: 6px;
    }

    .author-box p {
      font-size: 13px;
      font-weight: 300;
      color: var(--mid);
      line-height: 1.65;
    }

    /* Comments (placeholder structure) */
    .comments-section { margin-top: 56px; }

    .comments-count {
      font-family: var(--ff-display);
      font-size: 22px;
      color: var(--ocean);
      margin-bottom: 28px;
    }

    .comment-form textarea, .comment-form input {
      width: 100%;
      font-family: var(--ff-body);
      font-size: 13px;
      padding: 13px 16px;
      border: 1px solid var(--border);
      outline: none;
      margin-bottom: 14px;
      transition: border-color 0.2s;
    }

    .comment-form textarea:focus, .comment-form input:focus { border-color: var(--adriatic); }
    .comment-form textarea { min-height: 110px; resize: vertical; }

    .comment-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

    /* Related posts */
    .related-posts {
      margin-top: var(--section-gap);
      padding-top: var(--section-gap);
      border-top: 1px solid var(--border);
    }

    /* =============================================
       BLOG / ARTICLE — RESPONSIVE
    ============================================= */
    @media (max-width: 1024px) {
      .blog-layout, .article-layout { grid-template-columns: 1fr; }
      .sidebar { order: 2; }
      .featured-post { grid-template-columns: 1fr; }
      .featured-post-img-wrap { min-height: 240px; }
      .blog-grid { grid-template-columns: repeat(2, 1fr); }
    }

    @media (max-width: 768px) {
      .blog-toolbar { position: static; }
      .blog-toolbar-inner { flex-direction: column; align-items: stretch; }
      .blog-search { width: 100%; }
      .blog-grid { grid-template-columns: 1fr; }
      .featured-post-body { padding: 32px 24px; }
      .comment-form-row { grid-template-columns: 1fr; }
      .page-hero { padding: 150px 0 64px; }
      .article-pullquote { font-size: 21px; padding-left: 20px; }
      .author-box { flex-direction: column; text-align: center; }
    }

 ============================================= */
    @media (max-width: 1024px) {
      .blog-layout, .article-layout { grid-template-columns: 1fr; }
      .sidebar { order: 2; }
      .featured-post { grid-template-columns: 1fr; }
      .featured-post-img-wrap { min-height: 240px; }
      .blog-grid { grid-template-columns: repeat(2, 1fr); }
    }

    @media (max-width: 768px) {
      .blog-toolbar { position: static; }
      .blog-toolbar-inner { flex-direction: column; align-items: stretch; }
      .blog-search { width: 100%; }
      .blog-grid { grid-template-columns: 1fr; }
      .featured-post-body { padding: 32px 24px; }
      .comment-form-row { grid-template-columns: 1fr; }
      .page-hero { padding: 150px 0 64px; }
      .article-pullquote { font-size: 21px; padding-left: 20px; }
      .author-box { flex-direction: column; text-align: center; }
    }
/* =============================================
   SOCIAL SIDEBAR (fixed, with hover tooltip)
============================================= */
.social-sidebar {
  position: fixed;
  left: 28px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 900;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.social-sidebar-line {
  width: 1px;
  height: 64px;
  background: linear-gradient(to bottom, transparent, rgba(88, 71, 56,0.25));
}

.social-sidebar-line.bottom {
  background: linear-gradient(to top, transparent, rgba(88, 71, 56,0.25));
}

.social-sidebar-icons {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.social-icon {
  position: relative;
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #584738;
  border: 1px solid #584738;
  color: var(--white);
  transition: background 0.25s, border-color 0.25s, transform 0.25s;
}

.social-icon svg {
  width: 16px;
  height: 16px;
  stroke: var(--white);
  fill: none;
  stroke-width: 1.6;
  transition: stroke 0.25s;
}

.social-icon:hover {
  background: var(--ocean);
  border-color: var(--ocean);
  transform: translateX(4px);
}

.social-icon:hover svg { stroke: var(--gold); }

/* Tooltip */
.social-icon .tooltip {
  position: absolute;
  left: calc(100% + 12px);
  top: 50%;
  transform: translateY(-50%) translateX(-6px);
  background: var(--ocean);
  color: #584738;
  font-family: var(--ff-body);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  white-space: nowrap;
  padding: 7px 14px;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s, transform 0.2s;
}

.social-icon .tooltip::before {
  content: '';
  position: absolute;
  right: 100%;
  top: 50%;
  transform: translateY(-50%);
  border: 5px solid transparent;
  border-right-color: var(--ocean);
}

.social-icon:hover .tooltip {
  opacity: 1;
  transform: translateY(-50%) translateX(0);
}

/* Versão para fundos escuros */
.social-sidebar.on-dark .social-icon {
  background: #584738;
  border-color: rgba(255,255,255,0.18);
  backdrop-filter: blur(6px);
}

.social-sidebar.on-dark .social-icon svg { stroke: var(--white); }
.social-sidebar.on-dark .social-icon:hover { background: var(--gold); border-color: var(--gold); }
.social-sidebar.on-dark .social-icon:hover svg { stroke: var(--ocean); }

/* Ocultar em ecrãs pequenos */
@media (max-width: 1100px) {
  .social-sidebar { display: none; }
}


/* =============================================
   LANGUAGE SWITCHER (navbar)
============================================= */
.lang-switcher {
  display: flex;
  align-items: center;
  gap: 0;
  border: 1px solid #584738;
  overflow: hidden;
  flex-shrink: 0;
}

.lang-switcher a,
.lang-switcher span {
  font-family: var(--ff-body);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 7px 11px;
  line-height: 1;
  transition: background 0.2s, color 0.2s;
  display: flex;
  align-items: center;
  cursor: pointer;
}



/* Divider between PT and EN */
.lang-switcher .lang-sep {
  width: 1px;
  height: 14px;
  background: #f1eada;
  padding: 0;
  flex-shrink: 0;
  color: #584738;
}



/* Active language */
.lang-switcher .lang-active {
  background: #584738;
  color: var(--ocean);
  cursor: default;
  pointer-events: none;
}

.lang-sep {
  width: 1px;
  height: 14px;
  background: #584738;
}

/* Inactive language */
.lang-switcher a {
  color: #584738;
  text-decoration: none;
}

.lang-switcher a:hover {
  background: rgba(255,255,255,0.1);
  color: #aaa396;
}

/* When navbar is on a light bg (scrolled on inner pages that have light hero)
   — the switcher adapts via the .scrolled class colours already set */
.navbar.scrolled .lang-switcher {
  border-color: #584738;
}

/* Hide on mobile (already has language option in mobile menu) */
@media (max-width: 768px) {
  .lang-switcher { display: none; }
}

/* Mobile menu language row */
.mobile-menu .lang-row {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 8px;
}

.mobile-menu .lang-row a,
.mobile-menu .lang-row span {
  font-family: var(--ff-body);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
  cursor: pointer;
  transition: color 0.2s;
}

.mobile-menu .lang-row .lang-active {
  color: var(--gold);
  cursor: default;
  pointer-events: none;
}

.mobile-menu .lang-row a:hover { color: var(--white); }

.mobile-menu .lang-row .lang-sep {
  width: 1px;
  height: 14px;
  background: #584738;
}


/* =============================================
       ABOUT PAGE — page-specific styles
    ============================================= */
    .about-intro {
      padding: var(--section-gap) 0;
      background: var(--white);
    }

    .about-intro-grid {
      display: grid;
      grid-template-columns: 0.85fr 1.15fr;
      gap: 72px;
      align-items: center;
    }

    .about-portrait-wrap {
      position: relative;
    }
	
	.about-intro .section-title {
		
		color: #584738;
		
	}

    .about-portrait {
      width: 100%;
      aspect-ratio: 4/5;
      object-fit: cover;
      position: relative;
      z-index: 1;
    }

    .about-portrait-accent {
      position: absolute;
      top: -22px; left: -22px;
      width: 70%; height: 70%;
      border: 1px solid #584738;
      z-index: 0;
    }

    .about-portrait-badge {
      position: absolute;
      bottom: -24px; right: -24px;
      background: var(--ocean);
      color: var(--white);
      padding: 20px 26px;
      text-align: center;
      z-index: 2;
    }

    .about-portrait-badge .num {
      font-family: var(--ff-display);
      font-size: 30px;
      color: var(--gold);
      line-height: 1;
    }

    .about-portrait-badge .lbl {
      font-size: 8px;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      color: #aaa396;
      margin-top: 4px;
    }

    .about-text .section-body { max-width: none; margin-bottom: 18px; }

    .about-signature {
      font-family: var(--ff-display);
      font-style: italic;
      font-size: 30px;
      color: var(--gold);
      margin-top: 28px;
    }

    /* Timeline / journey */
    .journey {
      padding: var(--section-gap) 0;
      background: #f1eada;
    }
	
	.journey .section-title {
		
		color: #584738;
		
	}

    .journey-header { text-align: center; margin-bottom: 64px; }
    .journey-header .section-body { margin: 0 auto; text-align: center; }

    .timeline {
      max-width: 720px;
      margin: 0 auto;
      position: relative;
    }

    .timeline::before {
      content: '';
      position: absolute;
      left: 11px; top: 6px; bottom: 6px;
      width: 1px;
      background: #584738;
    }

    .timeline-item {
      position: relative;
      padding-left: 48px;
      margin-bottom: 44px;
    }

    .timeline-item:last-child { margin-bottom: 0; }

    .timeline-dot {
      position: absolute;
      left: 0; top: 4px;
      width: 23px; height: 23px;
      border: 1px solid var(--gold);
      background: var(--sand);
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .timeline-dot::after {
      content: '';
      width: 7px; height: 7px;
      background: var(--gold);
      border-radius: 50%;
    }

    .timeline-year {
      font-family: var(--ff-display);
      font-size: 14px;
      letter-spacing: 0.1em;
      color: #b59e7d;
      font-weight: 500;
      margin-bottom: 6px;
      display: block;
    }

    .timeline-title {
      font-family: var(--ff-display);
      font-size: 18px;
      font-weight: 500;
      color: #584738;
      margin-bottom: 8px;
	  text-transform: uppercase;
    }

    .timeline-text {
      font-size: 13.5px;
      font-weight: 300;
      color: var(--mid);
      line-height: 1.75;
    }

    /* Values grid */
    .values {
      padding: var(--section-gap) 0;
      background: var(--white);
    }
	
	.values .section-title {
		color: #584738;
	}

    .values-header { text-align: center; margin-bottom: 56px; }
    .values-header .section-body { margin: 0 auto; text-align: center; }

    .values-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1px;
      background: var(--border);
      border: 1px solid var(--border);
    }

    .value-card {
      background: var(--white);
      padding: 44px 36px;
      text-align: center;
    }

    .value-icon {
      width: 44px; height: 44px;
      margin: 0 auto 22px;
      border: 1px solid #b59e7d;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .value-icon svg { width: 18px; height: 18px; stroke: #b59e7d; }

    .value-title {
      font-family: var(--ff-display);
      font-size: 16px;
      font-weight: 500;
      color: #584738;
      margin-bottom: 12px;
	  text-transform: uppercase;
    }

    .value-text {
      font-size: 13px;
      font-weight: 300;
      color: var(--mid);
      line-height: 1.7;
    }

    /* Stats band (reuse .strip from main stylesheet) */

    /* Press / featured-in */
    .press {
      padding: 64px 0;
      background: var(--ocean);
    }

    .press-label {
      text-align: center;
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.3em;
      text-transform: uppercase;
      color: #b59e7d;
      margin-bottom: 32px;
    }

    .press-logos {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 64px;
      flex-wrap: wrap;
    }

    .press-logo {
      font-family: var(--ff-display);
      font-size: 22px;
      font-weight: 500;
      letter-spacing: 0.04em;
      color: #584738;
    }

    @media (max-width: 1024px) {
      .about-intro-grid { grid-template-columns: 1fr; gap: 48px; }
      .about-portrait-wrap { max-width: 380px; margin: 0 auto; }
      .values-grid { grid-template-columns: 1fr; }
    }

    @media (max-width: 768px) {
      .about-portrait-badge { right: 8px; bottom: -18px; padding: 14px 18px; }
      .press-logos { gap: 32px; }
    }
	
	
	/* =============================================
       DESTINOS PAGE — page-specific styles
    ============================================= */

    /* Region quick-nav (anchors) */
    .region-nav {
      background: var(--sand);
      border-bottom: 1px solid var(--border);
      padding: 22px 0;
      position: sticky;
      top: 72px;
      z-index: 50;
    }

    .region-nav-inner {
      display: flex;
      justify-content: center;
      gap: 8px;
      flex-wrap: wrap;
    }

    .region-link {
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      padding: 9px 20px;
      border: 1px solid var(--border);
      background: var(--white);
      color: #584738;
      transition: all 0.2s;
    }

    .region-link:hover, .region-link.active {
      background: var(--ocean);
      border-color: var(--ocean);
      color: #584738;
    }

    /* World map intro stat strip already reuses .strip */

    /* Region section */
    .region-block {
      padding: var(--section-gap) 0;
      scroll-margin-top: 150px;
    }

    .region-block:nth-child(even) { background: #f1eada; }

    .region-block-header {
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
      margin-bottom: 48px;
      gap: 24px;
      flex-wrap: wrap;
    }

    .region-block-eyebrow {
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.3em;
      text-transform: uppercase;
      color: #b59e7d;
      margin-bottom: 10px;
    }

    .region-block-title {
      font-family: var(--ff-display);
      font-size: clamp(30px, 4vw, 44px);
      font-weight: 300;
      color: #584738;
	  text-transform: uppercase;
    }

    .region-block-title em { font-style: italic; }

    .region-block-count {
      font-size: 11px;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: #aaa396;
      border: 1px solid #aaa396;
      padding: 8px 16px;
    }

    /* Destination cards grid (region pages) */
    .dest-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 28px;
    }

    .dest-card {
      position: relative;
      overflow: hidden;
      aspect-ratio: 3/4;
      cursor: pointer;
    }

    .dest-card-img {
      width: 100%; height: 100%;
      object-fit: cover;
      transition: transform 0.6s ease;
    }

    .dest-card:hover .dest-card-img { transform: scale(1.06); }

    .dest-card-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(88, 71, 56,0.9) 0%, rgba(88, 71, 56,0.1) 50%, transparent 75%);
    }

    .dest-card-top {
      position: absolute;
      top: 16px; left: 16px; right: 16px;
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
    }

    .dest-card-country {
      font-size: 8px;
      font-weight: 600;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--white);
      background: rgba(255,255,255,0.15);
      backdrop-filter: blur(4px);
      padding: 6px 12px;
    }

    .dest-card-best {
      font-size: 8px;
      font-weight: 600;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: var(--ocean);
      background: var(--gold);
      padding: 6px 12px;
    }

    .dest-card-body {
      position: absolute;
      bottom: 0; left: 0; right: 0;
      padding: 22px 22px 24px;
    }

    .dest-card-name {
      font-family: var(--ff-display);
      font-size: 25px;
      font-weight: 400;
      color: var(--white);
      line-height: 1.1;
      margin-bottom: 8px;
	  text-transform: uppercase;
    }

    .dest-card-meta {
      display: flex;
      gap: 12px;
      font-size: 10px;
      letter-spacing: 0.05em;
      color: rgba(255,255,255,0.6);
    }

    .dest-card-meta span { display: flex; align-items: center; gap: 4px; }

    /* Destination compact list row (used for "ver tudo" pattern in smaller regions) */
    .dest-row {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 20px;
    }

    @media (max-width: 1024px) {
      .dest-grid { grid-template-columns: repeat(2, 1fr); }
      .dest-row { grid-template-columns: repeat(2, 1fr); }
    }

    @media (max-width: 768px) {
      .region-nav { position: static; }
      .region-nav-inner { justify-content: flex-start; overflow-x: auto; padding-bottom: 4px; }
      .dest-grid, .dest-row { grid-template-columns: 1fr; }
      .region-block-header { flex-direction: column; align-items: flex-start; }
    }
	
	
	/* =============================================
       CONTACTOS PAGE — page-specific styles
    ============================================= */

    /* Contact cards (quick reasons to reach out) */
    .contact-reasons {
      padding: 80px 0 0;
      background: var(--white);
    }

    .reasons-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
    }

    .reason-card {
      padding: 36px 30px;
      border: 1px solid var(--border);
      text-align: center;
      transition: border-color 0.2s, transform 0.2s;
    }

    .reason-card:hover { border-color: var(--gold); transform: translateY(-3px); }

    .reason-icon {
      width: 46px; height: 46px;
      margin: 0 auto 18px;
      border: 1px solid var(--gold);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .reason-icon svg { width: 19px; height: 19px; stroke: var(--gold); }

    .reason-title {
      font-family: var(--ff-display);
      font-size: 19px;
      font-weight: 500;
      color: #584738;
      margin-bottom: 8px;
    }

    .reason-text {
      font-size: 12.5px;
      font-weight: 300;
      color: var(--mid);
      line-height: 1.65;
    }

    /* Tabs: Geral / Parcerias */
    .contact-forms {
      padding: 72px 0 var(--section-gap);
      background: var(--white);
    }

    .form-tabs {
      display: flex;
      justify-content: center;
      gap: 0;
      margin-bottom: 56px;
      border-bottom: 1px solid var(--border);
    }

    .form-tab {
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--mid);
      background: none;
      border: none;
      padding: 16px 32px;
      cursor: pointer;
      position: relative;
      transition: color 0.2s;
    }

    .form-tab::after {
      content: '';
      position: absolute;
      bottom: -1px; left: 0; right: 0;
      height: 2px;
      background: #b59e7d;
      transform: scaleX(0);
      transition: transform 0.25s;
    }

    .form-tab.active { color: #584738; }
    .form-tab.active::after { transform: scaleX(1); }

    .form-panel { display: none; }
    .form-panel.active { display: block; }

    .contact-layout {
      display: grid;
      grid-template-columns: 1fr 1.3fr;
      gap: 72px;
      align-items: start;
      max-width: 1000px;
      margin: 0 auto;
    }

    .contact-side .section-body { max-width: none; margin-bottom: 28px; }

    .contact-detail {
      display: flex;
      gap: 14px;
      margin-bottom: 24px;
      align-items: flex-start;
    }
	
	.contact-forms .section-title {
		
		color: #584738;
	}

    .contact-detail-icon {
      width: 38px; height: 38px;
      flex-shrink: 0;
      border: 1px solid #b59e7d;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .contact-detail-icon svg { width: 16px; height: 16px; stroke: #b59e7d; }

    .contact-detail-label {
      font-size: 10px;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: #aaa396;
      margin-bottom: 3px;
    }

    .contact-detail-value {
      font-size: 14px;
      color: #aaa396;
      font-weight: 500;
    }

    .contact-detail-value a { transition: color 0.2s; }
    .contact-detail-value a:hover { color: var(--adriatic); }

    /* Forms */
    .form-group {
      margin-bottom: 22px;
    }

    .form-row-2 {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 20px;
    }

    .form-label {
      display: block;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: #b59e7d;
      margin-bottom: 9px;
    }

    .form-label .optional {
      font-weight: 300;
      text-transform: none;
      letter-spacing: 0;
      color: #aaa396;
      font-size: 11px;
    }

    .form-input, .form-select, .form-textarea {
      width: 100%;
      font-family: var(--ff-body);
      font-size: 14px;
      color: var(--charcoal);
      padding: 13px 16px;
      border: 1px solid var(--border);
      background: var(--white);
      outline: none;
      transition: border-color 0.2s;
    }

    .form-input:focus, .form-select:focus, .form-textarea:focus { border-color: var(--adriatic); }

    .form-textarea { min-height: 140px; resize: vertical; font-family: var(--ff-body); }

    .form-select {
      appearance: none;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 14px center;
      background-size: 16px;
      cursor: pointer;
    }

    .form-budget-options {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 10px;
    }

    .budget-option {
      position: relative;
    }

    .budget-option input { position: absolute; opacity: 0; }

    .budget-option label {
      display: block;
      text-align: center;
      font-size: 11px;
      font-weight: 500;
      color: var(--mid);
      border: 1px solid var(--border);
      padding: 12px 8px;
      cursor: pointer;
      transition: all 0.2s;
    }

    .budget-option input:checked + label {
      background: var(--ocean);
      border-color: var(--ocean);
      color: var(--white);
    }

    .form-submit-btn {
      font-family: var(--ff-body);
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      background: #b59e7d;
      color: var(--white);
      border: 1px solid #b59e7d;
      padding: 16px 40px;
      cursor: pointer;
      transition: background 0.2s;
    }

    .form-submit-btn:hover { background: #cec1a8; border-color: #cec1a8; }

    .form-note {
      font-size: 11px;
      font-weight: 300;
      color: var(--mid);
      margin-top: 16px;
      line-height: 1.6;
    }

    /* Confirmation message (hidden by default) */
    .form-success {
      display: none;
      padding: 32px;
      border: 1px solid var(--gold);
      background: var(--sand);
      text-align: center;
    }

    .form-success.show { display: block; }

    .form-success h4 {
      font-family: var(--ff-display);
      font-size: 22px;
      color: var(--ocean);
      margin-bottom: 8px;
    }

    .form-success p {
      font-size: 13px;
      font-weight: 300;
      color: var(--mid);
    }

    /* Map / location strip */
    .location-strip {
      padding: 56px 0;
      background: var(--sand);
      border-top: 1px solid var(--border);
    }

    .location-strip-inner {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 14px;
      text-align: center;
    }

    .location-strip-inner svg { width: 18px; height: 18px; stroke: var(--gold); }

    .location-strip-text {
      font-size: 13px;
      font-weight: 300;
      color: var(--mid);
    }

    .location-strip-text strong { color: var(--ocean); font-weight: 500; }

    @media (max-width: 1024px) {
      .reasons-grid { grid-template-columns: 1fr; }
      .contact-layout { grid-template-columns: 1fr; gap: 48px; }
    }

    @media (max-width: 768px) {
      .form-row-2 { grid-template-columns: 1fr; }
      .form-budget-options { grid-template-columns: 1fr 1fr; }
      .form-tabs { flex-direction: column; }
      .form-tab { padding: 14px 0; }
    }
	
	
	
	 /* TOC */
    .toc { background:var(--sand);border:1px solid var(--border);border-left:3px solid var(--gold);padding:28px 32px;margin:36px 0 48px; }
    .toc-title { font-family:var(--ff-display);font-size:16px;font-weight:600;color:var(--ocean);margin-bottom:14px; }
    .toc ol { margin:0 0 0 18px; }
    .toc li { font-size:13px;color:var(--mid);margin-bottom:7px;line-height:1.5; }
    .toc a { color:var(--adriatic);text-decoration:none;transition:color 0.2s; }
    .toc a:hover { color:var(--gold); }

    /* Tip / Warn */
    .tip-box { background:var(--sand);border:1px solid var(--border);border-left:3px solid var(--adriatic);padding:22px 28px;margin:32px 0; }
    .tip-box-label { font-size:9px;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;color:#f1eada;margin-bottom:8px; }
    .tip-box p { font-size:13.5px!important;font-weight:300!important;color:#f1eada!important;line-height:1.7!important;margin-bottom:0!important; }

    .warn-box { background:#fff8f0;border:1px solid #f0d8b8;border-left:3px solid var(--gold);padding:22px 28px;margin:32px 0; }
    .warn-box-label { font-size:9px;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold);margin-bottom:8px; }
    .warn-box p { font-size:13.5px!important;font-weight:300!important;color:var(--charcoal)!important;line-height:1.7!important;margin-bottom:0!important; }

    /* Image grid */
    .img-grid-2 { display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0 8px; }
    .img-grid-2 img { aspect-ratio:4/3;object-fit:cover; }
    .img-grid-3 { display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0 8px; }
    .img-grid-3 img { aspect-ratio:4/3;object-fit:cover; }

    /* Island card (profile-style) */
    .island-grid { display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin:32px 0; }
    .island-card {
      border: 1px solid var(--border);
      overflow: hidden;
    }
    .island-card-img { width:100%;aspect-ratio:16/9;object-fit:cover; }
    .island-card-body { padding:20px; }
    .island-grid .island-card-eyebrow {
      font-size:9px; font-weight:700;letter-spacing:0.22em;text-transform:uppercase;
      color:var(--gold);margin-bottom:0px;
    }
    .island-grid .island-card-name {
      font-family:var(--ff-display);font-size:22px;font-weight:500;
      color:#584738; margin-bottom:8px;
    }
	
	
    .island-card-p {
      font-size:13px;font-weight:300;color:var(--mid);line-height:1.65;margin-bottom:12px;
    }
    .island-card-tags { display:flex;flex-wrap:wrap;gap:6px; }
    .island-card-tag {
      font-size:9px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;
      padding:4px 10px;border:1px solid var(--border);color:var(--mid);
    }
    .island-card-tag.active { background:var(--ocean);border-color:var(--ocean);color:var(--white); }

    /* Comparison table */
    .compare-table { width:100%;border-collapse:collapse;margin:28px 0;font-size:13px; }
    .compare-table th { background:var(--ocean);color:#584738;font-weight:600;letter-spacing:0.08em;text-align:left;padding:12px 16px;font-size:11px;text-transform:uppercase; }
    .compare-table td { padding:12px 16px;border-bottom:1px solid var(--border);color:#aaa396;font-weight:300;vertical-align:top;line-height:1.5; }
    .compare-table tr:nth-child(even) td { background:var(--sand); }
    .compare-table .name { font-weight:600;color:#aaa396; }
    .tag-best { display:inline-block;font-size:9px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;background:var(--gold);color:var(--ocean);padding:2px 7px; }

    /* Gili selector */
    .gili-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:28px 0; }
    .gili-card {
      padding:28px 22px;
      border: 2px solid var(--border);
      text-align:center;
      position:relative;
      transition: border-color 0.2s;
    }
    .gili-card:hover { border-color:var(--gold); }
    .gili-card-emoji { font-size:28px;margin-bottom:12px; }
    .gili-card-name { font-family:var(--ff-display);font-size:22px;font-weight:500;color:var(--ocean);margin-bottom:6px; }
    .gili-card-vibe { font-size:9px;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);margin-bottom:12px; }
    .gili-card-text { font-size:12.5px;font-weight:300;color:var(--mid);line-height:1.65; }
    .gili-card-best { margin-top:12px;font-size:11px;font-weight:600;color:var(--ocean); }

    @media (max-width:900px) {
      .island-grid, .gili-grid { grid-template-columns:1fr; }
      .compare-table { display:block;overflow-x:auto; }
    }
    @media (max-width:600px) { .img-grid-2, .img-grid-3 { grid-template-columns:1fr; } }
	
	
	
	
	/* =============================================
   COOKIE CONSENT
============================================= */

.cookie-consent {
  position: fixed;
  left: 24px;
  right: 24px;
  bottom: 24px;
  z-index: 99999;

  background: #f1eada;
  border: 1px solid rgba(88, 71, 56, 0.18);

  box-shadow: 0 15px 50px rgba(17, 60, 95, 0.12);

  opacity: 0;
  visibility: hidden;
  transform: translateY(25px);

  transition:
    opacity 0.35s ease,
    visibility 0.35s ease,
    transform 0.35s ease;
}

.cookie-consent.visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.cookie-consent-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 28px 32px;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

.cookie-consent-content {
  max-width: 720px;
}

.cookie-consent h2 {
  font-family: var(--ff-display);
  font-size: 28px;
  font-weight: 400;
  color: #584738;
  margin-bottom: 8px;
  letter-spacing: 0.02em;
}

.cookie-consent p {
  font-family: var(--ff-body);
  font-size: 13px;
  line-height: 1.6;
  color: #584738;
  margin-bottom: 5px;
}

.cookie-policy-link {
  display: inline-block;
  margin-top: 7px;

  font-family: var(--ff-body);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;

  color: #584738;

  border-bottom: 1px solid rgba(88, 71, 56, 0.5);
}

.cookie-consent-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-shrink: 0;
}

.cookie-btn {
  border: none;
  cursor: pointer;

  padding: 12px 18px;

  font-family: var(--ff-body);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;

  transition:
    background 0.25s ease,
    color 0.25s ease,
    border-color 0.25s ease;
}

.cookie-btn-primary {
  background: #584738;
  color: #ffffff;
}

.cookie-btn-primary:hover {
  background: #113c5f;
}

.cookie-btn-secondary {
  background: transparent;
  color: #584738;
  border: 1px solid rgba(88, 71, 56, 0.35);
}

.cookie-btn-secondary:hover {
  background: rgba(255, 255, 255, 0.45);
}


/* =============================================
   COOKIE PREFERENCES MODAL
============================================= */

.cookie-preferences {
  position: fixed;
  inset: 0;
  z-index: 100000;

  display: flex;
  align-items: center;
  justify-content: center;

  opacity: 0;
  visibility: hidden;

  transition:
    opacity 0.3s ease,
    visibility 0.3s ease;
}

.cookie-preferences.visible {
  opacity: 1;
  visibility: visible;
}

.cookie-preferences-overlay {
  position: absolute;
  inset: 0;

  background: rgba(17, 60, 95, 0.38);
}

.cookie-preferences-modal {
  position: relative;
  z-index: 1;

  width: min(620px, calc(100% - 40px));
  max-height: 90vh;

  overflow-y: auto;

  background: #ffffff;

  padding: 45px;

  box-shadow: 0 25px 80px rgba(17, 60, 95, 0.2);
}

.cookie-preferences-modal h2 {
  font-family: var(--ff-display);
  font-size: 34px;
  font-weight: 400;

  color: #584738;

  margin-bottom: 12px;
}

.cookie-preferences-intro {
  font-family: var(--ff-body);
  font-size: 13px;
  line-height: 1.7;

  color: #584738;

  margin-bottom: 28px;
}

.cookie-close {
  position: absolute;
  top: 18px;
  right: 20px;

  background: none;
  border: none;

  font-family: Arial, sans-serif;
  font-size: 28px;
  font-weight: 300;

  color: #584738;

  cursor: pointer;
}


/* =============================================
   COOKIE CATEGORIES
============================================= */

.cookie-category {
  padding: 20px 0;

  border-top: 1px solid #f1ece9;
}

.cookie-category:last-of-type {
  border-bottom: 1px solid #f1ece9;
}

.cookie-category-header {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 20px;

  margin-bottom: 8px;
}

.cookie-category h3 {
  font-family: var(--ff-body);

  font-size: 12px;
  font-weight: 600;

  letter-spacing: 0.12em;
  text-transform: uppercase;

  color: #584738;
}

.cookie-category-header p {
  margin-top: 3px;

  font-family: var(--ff-body);
  font-size: 11px;

  color: #aaa396;
}

.cookie-category > p {
  font-family: var(--ff-body);
  font-size: 12px;
  line-height: 1.6;

  color: #584738;
}

.cookie-always-active {
  font-family: var(--ff-body);
  font-size: 9px;
  font-weight: 600;

  letter-spacing: 0.1em;
  text-transform: uppercase;

  color: #aaa396;
}


/* =============================================
   COOKIE SWITCH
============================================= */

.cookie-switch {
  position: relative;

  width: 44px;
  height: 24px;

  flex-shrink: 0;
}

.cookie-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.cookie-slider {
  position: absolute;
  inset: 0;

  cursor: pointer;

  background: #d8d1c8;

  border-radius: 24px;

  transition: 0.25s;
}

.cookie-slider::before {
  content: "";

  position: absolute;

  width: 18px;
  height: 18px;

  left: 3px;
  top: 3px;

  background: #ffffff;

  border-radius: 50%;

  transition: 0.25s;
}

.cookie-switch input:checked + .cookie-slider {
  background: #584738;
}

.cookie-switch input:checked + .cookie-slider::before {
  transform: translateX(20px);
}


/* =============================================
   SAVE BUTTON
============================================= */

.cookie-save {
  width: 100%;
  margin-top: 25px;
}


/* =============================================
   MOBILE
============================================= */

@media (max-width: 800px) {

  .cookie-consent {
    left: 12px;
    right: 12px;
    bottom: 12px;
  }

  .cookie-consent-inner {
    padding: 24px 20px;

    display: block;
  }

  .cookie-consent h2 {
    font-size: 25px;
  }

  .cookie-consent-actions {
    margin-top: 20px;

    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .cookie-btn-primary {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  .cookie-btn-secondary {
    grid-row: 2;
  }

  .cookie-preferences-modal {
    padding: 35px 25px;
  }

}

@media (max-width: 480px) {

  .cookie-consent-actions {
    grid-template-columns: 1fr;
  }

  .cookie-btn-primary,
  .cookie-btn-secondary {
    grid-column: auto;
    grid-row: auto;
    width: 100%;
  }

}



/* =========================================
   LEGAL PAGES
   ========================================= */

.legal-page {
  background: var(--white);
  color: var(--charcoal);
  padding: 150px 24px 100px;
}

.legal-container {
  max-width: 900px;
  margin: 0 auto;
}


/* HEADER */

.legal-header {
  text-align: center;
  margin-bottom: 70px;
}

.legal-eyebrow {
  display: block;
  font-family: var(--ff-body);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--adriatic);
  margin-bottom: 20px;
}

.legal-header h1 {
  font-family: var(--ff-display);
  font-size: clamp(48px, 7vw, 82px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: .01em;
  color: var(--sand);
  margin-bottom: 22px;
}

.legal-updated {
  font-family: var(--ff-body);
  font-size: 12px;
  letter-spacing: .08em;
  color: var(--mid);
}


/* INTRO */

.legal-intro {
  max-width: 760px;
  margin: 0 auto 65px;
  padding-bottom: 50px;
  border-bottom: 1px solid var(--border);
}

.legal-intro p,
.legal-section p {
  font-family: var(--ff-body);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.8;
  color: var(--charcoal);
  margin-bottom: 18px;
}

.legal-intro p:last-child,
.legal-section p:last-child {
  margin-bottom: 0;
}


/* SECTIONS */

.legal-section {
  max-width: 760px;
  margin: 0 auto 58px;
}

.legal-section h2 {
  font-family: var(--ff-display);
  font-size: 32px;
  font-weight: 400;
  line-height: 1.2;
  color: var(--sand);
  margin-bottom: 22px;
}

.legal-section ul {
  margin: 20px 0 24px;
  padding-left: 24px;
  list-style: disc;
}

.legal-section li {
  font-family: var(--ff-body);
  font-size: 16px;
  line-height: 1.8;
  color: var(--charcoal);
  margin-bottom: 8px;
}


/* LINKS */

.legal-page a {
  color: var(--sand);
  text-decoration: underline;
  text-decoration-color: rgba(181, 158, 125, .55);
  text-underline-offset: 4px;
  transition:
    color .25s ease,
    text-decoration-color .25s ease;
}

.legal-page a:hover {
  color: var(--adriatic);
  text-decoration-color: var(--adriatic);
}


/* CONTACT */

.legal-contact {
  padding-top: 10px;
}


/* RELATED POLICIES */

.legal-related {
  max-width: 760px;
  margin: 80px auto 0;
  padding-top: 35px;
  border-top: 1px solid var(--border);
}

.legal-related-title {
  font-family: var(--ff-body);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .25em;
  text-transform: uppercase;
  color: var(--mid);
  margin-bottom: 20px;
}

.legal-related-links {
  display: flex;
  flex-wrap: wrap;
  gap: 28px;
}

.legal-related-links a {
  font-family: var(--ff-body);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
}


/* =========================================
   RESPONSIVE
   ========================================= */

@media (max-width: 768px) {

  .legal-page {
    padding: 125px 20px 70px;
  }

  .legal-header {
    margin-bottom: 50px;
  }

  .legal-header h1 {
    font-size: clamp(44px, 14vw, 64px);
  }

  .legal-intro {
    margin-bottom: 50px;
    padding-bottom: 40px;
  }

  .legal-section {
    margin-bottom: 45px;
  }

  .legal-section h2 {
    font-size: 28px;
  }

  .legal-intro p,
  .legal-section p,
  .legal-section li {
    font-size: 15px;
    line-height: 1.75;
  }

  .legal-related {
    margin-top: 60px;
  }

  .legal-related-links {
    flex-direction: column;
    gap: 15px;
  }

}


/* =========================================
   PRIVACY POLICY
   ========================================= */

.legal-info-box {
  margin: 28px 0;
  padding: 28px 30px;
  background: #f1eada;
  border-left: 2px solid var(--adriatic);
}

.legal-info-box p {
  margin-bottom: 8px;
}

.legal-info-box p:last-child {
  margin-bottom: 0;
}


/* DATA TABLE */

.legal-data-table {
  width: 100%;
  margin: 35px 0;
  border-top: 1px solid var(--border);
}

.legal-data-row {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  border-bottom: 1px solid var(--border);
}

.legal-data-row > div {
  padding: 20px 18px;
  font-family: var(--ff-body);
  font-size: 14px;
  line-height: 1.65;
  color: var(--charcoal);
}

.legal-data-row > div:first-child {
  border-right: 1px solid var(--border);
}

.legal-data-header {
  background: #f1eada;
}

.legal-data-header > div {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--sand);
}


/* PRIVACY POLICY LISTS */

.legal-section li strong {
  color: var(--sand);
}


/* RESPONSIVE TABLE */

@media (max-width: 700px) {

  .legal-data-row {
    grid-template-columns: 1fr;
  }

  .legal-data-row > div:first-child {
    border-right: none;
    padding-bottom: 8px;
    font-weight: 600;
  }

  .legal-data-row > div:last-child {
    padding-top: 8px;
    padding-bottom: 20px;
  }

  .legal-data-header {
    display: none;
  }

  .legal-info-box {
    padding: 22px 20px;
  }

}


.legal-section a {
  word-break: break-word;
}