#fw-section-image-e9ccbe39-a88c-4896-b936-ff5eaf0e8e0a {

/* =========================================================  
 HERO DESKTOP  
 ========================================================= */  
@media (max-width: 767px) and (orientation: portrait) {  
 img {  
   display: none !important;  
 }  
}
}
#fw-section-image-8ee3aba5-fac8-4709-b38d-cccd466cc032 {

/* =========================================================  
 HERO MOBILE
 ========================================================= */  
@media (min-width: 768px), (orientation: landscape) {  
 img {  
   display: none !important;  
 }  
}
}
#fw-section-text-carousel-e50fd8a3-aca4-4f29-b054-dcf2250709d2 {
--font-heading-scale: 0.7;
--font-body-scale: 0.7;
}
#fw-section-text-carousel-e50fd8a3-aca4-4f29-b054-dcf2250709d2 {

/* =========================================================  
 MARQUEE 1  
 ========================================================= */  
* {  
 font-size: 13px !important;  
 line-height: 1.15 !important;  
 letter-spacing: 0.02em !important;  
}
}
#fw-section-featured-collection-0 {
--font-heading-scale: 0.7;
--font-body-scale: 0.7;
}
#fw-section-featured-collection-0 {

/* =========================================================  
 FEATURED COLLECTION  
 ETERNISTRY — ANIMALIA OCEANICA  
 Organic Moonlight + Editorial Collection Label  
 ========================================================= */

/* =========================================================  
 1. MAIN COLLECTION TITLE  
 ANIMALIA OCEANICA  
 ========================================================= */  
h2 {  
  position: relative !important;  
  display: block !important;  
  width: fit-content !important;  
  max-width: 100% !important;  
  margin-left: 0 !important;  
  margin-right: auto !important;  
  text-align: left !important;

  /* ---------------------------------------------------------  
     ORGANIC MOONLIGHT — PRECISION LOOP FIX  
     --------------------------------------------------------- */  
  background-image: linear-gradient(  
      110deg,  
      #A39E98 25%,   /* Longer, smoother transition from the base */  
      #DCDAD7 50%,   /* The translucent pearlescent reflection */  
      #A39E98 75%    /* Long, smooth return to the base */  
  ) !important;  
  
  /* Exact mathematical proportion for a seamless infinite loop */  
  background-size: 200% auto !important; 
  color: transparent !important;  
  -webkit-background-clip: text !important;  
  -webkit-text-fill-color: transparent !important;  
  background-clip: text !important;  
  
  /* 8 seconds: the exact atmospheric rhythm for this light width */  
  animation: etrnBarridoLuz 8s linear infinite !important;  
}

/* =========================================================  
 2. EYEBROW  
 ETERNISTRY  
 ========================================================= */  
h2::before {  
  content: "ETERNISTRY" !important;  
  display: block !important;  
  margin: 0 0 10px 0 !important;  
  padding: 0 !important;  
  background: none !important;  
  background-image: none !important;  
  color: rgba(163, 158, 152, 0.85) !important;  
  -webkit-text-fill-color: rgba(163, 158, 152, 0.85) !important;  
  -webkit-background-clip: border-box !important;  
  background-clip: border-box !important;  
  animation: none !important;  
  font-family: "Afacad", Arial, sans-serif !important;  
  font-size: clamp(8px, 0.8vw, 10px) !important;  
  font-style: normal !important;  
  font-weight: 500 !important;  
  line-height: 1 !important;  
  letter-spacing: 0.20em !important;  
  text-transform: uppercase !important;  
  white-space: nowrap !important;  
  pointer-events: none !important;  
}

/* =========================================================  
 3. COLLECTION COLOPHON  
 COLLECTION I · 2026  
 ========================================================= */  
h2::after {  
  content: "COLLECTION I · 2026" !important;  
  display: block !important;  
  margin: 11px 0 0 0 !important;  
  padding: 0 !important;  
  background: none !important;  
  background-image: none !important;  
  color: rgba(163, 158, 152, 0.70) !important;  
  -webkit-text-fill-color: rgba(163, 158, 152, 0.70) !important;  
  -webkit-background-clip: border-box !important;  
  background-clip: border-box !important;  
  animation: none !important;  
  font-family: "Afacad", Arial, sans-serif !important;  
  font-size: clamp(7px, 0.7vw, 9px) !important;  
  font-style: normal !important;  
  font-weight: 500 !important;  
  line-height: 1 !important;  
  letter-spacing: 0.16em !important;  
  text-transform: uppercase !important;  
  white-space: nowrap !important;  
  pointer-events: none !important;  
}

/* =========================================================  
 4. NARROW SCREENS  
 Center the entire collection identity  
 ========================================================= */  
@media screen and (max-width: 768px) {  
  h2 {  
      margin-left: auto !important;  
      margin-right: auto !important;  
      text-align: center !important;  
  }  
  h2::before {  
      margin-bottom: 9px !important;  
  }  
  h2::after {  
      margin-top: 10px !important;  
  }  
}
}
#fw-section-text-banner-4be21d45-b9b3-413f-ba4b-0d9d18d4970c {
--font-heading-scale: 0.7;
--font-body-scale: 0.7;
}
#fw-section-text-banner-4be21d45-b9b3-413f-ba4b-0d9d18d4970c {

/* =========================================================  
 WHY ETERNISTRY  
 ETERNISTRY — METALLIC SWEEP EFFECT  
 Elegant / Oceanic / Atmospheric  
 ========================================================= */  
h2 {  
   background-image: linear-gradient(  
       110deg,  
       #A39E98 25%, /* Pure solid silver base */  
       #DCDAD7 50%, /* Sharp and metallic white flash */  
       #A39E98 75%  /* Return to pure silver base */  
   ) !important;  
   background-size: 200% auto !important;

   color: transparent !important;  
   -webkit-background-clip: text !important;  
   -webkit-text-fill-color: transparent !important;  
   background-clip: text !important;

   /* Reduced speed to 9 seconds for a calming effect */  
   animation: etrnBarridoLuz 9s linear infinite !important; 
   
   display: inline-block !important;  
}
}
#fw-section-rich-text-be8f94d3-b041-4b47-ab06-b5527d974115 {
--font-heading-scale: 0.7;
--font-body-scale: 0.7;
}
#fw-section-rich-text-255216be-7655-4b8b-806e-080dad76892a {
--font-heading-scale: 0.7;
--font-body-scale: 0.7;
}
#fw-section-rich-text-bd20ff99-9327-4710-90e5-543e733ce34f {
--font-heading-scale: 0.7;
--font-body-scale: 0.7;
}
#fw-section-image-with-text-93398f77-3cc4-4373-ab39-6c17bc4b8d17 {
--font-heading-scale: 0.95;
--font-body-scale: 0.8;
}
#fw-section-donations-53dd5b2a-ff3b-48ba-8176-e1c885f60952 {
--font-heading-scale: 0.85;
--font-body-scale: 0.8;
}
#fw-section-donations-53dd5b2a-ff3b-48ba-8176-e1c885f60952 {

/* =========================================================  
 DONATIONS  
 ETERNISTRY — METALLIC SWEEP EFFECT  
 Elegant / Oceanic / Atmospheric  
 ========================================================= */  
h2 {  
   background-image: linear-gradient(  
       110deg,  
       #A39E98 25%, /* Pure solid silver base */  
       #DCDAD7 50%, /* Sharp and metallic white flash */  
       #A39E98 75%  /* Return to pure silver base */  
   ) !important;  
   background-size: 200% auto !important;

   color: transparent !important;  
   -webkit-background-clip: text !important;  
   -webkit-text-fill-color: transparent !important;  
   background-clip: text !important;

   /* Reduced speed to 9 seconds for a calming effect */  
   animation: etrnBarridoLuz 9s linear infinite !important; 
   
   display: inline-block !important;  
}
}
#fw-section-newsletter-cde0a06f-4394-40b2-b6ea-ca85779ff23b {
--font-heading-scale: 1.0;
--font-body-scale: 0.8;
}
#fw-section-newsletter-cde0a06f-4394-40b2-b6ea-ca85779ff23b {
--color-primary: #2d4955;
--color-primary-rgb: 45, 73, 85;
--color-background: #8c857b;
--color-background-rgb: 140, 133, 123;
--color-on-background: #f3f2f1;
--color-on-background-rgb: 243, 242, 241;
--color-on-primary: #bab5af;
--color-on-primary-rgb: 186, 181, 175;
--color-product-image-background: #f3f2f1;
--color-background-brightness: 134;
background-color: var(--color-background);
color: var(--color-on-background);
--primary-btn-bg: #2d4955;
--primary-btn-text: #bab5af;
--primary-btn-border-color: #f3f2f1;
--secondary-btn-bg: transparent;
--secondary-btn-text: #f3f2f1;
--secondary-btn-border-color: #f3f2f1;
/* =========================================================  
 ETERNISTRY — THE OCEANIC ARCHIVE 
 ========================================================= */

/* 1. ENVELOPE BODY */  
section:has(input[type="email"]) {  
  position: relative !important;  
  isolation: isolate !important;  
  overflow: visible !important;  
  background: #FCFBF4 !important;  
  padding-top: 46px !important;  
  padding-bottom: 126px !important;  
  box-shadow:  
      0 1px 0 rgba(255, 255, 255, 0.72) inset,  
      0 10px 16px rgba(84, 100, 116, 0.05),  
      0 24px 34px rgba(84, 100, 116, 0.06),  
      0 42px 52px rgba(84, 100, 116, 0.035) !important;  
}

/* 2. FLAP */  
section:has(input[type="email"])::before {  
  content: "";  
  position: absolute;  
  left: 0;  
  right: 0;  
  top: 0;  
  width: 100%;  
  height: 132px;  
  z-index: 1;  
  pointer-events: none;  
  background-image:  
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 140' preserveAspectRatio='none'%3E%3Cpath d='M0 0 H1600 L1495 126 H105 Z' fill='%23FFFDF8'/%3E%3Cpath d='M0 0 L105 126 H1495 L1600 0' fill='none' stroke='%239C9690' stroke-opacity='.62' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");  
  background-repeat: no-repeat;  
  background-position: center top;  
  background-size: 100% 100%;  
  filter: none !important;  
}

/* 3. INDEPENDENT FLAP SHADOW */  
section:has(input[type="email"])::after {  
  content: "";  
  position: absolute;  
  left: 7%;  
  width: 86%;  
  top: 118px;  
  height: 38px;  
  z-index: 0;  
  pointer-events: none;  
  background: linear-gradient(  
      to bottom,  
      rgba(84, 100, 116, 0.18) 0%,  
      rgba(84, 100, 116, 0.115) 24%,  
      rgba(84, 100, 116, 0.06) 50%,  
      rgba(84, 100, 116, 0.022) 74%,  
      rgba(84, 100, 116, 0) 100%  
  );  
  border-radius: 50%;  
  filter: blur(7px);  
  transform: translateY(3px) scaleX(1.015);  
  opacity: 0.86;  
}

/* 4. CONTENT OVER PAPER LAYERS */  
section:has(input[type="email"]) > * {  
  position: relative !important;  
  z-index: 2 !important;  
}

/* =========================================================  
 5. THE OCEANIC ARCHIVE (TITLE)  
 Engraved effect with Slate Blue flash  
 ========================================================= */  
section:has(input[type="email"]) :is(h1, h2, h3, [role="heading"]) {  
  display: block !important;  
  position: relative !important;  
  z-index: 3 !important;  
  width: fit-content !important;  
  max-width: calc(100% - 40px) !important;  
  margin: 0 auto 76px !important;  
  padding: 0 !important;  
  font-family: "Libre Bodoni", Georgia, serif !important;  
  font-size: clamp(34px, 4vw, 54px) !important;  
  font-weight: 400 !important;  
  line-height: 1.03 !important;  
  letter-spacing: 0 !important;  
  text-align: center !important;  
  white-space: nowrap !important;  
  /* Warm gradient for light background */  
  background-image: linear-gradient(  
      110deg,  
      #9C9690 20%, /* Sand/taupe tone of the envelope lines */  
      #2D4955 50%, /* Flash in your slate blue */  
      #9C9690 80%  
  ) !important;  
  background-size: 200% auto !important;  
  color: transparent !important;  
  -webkit-background-clip: text !important;  
  -webkit-text-fill-color: transparent !important;  
  background-clip: text !important;  
  /* Reduced speed to 9 seconds */  
  animation: etrnBarridoLuz 9s linear infinite !important; 
  text-shadow: none !important;  
}

section:has(input[type="email"]) :is(h1, h2, h3, [role="heading"])::before,  
section:has(input[type="email"]) :is(h1, h2, h3, [role="heading"])::after {  
  content: none !important;  
  display: none !important;  
}

/* 6. COPY */  
section:has(input[type="email"]) p {  
  position: relative !important;  
  z-index: 3 !important;  
  color: #9a9da0 !important;  
}

/* 7. FORM */  
section:has(input[type="email"]) form {  
  position: relative !important;  
  z-index: 3 !important;  
  margin-top: 24px !important;  
}

/* 8. EMAIL FIELD */  
section:has(input[type="email"]) input[type="email"] {  
  background: #FCFBF4 !important;  
  color: #5e6d7d !important;  
  border: 1px solid #5e6d7d !important;  
  outline: none !important;  
  box-shadow: none !important;  
  caret-color: #5e6d7d !important;  
}

section:has(input[type="email"]) input[type="email"]::placeholder {  
  color: rgba(94, 109, 125, 0.72) !important;  
  opacity: 1 !important;  
}

/* =========================================================  
 9. MOBILE  
 ========================================================= */  
@media screen and (max-width: 767px) {  
  section:has(input[type="email"]) {  
      padding-top: 34px !important;  
      padding-bottom: 54px !important;  
      box-shadow:  
          0 1px 0 rgba(255, 255, 255, 0.68) inset,  
          0 8px 12px rgba(84, 100, 116, 0.045),  
          0 18px 25px rgba(84, 100, 116, 0.055),  
          0 30px 38px rgba(84, 100, 116, 0.035) !important;  
  }  
  section:has(input[type="email"])::before {  
      left: 0;  
      right: 0;  
      width: 100%;  
      height: 108px;  
      background-image:  
          url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0 H1600 L1510 102 H90 Z' fill='%23FFFDF8'/%3E%3Cpath d='M0 0 L90 102 H1510 L1600 0' fill='none' stroke='%239C9690' stroke-opacity='.62' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");  
      filter: none !important;  
  }  
  section:has(input[type="email"])::after {  
      left: 6%;  
      width: 88%;  
      top: 91px;  
      height: 30px;  
      background: linear-gradient(  
          to bottom,  
          rgba(84, 100, 116, 0.15) 0%,  
          rgba(84, 100, 116, 0.095) 26%,  
          rgba(84, 100, 116, 0.05) 52%,  
          rgba(84, 100, 116, 0.018) 76%,  
          rgba(84, 100, 116, 0) 100%  
      );  
      filter: blur(5px);  
      transform: translateY(2px) scaleX(1.01);  
      opacity: 0.82;  
  }  
  section:has(input[type="email"]) :is(h1, h2, h3, [role="heading"]) {  
      width: fit-content !important;  
      max-width: calc(100% - 24px) !important;  
      margin: 0 auto 62px !important;  
      font-size: clamp(21px, 6vw, 27px) !important;  
      line-height: 1 !important;  
      letter-spacing: 0 !important;  
      text-align: center !important;  
      white-space: nowrap !important;  
  }  
  section:has(input[type="email"]) form {  
      margin-top: 20px !important;  
  }  
}
}
#fw-section-announcement-bar-8cbc46ff-beda-4c38-973b-020140831aa3 {
--font-heading-scale: 0.7;
--font-body-scale: 0.85;
}

#fw-section-text-carousel-b16e5602-7c9f-4c5a-b082-e8ec3b409ebb {
--font-heading-scale: 0.7;
--font-body-scale: 0.7;
}
#fw-section-text-carousel-b16e5602-7c9f-4c5a-b082-e8ec3b409ebb {

* {  
 font-size: 12px !important;  
 line-height: 1.15 !important;  
 letter-spacing: 0.03em !important;  
}
}
#fw-section-header {

/* =========================================================  
 ETERNISTRY — EDITORIAL MOBILE MENU  
 ========================================================= */  
@media screen and (max-width: 768px) {  
  /* =========================================================  
     1. DRAWER STRUCTURE  
     ========================================================= */  
  aside[data-drawer="mobile-menu"]  
  .drawer__content.mobile-menu {  
      display: flex !important;  
      flex-direction: column !important;  
      height: 100% !important;  
      min-height: 100% !important;  
      overflow: hidden !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__section--header {  
      flex: 0 0 auto !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__section--body {  
      position: relative !important;  
      flex: 1 1 auto !important;  
      min-height: 0 !important;  
      box-sizing: border-box !important;  
      padding:  
          0  
          22px  
          calc(190px + env(safe-area-inset-bottom)) !important;  
      overflow: hidden !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__nav {  
      position: static !important;  
      display: block !important;  
      width: 100% !important;  
      height: 100% !important;  
      min-height: 0 !important;  
  }  
  /* =========================================================  
     2. SCROLLABLE AREA  
     Navigation + currencies  
     ========================================================= */  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list {  
      display: flex !important;  
      flex-direction: column !important;  
      width: 100% !important;  
      height: 100% !important;  
      max-height: 100% !important;  
      box-sizing: border-box !important;  
      margin: 0 !important;  
      padding: 16px 0 24px !important;  
      overflow-x: hidden !important;  
      overflow-y: auto !important;  
      -webkit-overflow-scrolling: touch !important;  
      overscroll-behavior: contain !important;  
      list-style: none !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item {  
      flex: 0 0 auto !important;  
      width: 100% !important;  
      margin: 0 0 20px !important;  
      padding: 0 !important;  
      list-style: none !important;  
  }  
  /* =========================================================  
     3. HOME / WALL ART / SEND ME A NOTE  
     ========================================================= */  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item:nth-child(-n + 3)  
  > .mobile-menu__link {  
      display: flex !important;  
      align-items: baseline !important;  
      width: 100% !important;  
      margin: 0 !important;  
      padding: 0 !important;  
      color: #bab5af !important;  
      font-family:  
          "Libre Bodoni",  
          Georgia,  
          serif !important;  
      font-size: clamp(17px, 5.8vw, 23px) !important;  
      font-weight: 400 !important;  
      line-height: 1.08 !important;  
      letter-spacing: 0.005em !important;  
      text-transform: uppercase !important;  
      text-decoration: none !important;  
      white-space: nowrap !important;  
  }  
  /* =========================================================  
     3B. OPTICAL FIT — SEND ME A NOTE  
     Keeps the final E visible on mobile  
     ========================================================= */  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item:nth-child(3)  
  > .mobile-menu__link {  
      font-size: clamp(17px, 5.3vw, 21px) !important;  
      letter-spacing: -0.005em !important;  
  }  
  /* =========================================================  
     4. ROMAN NUMERALS  
     ========================================================= */  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item:nth-child(-n + 3)  
  > .mobile-menu__link::before {  
      display: inline-block !important;  
      flex: 0 0 22px !important;  
      width: 22px !important;  
      min-width: 22px !important;  
      margin-right: 7px !important;  
      color: rgba(186, 181, 175, 0.58) !important;  
      font-family:  
          "Afacad",  
          Arial,  
          sans-serif !important;  
      font-size: 8px !important;  
      font-weight: 500 !important;  
      line-height: 1 !important;  
      letter-spacing: 0.035em !important;  
      text-align: right !important;  
      transform: translateY(-0.35em) !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item:nth-child(1)  
  > .mobile-menu__link::before {  
      content: "I." !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item:nth-child(2)  
  > .mobile-menu__link::before {  
      content: "II." !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item:nth-child(3)  
  > .mobile-menu__link::before {  
      content: "III." !important;  
  }  
  /* =========================================================  
     5. CURRENCY  
     ========================================================= */  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item:nth-child(4) {  
      margin-top: 8px !important;  
      padding-top: 18px !important;  
      border-top:  
          1px solid rgba(186, 181, 175, 0.14) !important;  
  }  
  /* Visually hides "USD" as title */  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item:nth-child(4)  
  > .mobile-menu__link {  
      padding: 0 !important;  
      font-size: 0 !important;  
      color: rgba(186, 181, 175, 0.78) !important;  
  }  
  /* Replaces it with CURRENCY */  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item:nth-child(4)  
  > .mobile-menu__link::before {  
      content: "CURRENCY" !important;  
      color: rgba(186, 181, 175, 0.76) !important;  
      font-family:  
          "Afacad",  
          Arial,  
          sans-serif !important;  
      font-size: 10px !important;  
      font-weight: 500 !important;  
      line-height: 1.2 !important;  
      letter-spacing: 0.12em !important;  
      text-transform: uppercase !important;  
  }  
  /* Chevron */  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item:nth-child(4)  
  > .mobile-menu__link svg {  
      width: 11px !important;  
      height: 11px !important;  
      color: rgba(186, 181, 175, 0.76) !important;  
  }  
  /* ---------- Currency list ---------- */  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item:nth-child(4)  
  :is(ul, [role="listbox"]) {  
      max-height: 220px !important;  
      overflow-x: hidden !important;  
      overflow-y: auto !important;  
      -webkit-overflow-scrolling: touch !important;  
      overscroll-behavior: contain !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item:nth-child(4)  
  :is(ul, [role="listbox"])  
  :is(a, button, [role="option"]) {  
      font-family:  
          "Afacad",  
          Arial,  
          sans-serif !important;  
      font-size: 10px !important;  
      font-weight: 400 !important;  
      line-height: 1.25 !important;  
      letter-spacing: 0.06em !important;  
      color: rgba(186, 181, 175, 0.78) !important;  
  }  
  /* =========================================================  
     6. HOUSE SIGNATURE  
     ========================================================= */  
  /* ---------- Mini manifesto ---------- */  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__section--body::before {  
      content: "made for those who need the sea" !important;  
      position: absolute !important;  
      z-index: 3 !important;  
      left: 22px !important;  
      right: auto !important;  
      bottom:  
          calc(132px + env(safe-area-inset-bottom)) !important;  
      width: 235px !important;  
      max-width: calc(100% - 44px) !important;  
      box-sizing: border-box !important;  
      padding-top: 20px !important;  
      border-top:  
          1px solid rgba(154, 157, 160, 0.14) !important;  
      color: rgba(186, 181, 175, 0.92) !important;  
      font-family:  
          "Libre Bodoni",  
          Georgia,  
          serif !important;  
      font-size: clamp(12px, 3.4vw, 14px) !important;  
      font-style: italic !important;  
      font-weight: 400 !important;  
      line-height: 1.2 !important;  
      text-align: left !important;  
      white-space: nowrap !important;  
      pointer-events: none !important;  
  }  
  /* ---------- From where the ocean never ends ---------- */  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__section--body::after {  
      content: "from where the ocean never ends," !important;  
      position: absolute !important;  
      z-index: 3 !important;  
      left: 22px !important;  
      right: 22px !important;  
      bottom:  
          calc(91px + env(safe-area-inset-bottom)) !important;  
      color: rgba(186, 181, 175, 0.82) !important;  
      font-family:  
          "Apple Chancery",  
          "Segoe Script",  
          cursive !important;  
      font-size: 14px !important;  
      font-style: italic !important;  
      font-weight: 400 !important;  
      line-height: 1.3 !important;  
      text-align: left !important;  
      white-space: nowrap !important;  
      pointer-events: none !important;  
  }  
  /* ---------- Eternistry ---------- */  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__nav::before {  
      content: "Eternistry" !important;  
      position: absolute !important;  
      z-index: 3 !important;  
      left: 14px !important;  
      right: auto !important;  
      bottom:  
          calc(59px + env(safe-area-inset-bottom)) !important;  
      width: auto !important;  
      margin: 0 !important;  
      padding: 0 !important;  
      color: rgba(186, 181, 175, 0.94) !important;  
      font-family:  
          "Apple Chancery",  
          "Segoe Script",  
          cursive !important;  
      font-size: 22px !important;  
      font-style: italic !important;  
      font-weight: 400 !important;  
      line-height: 1 !important;  
      text-align: left !important;  
      pointer-events: none !important;  
  }  
  /* ---------- Colophon ---------- */  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__nav::after {  
      content: "THE OCEAN IS ETERNAL · EST. 2026" !important;  
      position: absolute !important;  
      z-index: 3 !important;  
      left: 22px !important;  
      right: 22px !important;  
      bottom:  
          calc(27px + env(safe-area-inset-bottom)) !important;  
      color: rgba(186, 181, 175, 0.46) !important;  
      font-family:  
          "Afacad",  
          Arial,  
          sans-serif !important;  
      font-size: 8px !important;  
      font-weight: 500 !important;  
      line-height: 1 !important;  
      letter-spacing: 0.14em !important;  
      text-align: left !important;  
      white-space: nowrap !important;  
      pointer-events: none !important;  
  }  
}  
/* =========================================================  
 7. VERY NARROW SCREENS  
 ========================================================= */  
@media screen and (max-width: 360px) {  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__section--body {  
      padding-left: 17px !important;  
      padding-right: 17px !important;  
      padding-bottom:  
          calc(176px + env(safe-area-inset-bottom)) !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item:nth-child(-n + 3)  
  > .mobile-menu__link {  
      font-size: 17px !important;  
      letter-spacing: 0 !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item:nth-child(-n + 3)  
  > .mobile-menu__link::before {  
      flex-basis: 18px !important;  
      width: 18px !important;  
      min-width: 18px !important;  
      margin-right: 5px !important;  
      font-size: 7px !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__section--body::before {  
      left: 17px !important;  
      right: auto !important;  
      width: 210px !important;  
      max-width: calc(100% - 34px) !important;  
      bottom:  
          calc(122px + env(safe-area-inset-bottom)) !important;  
      font-size: 12px !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__section--body::after {  
      left: 17px !important;  
      right: 17px !important;  
      bottom:  
          calc(84px + env(safe-area-inset-bottom)) !important;  
      font-size: 12px !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__nav::before {  
      left: 9px !important;  
      bottom:  
          calc(55px + env(safe-area-inset-bottom)) !important;  
      font-size: 20px !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__nav::after {  
      left: 17px !important;  
      right: 17px !important;  
      bottom:  
          calc(25px + env(safe-area-inset-bottom)) !important;  
      font-size: 7px !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item:nth-child(4)  
  :is(ul, [role="listbox"]) {  
      max-height: 180px !important;  
  }  
}  
/* =========================================================  
 8. SHORT SCREENS  
 ========================================================= */  
@media screen and (max-width: 768px) and (max-height: 700px) {  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__section--body {  
      padding-bottom:  
          calc(158px + env(safe-area-inset-bottom)) !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item {  
      margin-bottom: 15px !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__section--body::before {  
      bottom:  
          calc(108px + env(safe-area-inset-bottom)) !important;  
      padding-top: 15px !important;  
      font-size: 12px !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__section--body::after {  
      bottom:  
          calc(75px + env(safe-area-inset-bottom)) !important;  
      font-size: 12px !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__nav::before {  
      bottom:  
          calc(48px + env(safe-area-inset-bottom)) !important;  
      font-size: 19px !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__nav::after {  
      bottom:  
          calc(21px + env(safe-area-inset-bottom)) !important;  
  }  
  aside[data-drawer="mobile-menu"]  
  .mobile-menu__list-item:nth-child(4)  
  :is(ul, [role="listbox"]) {  
      max-height: 150px !important;  
  }  
}
}



#fw-section-collection-template-search {
--font-heading-scale: 0.7;
--font-body-scale: 0.7;
}
#fw-section-password {
--font-heading-scale: 0.8;
--font-body-scale: 0.75;
}