/* ==========================================================
   SYMFINY ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â style.css
   All styles for every page, in one file.

   How it is organised
   -------------------
   1. BASE           ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â tiny reset shared by every page
   2. HOME           ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â index.php              (#symfiny-site)
   3. ABOUT US       ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â about-us.php           (#symfiny-about)
   4. CONTACT        ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â contact.php            (#symfiny-contact)
   5. LEARNING       ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â learning-symfiny.php   (#sym-learning)

   Every page's rules are scoped to its own wrapper id, so a
   page can never restyle another page.  Fonts are loaded from 
   header.php (<link>), not with @import.
   ========================================================== */

/* ==========================================================
   1. BASE
   ========================================================== */
html,
body {
  margin: 0;
  padding: 0;
}


/* ==========================================================
   HOME PAGE (index.php)
   Root: #symfiny-site
   ========================================================== */


/* ---- 01. BRAND SYSTEM ---- */

#symfiny-site {
  --teal: #174C45;
  --sage: #5F8F82;
  --aqua: #8DB9B4;
  --white: #FAF9F5;
  --muted: #667873;
  --serif: "Cormorant Garamond", Georgia, serif;
  --sans: "DM Sans", Arial, sans-serif;
  --max: 1240px;
  width: 100%;
  overflow: hidden;
  color: var(--ink);
  font-family: var(--sans);
  line-height: 1.65;
  box-sizing: border-box;
  scroll-behavior: smooth;
}

#symfiny-site *,
#symfiny-site *::before,
#symfiny-site *::after {
  box-sizing: border-box;
}

#symfiny-site img,
#symfiny-site video {
  display: block;
  max-width: 100%;
}

#symfiny-site a {
  color: inherit;
  text-decoration: none;
}

#symfiny-site button {
  font-family: inherit;
}


/* ---- 03. GLOBAL WATER / GLASS VEIL ---- */

#symfiny-site::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9990;
  background: radial-gradient( circle at 20% 10%, rgba(141,185,180,.055), transparent 35% ), radial-gradient( circle at 80% 70%, rgba(185,154,99,.035), transparent 30% );
  mix-blend-mode: normal;
}

#symfiny-site::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9989;
  opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E");
}


/* ---- 04. CONTAINER ---- */

:where(#symfiny-site) .sf-wrap {
  width: min(calc(100% - 48px), var(--max));
  margin: 0 auto;
}

:where(#symfiny-site) .sf-section {
  position: relative;
  padding: 120px 0;
}

:where(#symfiny-site) .sf-eyebrow {
  margin: 0 0 18px;
  color: var(--gold);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
}

:where(#symfiny-site) .sf-title {
  margin: 0;
  color: var(--forest);
  font-family: var(--serif);
  font-size: clamp(42px,5vw,72px);
  font-weight: 500;
  line-height: .98;
  letter-spacing: -.025em;
}

:where(#symfiny-site) .sf-title-light {
  color: var(--white);
}

:where(#symfiny-site) .sf-copy {
  max-width: 650px;
  margin: 25px 0 0;
  color: #536863;
  font-size: 17px;
  line-height: 1.8;
}

:where(#symfiny-site) .sf-copy-light {
  color: rgba(250,249,245,.78);
}

:where(#symfiny-site) .sf-small {
  font-size: 13px;
  color: var(--muted);
}

:where(#symfiny-site) .sf-gold-line {
  width: 52px;
  height: 1px;
  margin: 25px 0;
  background: var(--gold);
}


/* ---- 05. HEADER ---- */

:where(#symfiny-site) .sf-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
}

:where(#symfiny-site) .sf-header.sf-scrolled {
  position: fixed;
}

:where(#symfiny-site) .sf-nav {
  width: min(calc(100% - 48px), 1380px);
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
}

:where(#symfiny-site) .sf-logo {
  width: 130px;
  flex-shrink: 0;
}

:where(#symfiny-site) .sf-logo img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

:where(#symfiny-site) .sf-menu {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 31px;
  margin-left: auto;
}

:where(#symfiny-site) .sf-menu a {
  position: relative;
  color: var(--white) !important;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  opacity: .96;
}

/*:where(#symfiny-site) .sf-menu a:nth-child(3) {*/
/*  max-width: 230px;*/
/*  text-align: center;*/
/*  line-height: 1.25;*/
/*}*/

:where(#symfiny-site) .sf-menu a:hover {
  color: #fff !important;
  opacity: 1;
}

:where(#symfiny-site) .sf-menu a::after {
  content: "";
  position: absolute;
  left: 0;
  width: 0;
  background: var(--gold);
  transition: width .3s ease;
}

:where(#symfiny-site) .sf-menu a:hover::after,
:where(#symfiny-site) .sf-menu a.sf-active::after {
  width: 100%;
}

:where(#symfiny-site) .sf-enquire {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  color: var(--white) !important;
  border: 1px solid rgba(250,249,245,.65);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .09em;
  text-transform: uppercase;
}

:where(#symfiny-site) .sf-enquire:hover {
  border-color: rgba(250,249,245,.95);
}


/* ---- AQUAWORLD UTILITY ---- */

:where(#symfiny-site) .sf-aquaworld-top {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 40px;
  padding: 0 14px;
  color: var(--cream) !important;
  border: 1px solid rgba(185,154,99,.45);
  border-radius: 999px;
  background: rgba(185,154,99,.07);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: background .3s ease,border-color .3s ease,transform .3s ease;
}

:where(#symfiny-site) .sf-aquaworld-top span {
  color: var(--gold);
  font-size: 13px;
}

:where(#symfiny-site) .sf-aquaworld-top:hover {
  background: rgba(185,154,99,.15);
  border-color: rgba(185,154,99,.78);
  transform: translateY(-1px);
}

:where(#symfiny-site) .sf-aquaworld-menu-link {
  color: var(--gold) !important;
}

@media (max-width:1000px) {
  :where(#symfiny-site) .sf-aquaworld-top {
    display: none;
  }
}

:where(#symfiny-site) .sf-mobile-toggle {
  display: none;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(250,249,245,.4);
  border-radius: 50%;
  background: rgba(16,47,43,.35);
  color: white;
  cursor: pointer;
}

:where(#symfiny-site) .sf-mobile-toggle span,
:where(#symfiny-site) .sf-mobile-toggle span::before,
:where(#symfiny-site) .sf-mobile-toggle span::after {
  display: block;
  width: 16px;
  height: 1px;
  margin: auto;
  background: white;
  content: "";
}

:where(#symfiny-site) .sf-mobile-toggle span::before {
  transform: translateY(-5px);
}

:where(#symfiny-site) .sf-mobile-toggle span::after {
  transform: translateY(4px);
}

:where(#symfiny-site) .sf-header {
  --sf-menu-opacity: 1;
}

:where(#symfiny-site) .sf-header .sf-nav {
  opacity: var(--sf-menu-opacity);
  transition: opacity .7s cubic-bezier(.22,1,.36,1), background .45s ease, border-color .45s ease, box-shadow .45s ease, transform .45s cubic-bezier(.22,1,.36,1);
}

:where(#symfiny-site) .sf-header .sf-logo {
  opacity: calc(.82 + (var(--sf-menu-opacity) * .18));
}

:where(#symfiny-site) .sf-header.sf-menu-quiet .sf-nav {
  opacity: .56;
}

:where(#symfiny-site) .sf-header.sf-menu-quiet .sf-nav:hover,
:where(#symfiny-site) .sf-header.sf-menu-quiet .sf-nav:focus-within {
  opacity: .96;
}

:where(#symfiny-site) .sf-header.sf-menu-quiet .sf-logo {
  opacity: .78;
}

:where(#symfiny-site) .sf-header {
  padding: 18px 0;
  transition: transform .55s cubic-bezier(.22,1,.36,1), background .45s ease, backdrop-filter .45s ease, padding .45s ease, box-shadow .45s ease, border-color .45s ease;
  will-change: transform;
}

:where(#symfiny-site) .sf-header:not(.sf-scrolled) {
  background: linear-gradient(180deg,rgba(7,31,28,.42),rgba(7,31,28,0));
}

:where(#symfiny-site) .sf-header.sf-scrolled {
  padding: 10px 0;
  background: rgba(10,39,35,.72);
  backdrop-filter: blur(24px) saturate(145%);
  -webkit-backdrop-filter: blur(24px) saturate(145%);
  border-bottom: 1px solid rgba(244,241,232,.13);
  box-shadow: 0 14px 45px rgba(3,20,18,.18), inset 0 1px 0 rgba(255,255,255,.06);
}

:where(#symfiny-site) .sf-nav {
  padding: 6px 20px;
  border: 1px solid rgba(244,241,232,.10);
  border-radius: 999px;
  background: rgba(12,48,43,.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055);
  transition: background .45s ease,border-color .45s ease,box-shadow .45s ease;
}

:where(#symfiny-site) .sf-scrolled .sf-nav {
  background: rgba(244,241,232,.045);
  border-color: rgba(244,241,232,.12);
}

:where(#symfiny-site) .sf-logo {
  position: relative;
  transition: transform .45s cubic-bezier(.22,1,.36,1),filter .35s ease;
}

:where(#symfiny-site) .sf-logo:hover {
  transform: translateY(-1px) scale(1.035);
  filter: drop-shadow(0 5px 16px rgba(141,185,180,.18));
}

:where(#symfiny-site) .sf-menu a {
  padding: 10px 2px;
  transition: color .28s ease,opacity .28s ease,transform .28s ease;
}

:where(#symfiny-site) .sf-menu a:hover {
  transform: translateY(-2px);
}

:where(#symfiny-site) .sf-menu a::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 2px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--gold);
  transform: translateX(-50%) scale(0);
  opacity: 0;
  transition: transform .3s cubic-bezier(.22,1,.36,1),opacity .3s ease;
}

:where(#symfiny-site) .sf-menu a:hover::before,
:where(#symfiny-site) .sf-menu a.sf-active::before {
  transform: translateX(-50%) scale(1);
  opacity: 1;
}

:where(#symfiny-site) .sf-menu a::after {
  bottom: 0;
  height: 1px;
  opacity: .7;
}

:where(#symfiny-site) .sf-enquire {
  position: relative;
  overflow: hidden;
  min-height: 40px;
  padding: 0 17px;
  background: linear-gradient(135deg,rgba(244,241,232,.10),rgba(141,185,180,.08));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10),0 5px 18px rgba(0,0,0,.08);
  transition: transform .35s cubic-bezier(.22,1,.36,1),background .35s ease,border-color .35s ease,box-shadow .35s ease;
}

:where(#symfiny-site) .sf-enquire::before {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-120%) skewX(-18deg);
  background: linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent);
  transition: transform .65s ease;
}

:where(#symfiny-site) .sf-enquire:hover {
  transform: translateY(-2px);
  background: rgba(244,241,232,.14);
  box-shadow: 0 9px 26px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.14);
}

:where(#symfiny-site) .sf-enquire:hover::before {
  transform: translateX(120%) skewX(-18deg);
}

@media (max-width:900px) {
  :where(#symfiny-site) .sf-nav {
    padding: 5px 7px;
  }
  :where(#symfiny-site) .sf-header {
    padding: 12px 0;
  }
  :where(#symfiny-site) .sf-header.sf-scrolled {
    padding: 8px 0;
  }
}


/* ---- 06. HERO ---- */

:where(#symfiny-site) .sf-hero {
  position: relative;
  min-height: 92vh;
  min-height: 92svh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: linear-gradient( 180deg, #102F2B 0%, #174C45 100% );
}

:where(#symfiny-site) .sf-hero-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  transform: scale(1.035);
}

:where(#symfiny-site) .sf-hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient( 180deg, rgba(16,47,43,.56) 0%, rgba(16,47,43,.23) 38%, rgba(16,47,43,.60) 100% );
}

:where(#symfiny-site) .sf-hero-overlay::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient( ellipse at center, transparent 15%, rgba(8,29,26,.27) 100% );
}

:where(#symfiny-site) .sf-hero-inner {
  position: relative;
  z-index: 3;
  width: min(calc(100% - 40px),900px);
  padding-top: 60px;
  text-align: center;
  transition: transform .12s linear, opacity .12s linear;
}

:where(#symfiny-site) .sf-hero-kicker {
  margin: 0 0 18px;
  color: rgba(250,249,245,.86);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .24em;
  text-transform: uppercase;
}

:where(#symfiny-site) .sf-hero h1 {
  margin: 0;
  color: var(--white);
  font-family: var(--serif);
  font-size: clamp(58px,9vw,112px);
  font-weight: 500;
  line-height: .83;
  letter-spacing: -.04em;
}

:where(#symfiny-site) .sf-hero h1 span {
  display: block;
}

:where(#symfiny-site) .sf-hero-sub {
  max-width: 680px;
  margin: 30px auto 0;
  color: rgba(250,249,245,.82);
  font-size: 16px;
  line-height: 1.75;
}

:where(#symfiny-site) .sf-hero-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 35px;
}

:where(#symfiny-site) .sf-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 50px;
  padding: 0 25px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .11em;
  text-transform: uppercase;
  cursor: pointer;
  transition: transform .3s ease, background .3s ease, color .3s ease, border-color .3s ease;
}

:where(#symfiny-site) .sf-btn:hover {
  transform: translateY(-2px);
}

:where(#symfiny-site) .sf-btn-light {
  color: var(--forest) !important;
  background: var(--white);
  border: 1px solid var(--white);
}

:where(#symfiny-site) .sf-btn-light:hover {
  background: #fff;
}

:where(#symfiny-site) .sf-btn-outline {
  color: var(--white) !important;
  background: rgba(250,249,245,.06);
  border: 1px solid rgba(250,249,245,.68);
  backdrop-filter: blur(10px);
}

:where(#symfiny-site) .sf-btn-outline:hover {
  background: rgba(250,249,245,.12);
  border-color: white;
}

:where(#symfiny-site) .sf-scroll {
  position: absolute;
  left: 50%;
  bottom: 25px;
  z-index: 3;
  transform: translateX(-50%);
  color: rgba(250,249,245,.72);
  font-size: 9px;
  letter-spacing: .25em;
  text-transform: uppercase;
}

:where(#symfiny-site) .sf-scroll::after {
  content: "";
  display: block;
  width: 1px;
  height: 38px;
  margin: 10px auto 0;
  background: linear-gradient( to bottom, rgba(250,249,245,.7), transparent );
}


/* ---- 07. SOUND CONTROL ---- */

:where(#symfiny-site) .sf-sound {
  position: fixed;
  left: 22px;
  bottom: 22px;
  z-index: 1100;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 0 15px;
  color: var(--white);
  border: 1px solid rgba(250,249,245,.38);
  border-radius: 999px;
  background: rgba(16,47,43,.70);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .3s ease, border-color .3s ease;
}

:where(#symfiny-site) .sf-sound:hover {
  background: rgba(16,47,43,.9);
  border-color: rgba(250,249,245,.7);
}

:where(#symfiny-site) .sf-sound-icon {
  font-size: 14px;
}


/* ---- 08. INTRODUCTION ---- */

:where(#symfiny-site) .sf-intro {
  background: var(--cream);
}

:where(#symfiny-site) .sf-intro-grid {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: 90px;
  align-items: center;
}

:where(#symfiny-site) .sf-intro-image {
  position: relative;
}

:where(#symfiny-site) .sf-intro-image img {
  width: 100%;
  height: 620px;
  object-fit: cover;
  border-radius: 4px 80px 4px 80px;
}

:where(#symfiny-site) .sf-image-note {
  position: absolute;
  right: -18px;
  bottom: 25px;
  max-width: 230px;
  padding: 20px;
  color: var(--forest);
  background: rgba(250,249,245,.86);
  border: 1px solid rgba(16,47,43,.1);
  border-radius: 18px;
  backdrop-filter: blur(12px);
}

:where(#symfiny-site) .sf-image-note strong {
  display: block;
  color: var(--gold);
  font-family: var(--serif);
  font-size: 28px;
  font-weight: 500;
  line-height: 1;
}


/* ---- 09. THREE WORDS / PHILOSOPHY ---- */

:where(#symfiny-site) .sf-triad {
  padding: 55px 0 65px;
  background: var(--forest);
}

:where(#symfiny-site) .sf-triad-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 1px;
  background: rgba(250,249,245,.14);
}

:where(#symfiny-site) .sf-triad-item {
  padding: 35px;
  background: var(--forest);
  text-align: center;
}

:where(#symfiny-site) .sf-triad-number {
  margin-bottom: 13px;
  color: var(--gold);
  font-family: var(--serif);
  font-size: 38px;
}

:where(#symfiny-site) .sf-triad-item h3 {
  margin: 0;
  color: var(--white);
  font-family: var(--serif);
  font-size: 30px;
  font-weight: 500;
}

:where(#symfiny-site) .sf-triad-item p {
  margin: 10px auto 0;
  max-width: 280px;
  color: rgba(250,249,245,.64);
  font-size: 13px;
}


/* ---- 10. JAL / WATER ---- */

:where(#symfiny-site) .sf-jal {
  background: var(--cream);
}

:where(#symfiny-site) .sf-jal-inner {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 70px;
  align-items: center;
}

:where(#symfiny-site) .sf-jal-copy {
  max-width: 560px;
}

:where(#symfiny-site) .sf-jal-words {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 30px;
}

:where(#symfiny-site) .sf-jal-pill {
  padding: 8px 13px;
  color: var(--teal);
  border: 1px solid rgba(23,76,69,.18);
  border-radius: 999px;
  background: rgba(141,185,180,.13);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
}

:where(#symfiny-site) .sf-jal-image {
  position: relative;
}

:where(#symfiny-site) .sf-jal-image img {
  width: 100%;
  height: 590px;
  object-fit: cover;
  border-radius: 80px 4px 80px 4px;
}

:where(#symfiny-site) .sf-frog {
  position: absolute;
  right: 22px;
  top: 24px;
  width: 46px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(250,249,245,.78);
  border: 1px solid rgba(16,47,43,.12);
  backdrop-filter: blur(10px);
  font-size: 21px;
  transform: rotate(7deg);
}


/* ---- 11. WATER BROS ---- */

:where(#symfiny-site) .sf-bros {
  position: relative;
  min-height: 620px;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--teal);
}

:where(#symfiny-site) .sf-bros::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient( circle at 25% 50%, rgba(141,185,180,.20), transparent 30% ), linear-gradient( 90deg, rgba(16,47,43,.96), rgba(16,47,43,.60) );
}

:where(#symfiny-site) .sf-bros-inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 70px;
  align-items: center;
}

:where(#symfiny-site) .sf-bros-photo {
  position: relative;
}

:where(#symfiny-site) .sf-bros-photo img {
  width: 100%;
  height: 560px;
  object-fit: cover;
  object-position: center;
  border-radius: 4px 100px 4px 100px;
}

:where(#symfiny-site) .sf-bros-note {
  position: absolute;
  padding: 11px 15px;
  color: var(--forest);
  background: var(--cream);
  border-radius: 5px 16px 5px 16px;
  font-family: var(--serif);
  font-size: 21px;
  line-height: 1.05;
  box-shadow: 0 15px 40px rgba(0,0,0,.18);
  transform: rotate(-3deg);
}

:where(#symfiny-site) .sf-bros-note.one {
  left: -20px;
  top: 55px;
}

:where(#symfiny-site) .sf-bros-note.two {
  right: -25px;
  bottom: 55px;
  transform: rotate(3deg);
}

:where(#symfiny-site) .sf-bros-copy .sf-eyebrow {
  color: var(--aqua);
}

:where(#symfiny-site) .sf-bros-copy .sf-title {
  color: var(--white);
}

:where(#symfiny-site) .sf-bros-copy p {
  color: rgba(250,249,245,.76);
}

:where(#symfiny-site) .sf-bros-signoff {
  margin-top: 30px;
  color: var(--gold);
  font-family: var(--serif);
  font-size: 27px;
  font-style: italic;
}


/* ---- 12. STORY ---- */

:where(#symfiny-site) .sf-story {
  background: var(--white);
}

:where(#symfiny-site) .sf-story-grid {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 90px;
  align-items: center;
}

:where(#symfiny-site) .sf-family img {
  width: 100%;
  height: 650px;
  object-fit: cover;
  border-radius: 80px 4px 80px 4px;
}

:where(#symfiny-site) .sf-story-copy {
  max-width: 560px;
}

:where(#symfiny-site) .sf-story-quote {
  margin: 35px 0;
  padding: 25px 0 25px 25px;
  border-left: 1px solid var(--gold);
  color: var(--forest);
  font-family: var(--serif);
  font-size: 31px;
  line-height: 1.12;
}


/* ---- 13. EXPLORE FOUR PATHS ---- */

:where(#symfiny-site) .sf-explore {
  background: var(--cream);
}

:where(#symfiny-site) .sf-explore-head {
  max-width: 700px;
  margin: 0 auto 55px;
  text-align: center;
}

:where(#symfiny-site) .sf-explore-head .sf-gold-line {
  margin-left: auto;
  margin-right: auto;
}

:where(#symfiny-site) .sf-cards {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 15px;
}

:where(#symfiny-site) .sf-card {
  position: relative;
  overflow: hidden;
  min-height: 430px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  border-radius: 5px 38px 5px 38px;
  background: var(--forest);
  box-shadow: 0 15px 45px rgba(16,47,43,.09);
  transition: transform .45s ease, box-shadow .45s ease;
}

:where(#symfiny-site) .sf-card:hover {
  transform: translateY(-7px);
  box-shadow: 0 25px 60px rgba(16,47,43,.16);
}

:where(#symfiny-site) .sf-card-image {
  position: absolute;
  inset: 0;
}

:where(#symfiny-site) .sf-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .8s ease;
}

:where(#symfiny-site) .sf-card:hover .sf-card-image img {
  transform: scale(1.045);
}

:where(#symfiny-site) .sf-card-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient( 180deg, rgba(16,47,43,.03) 20%, rgba(16,47,43,.85) 100% );
}

:where(#symfiny-site) .sf-card-content {
  position: relative;
  z-index: 2;
  padding: 28px 25px;
}

:where(#symfiny-site) .sf-card-number {
  color: var(--gold);
  font-size: 10px;
  letter-spacing: .15em;
  font-weight: 700;
}

:where(#symfiny-site) .sf-card h3 {
  margin: 7px 0 7px;
  color: var(--white);
  font-family: var(--serif);
  font-size: 31px;
  font-weight: 500;
  line-height: 1;
}

:where(#symfiny-site) .sf-card p {
  margin: 0;
  color: rgba(250,249,245,.74);
  font-size: 12px;
  line-height: 1.55;
}

:where(#symfiny-site) .sf-card-link {
  display: inline-flex;
  margin-top: 18px;
  color: var(--white);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}


/* ---- 14. WATERKEEPER BAND ---- */

:where(#symfiny-site) .sf-waterkeeper {
  position: relative;
  min-height: 560px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: var(--forest);
}

:where(#symfiny-site) .sf-waterkeeper video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .60;
}

:where(#symfiny-site) .sf-waterkeeper::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient( 90deg, rgba(16,47,43,.88), rgba(16,47,43,.50), rgba(16,47,43,.82) );
}

:where(#symfiny-site) .sf-waterkeeper-inner {
  position: relative;
  z-index: 2;
  max-width: 850px;
  text-align: center;
}

:where(#symfiny-site) .sf-waterkeeper .sf-eyebrow {
  color: var(--aqua);
}

:where(#symfiny-site) .sf-waterkeeper .sf-title {
  color: var(--white);
}

:where(#symfiny-site) .sf-waterkeeper p {
  color: rgba(250,249,245,.74);
}

:where(#symfiny-site) .sf-waterkeeper-quote {
  margin-top: 30px;
  color: var(--gold);
  font-family: var(--serif);
  font-size: 25px;
  font-style: italic;
}


/* ---- 15. SMALL FROG MOMENT #2 ---- */

:where(#symfiny-site) .sf-frog-two {
  position: absolute;
  left: 8%;
  bottom: 18%;
  opacity: .82;
  font-size: 24px;
  transform: rotate(-7deg);
}


/* ---- 16. FINAL CTA ---- */

:where(#symfiny-site) .sf-final {
  position: relative;
  padding: 130px 0;
  background: var(--white);
  text-align: center;
}

:where(#symfiny-site) .sf-final-inner {
  max-width: 800px;
  margin: auto;
}

:where(#symfiny-site) .sf-final .sf-title {
  font-size: clamp(48px,6vw,82px);
}

:where(#symfiny-site) .sf-final p {
  max-width: 650px;
  margin: 25px auto 0;
  color: #64746f;
  font-size: 16px;
}

:where(#symfiny-site) .sf-final-actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 35px;
}


/* ---- 17. FOOTER ---- */

:where(#symfiny-site) .sf-footer {
  padding: 60px 0 25px;
  color: rgba(250,249,245,.70);
  background: var(--forest);
}

:where(#symfiny-site) .sf-footer-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr;
  gap: 50px;
  padding-bottom: 45px;
  border-bottom: 1px solid rgba(250,249,245,.13);
}

:where(#symfiny-site) .sf-footer-logo {
  width: 125px;
}

:where(#symfiny-site) .sf-footer p {
  max-width: 340px;
  margin: 18px 0 0;
  font-size: 12px;
  line-height: 1.7;
}

:where(#symfiny-site) .sf-footer h4 {
  margin: 0 0 15px;
  color: var(--white);
  font-size: 10px;
  letter-spacing: .15em;
  text-transform: uppercase;
}

:where(#symfiny-site) .sf-footer-links {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

:where(#symfiny-site) .sf-footer-links a {
  color: rgba(250,249,245,.67);
  font-size: 12px;
  transition: color .25s ease;
}

:where(#symfiny-site) .sf-footer-links a:hover {
  color: var(--white);
}

:where(#symfiny-site) .sf-footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding-top: 20px;
  font-size: 10px;
}


/* ---- 18. REVEAL ANIMATION ---- */

:where(#symfiny-site) .sf-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .9s ease, transform 1s cubic-bezier(.22,.61,.36,1);
}

:where(#symfiny-site) .sf-reveal.sf-visible {
  opacity: 1;
  transform: none;
}


/* ---- 18B. HOMEPAGE EDITORIAL REFINEMENT ---- */

:where(#symfiny-site) .sf-purpose {
  background: var(--cream);
  padding-top: 135px;
}

:where(#symfiny-site) .sf-purpose-intro {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 90px;
  align-items: end;
  margin-bottom: 70px;
}

:where(#symfiny-site) .sf-purpose-lead {
  max-width: 560px;
  color: #526660;
  font-size: 17px;
  line-height: 1.85;
}

:where(#symfiny-site) .sf-purpose-lead p {
  margin: 0 0 18px;
}

:where(#symfiny-site) .sf-purpose-reflection {
  display: grid;
  grid-template-columns: 1.12fr .88fr;
  gap: 70px;
  align-items: center;
  margin-bottom: 55px;
}

:where(#symfiny-site) .sf-purpose-reflection-image {
  position: relative;
}

:where(#symfiny-site) .sf-purpose-reflection-image img {
  width: 100%;
  height: 560px;
  object-fit: cover;
  border-radius: 4px 90px 4px 90px;
}

:where(#symfiny-site) .sf-purpose-caption {
  position: absolute;
  left: 24px;
  bottom: 22px;
  max-width: 310px;
  padding: 15px 18px;
  color: var(--forest);
  background: rgba(250,249,245,.84);
  border: 1px solid rgba(16,47,43,.12);
  border-radius: 12px;
  backdrop-filter: blur(14px);
  font-family: var(--serif);
  font-size: 22px;
  line-height: 1.05;
}

:where(#symfiny-site) .sf-purpose-reflection-copy {
  color: #526660;
  font-size: 17px;
  line-height: 1.85;
}

:where(#symfiny-site) .sf-purpose-reflection-copy p {
  margin: 0 0 25px;
}

:where(#symfiny-site) .sf-purpose-gallery {
  display: grid;
  grid-template-columns: 1.05fr .8fr 1.05fr;
  grid-template-rows: 240px 260px;
  gap: 14px;
}

:where(#symfiny-site) .sf-purpose-photo {
  margin: 0;
  overflow: hidden;
  border-radius: 4px 35px 4px 35px;
}

:where(#symfiny-site) .sf-purpose-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .8s ease;
}

:where(#symfiny-site) .sf-purpose-photo:hover img {
  transform: scale(1.035);
}

:where(#symfiny-site) .sf-purpose-photo:nth-child(1) {
  grid-column: 1;
  grid-row: 1;
}

:where(#symfiny-site) .sf-purpose-photo:nth-child(2) {
  grid-column: 2;
  grid-row: 1 / span 2;
}

:where(#symfiny-site) .sf-purpose-photo:nth-child(3) {
  grid-column: 3;
  grid-row: 1;
}

:where(#symfiny-site) .sf-purpose-photo:nth-child(4) {
  grid-column: 1 / span 1;
  grid-row: 2;
}

:where(#symfiny-site) .sf-purpose-photo-wide {
  grid-column: 3 !important;
  grid-row: 2 !important;
}

:where(#symfiny-site) .sf-guiding {
  padding: 115px 0;
  background: var(--forest);
  color: var(--white);
}

:where(#symfiny-site) .sf-guiding-inner {
  max-width: 980px;
  margin: auto;
  text-align: center;
}

:where(#symfiny-site) .sf-guiding .sf-eyebrow {
  color: var(--gold);
}

:where(#symfiny-site) .sf-guiding h2 {
  margin: 0;
  color: var(--white);
  font-family: var(--serif);
  font-size: clamp(58px,8vw,112px);
  font-weight: 500;
  line-height: .82;
  letter-spacing: -.035em;
}

:where(#symfiny-site) .sf-guiding h2 em {
  color: var(--aqua);
  font-style: italic;
}

:where(#symfiny-site) .sf-guiding p:last-child {
  max-width: 560px;
  margin: 32px auto 0;
  color: rgba(250,249,245,.70);
  font-size: 15px;
  line-height: 1.8;
}

:where(#symfiny-site) .sf-bros-new {
  padding: 120px 0 125px;
  min-height: 0;
  background: var(--teal);
}

:where(#symfiny-site) .sf-bros-head {
  max-width: 850px;
  margin: 0 auto 60px;
  text-align: center;
  position: relative;
  z-index: 2;
}

:where(#symfiny-site) .sf-bros-head .sf-title {
  font-size: clamp(48px,6vw,82px);
}

:where(#symfiny-site) .sf-bros-head .sf-title em {
  color: var(--aqua);
  font-style: italic;
}

:where(#symfiny-site) .sf-bros-subline {
  margin: 22px auto 0;
  color: rgba(250,249,245,.66);
  font-size: 15px;
}

:where(#symfiny-site) .sf-bros-lines {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 10px;
  margin: 22px auto 0;
  max-width: 900px;
}

:where(#symfiny-site) .sf-bros-lines span {
  padding: 8px 12px;
  color: rgba(250,249,245,.70);
  border: 1px solid rgba(250,249,245,.13);
  border-radius: 999px;
  font-size: 10px;
  letter-spacing: .06em;
  background: rgba(250,249,245,.035);
  backdrop-filter: blur(8px);
}

:where(#symfiny-site) .sf-bros-stage {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 70px;
  align-items: center;
  position: relative;
  z-index: 2;
}

:where(#symfiny-site) .sf-bros-art {
  position: relative;
  min-height: 560px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

:where(#symfiny-site) .sf-bros-art::before {
  content: "";
  position: absolute;
  inset: 7% 4% 0;
  border: 1px solid rgba(250,249,245,.11);
  border-radius: 40px;
  background: radial-gradient(circle at 50% 35%,rgba(141,185,180,.11),transparent 55%);
}

:where(#symfiny-site) .sf-bros-art img {
  position: relative;
  z-index: 2;
  width: min(100%,620px);
  height: auto;
  max-height: 590px;
  object-fit: contain;
  object-position: center bottom;
  filter: drop-shadow(0 30px 45px rgba(0,0,0,.18));
}

:where(#symfiny-site) .sf-bros-overlay-note {
  position: absolute;
  z-index: 4;
  max-width: 210px;
  padding: 13px 16px;
  color: var(--forest);
  background: var(--cream);
  border-radius: 7px 18px 7px 18px;
  box-shadow: 0 16px 40px rgba(0,0,0,.18);
  font-family: var(--serif);
  font-size: 20px;
  line-height: 1.05;
}

:where(#symfiny-site) .sf-bros-overlay-note.note-a {
  left: 0;
  top: 15%;
  transform: rotate(-3deg);
}

:where(#symfiny-site) .sf-bros-overlay-note.note-b {
  right: 0;
  top: 34%;
  transform: rotate(3deg);
}

:where(#symfiny-site) .sf-bros-overlay-note.note-c {
  left: 9%;
  bottom: 5%;
  max-width: 245px;
  transform: rotate(-2deg);
}

:where(#symfiny-site) .sf-bros-speech {
  position: relative;
}

:where(#symfiny-site) .sf-speech-label {
  display: block;
  margin: 0 0 12px;
  color: var(--aqua);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
}

:where(#symfiny-site) .sf-speech-bubble {
  position: relative;
  padding: 38px 42px;
  background: var(--cream);
  color: var(--forest);
  border-radius: 34px;
  box-shadow: 0 25px 65px rgba(0,0,0,.18);
}

:where(#symfiny-site) .sf-speech-bubble::before {
  content: "";
  position: absolute;
  left: -24px;
  top: 58px;
  width: 45px;
  height: 45px;
  background: var(--cream);
  clip-path: polygon(100% 0,100% 100%,0 45%);
}

:where(#symfiny-site) .sf-speech-bubble p {
  margin: 0 0 19px;
  font-size: 15px;
  line-height: 1.72;
}

:where(#symfiny-site) .sf-speech-bubble strong {
  display: block;
  margin-top: 8px;
  font-family: var(--serif);
  font-size: 31px;
  font-weight: 500;
  line-height: 1;
}

:where(#symfiny-site) .sf-speech-bubble em {
  display: block;
  margin-top: 8px;
  color: var(--gold);
  font-family: var(--serif);
  font-size: 22px;
}

:where(#symfiny-site) .sf-bros-speech .sf-btn {
  margin-top: 22px;
}

:where(#symfiny-site) .sf-latest {
  background: var(--white);
}

:where(#symfiny-site) .sf-latest-head {
  display: grid;
  grid-template-columns: 1fr .8fr;
  gap: 80px;
  align-items: end;
  margin-bottom: 55px;
}

:where(#symfiny-site) .sf-latest-head > p {
  margin: 0;
  color: #5b6d67;
  font-size: 15px;
  line-height: 1.8;
  max-width: 500px;
}

:where(#symfiny-site) .sf-latest .sf-title em {
  color: var(--teal);
  font-style: italic;
}

:where(#symfiny-site) .sf-news-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 14px;
}

:where(#symfiny-site) .sf-news-item {
  min-height: 275px;
  padding: 30px;
  background: var(--cream);
  border: 1px solid rgba(16,47,43,.09);
  border-radius: 5px 34px 5px 34px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

:where(#symfiny-site) .sf-news-item > span:first-child {
  color: var(--gold);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .15em;
}

:where(#symfiny-site) .sf-news-item h3 {
  margin: 8px 0 8px;
  color: var(--forest);
  font-family: var(--serif);
  font-size: 32px;
  font-weight: 500;
  line-height: 1;
}

:where(#symfiny-site) .sf-news-item p {
  margin: 0;
  color: #5a6b66;
  font-size: 13px;
  line-height: 1.65;
}

:where(#symfiny-site) .sf-news-link {
  display: block;
  margin-top: 20px;
  color: var(--teal);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

:where(#symfiny-site) .sf-journey {
  min-height: 700px;
}

:where(#symfiny-site) .sf-journey .sf-title {
  max-width: 900px;
  margin: auto;
  font-size: clamp(52px,7vw,92px);
}

:where(#symfiny-site) .sf-journey-edu {
  max-width: 560px;
  margin: 35px auto 0;
  padding: 22px 25px;
  border: 1px solid rgba(250,249,245,.18);
  border-radius: 20px;
  background: rgba(16,47,43,.28);
  backdrop-filter: blur(12px);
}

:where(#symfiny-site) .sf-journey-edu span {
  display: block;
  color: var(--gold);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}

:where(#symfiny-site) .sf-journey-edu strong {
  display: block;
  margin-top: 7px;
  color: var(--white);
  font-family: var(--serif);
  font-size: 27px;
  font-weight: 500;
}

:where(#symfiny-site) .sf-journey-edu p {
  margin: 8px 0 0;
  color: rgba(250,249,245,.70);
  font-size: 13px;
  line-height: 1.7;
}

:where(#symfiny-site) .sf-connect {
  background: var(--cream);
}

:where(#symfiny-site) .sf-connect .sf-title em {
  color: var(--teal);
  font-style: italic;
}

:where(#symfiny-site) .sf-final-contact {
  display: flex;
  justify-content: center;
  gap: 12px;
  align-items: center;
  margin-top: 28px;
  flex-wrap: wrap;
}

:where(#symfiny-site) .sf-final-contact a {
  color: var(--forest);
  font-size: 14px;
  border-bottom: 1px solid rgba(16,47,43,.22);
  padding-bottom: 3px;
}

:where(#symfiny-site) .sf-footer-minimal {
  display: flex;
  justify-content: space-between;
  gap: 40px;
  align-items: center;
  padding-bottom: 40px;
  border-bottom: 1px solid rgba(250,249,245,.13);
}

:where(#symfiny-site) .sf-footer-minimal p {
  margin: 12px 0 0;
  max-width: none;
  font-family: var(--serif);
  font-size: 18px;
  color: rgba(250,249,245,.74);
}

:where(#symfiny-site) .sf-footer-contact {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

:where(#symfiny-site) .sf-footer-contact a {
  color: rgba(250,249,245,.72);
  font-size: 12px;
}


/* ---- 19. RESPONSIVE ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â TABLET ---- */

@media (max-width:1000px) {
  :where(#symfiny-site) .sf-menu {
    gap: 18px;
  }
  :where(#symfiny-site) .sf-menu a {
    font-size: 10px;
  }
  :where(#symfiny-site) .sf-intro-grid,
  :where(#symfiny-site) .sf-jal-inner,
  :where(#symfiny-site) .sf-story-grid,
  :where(#symfiny-site) .sf-bros-inner {
    grid-template-columns: 1fr 1fr;
    gap: 45px;
  }
  :where(#symfiny-site) .sf-cards {
    grid-template-columns: repeat(2,1fr);
  }
  :where(#symfiny-site) .sf-card {
    min-height: 420px;
  }
}


/* ---- 20. RESPONSIVE ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â MOBILE ---- */

@media (max-width:760px) {
  #symfiny-site .sf-bros-head {
    padding: 19px 17px 21px;
    border-radius: 22px 6px 22px 6px;
  }
  #symfiny-site .sf-bros-head .sf-title {
    font-size: clamp(42px,12vw,62px);
  }
  #symfiny-site .sf-jal-video-bg .sf-jal-bg-video {
    opacity: .09;
  }
  :where(#symfiny-site) .sf-wrap {
    width: min(calc(100% - 32px),var(--max));
  }
  :where(#symfiny-site) .sf-section {
    padding: 78px 0;
  }
  :where(#symfiny-site) .sf-nav {
    width: calc(100% - 30px);
  }
  :where(#symfiny-site) .sf-logo {
    width: 110px;
  }
  :where(#symfiny-site) .sf-menu {
    position: fixed;
    top: 68px;
    left: 15px;
    right: 15px;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 10px;
    border: 1px solid rgba(250,249,245,.13);
    border-radius: 20px;
    background: rgba(16,47,43,.96);
    backdrop-filter: blur(20px);
  }
  :where(#symfiny-site) .sf-menu.sf-open {
    display: flex;
  }
  :where(#symfiny-site) .sf-menu a {
    padding: 14px 15px;
  }
  :where(#symfiny-site) .sf-menu a::after {
    display: none;
  }
  :where(#symfiny-site) .sf-enquire {
    display: none;
  }
  :where(#symfiny-site) .sf-mobile-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  :where(#symfiny-site) .sf-hero {
    min-height: 86vh;
    min-height: 86svh;
  }
  :where(#symfiny-site) .sf-hero-inner {
    width: calc(100% - 30px);
    padding-top: 70px;
  }
  :where(#symfiny-site) .sf-hero h1 {
    font-size: clamp(55px,17vw,78px);
    line-height: .88;
  }
  :where(#symfiny-site) .sf-hero-kicker {
    font-size: 9px;
    line-height: 1.5;
  }
  :where(#symfiny-site) .sf-hero-sub {
    margin-top: 23px;
    font-size: 14px;
    line-height: 1.65;
  }
  :where(#symfiny-site) .sf-hero-actions {
    margin-top: 27px;
  }
  :where(#symfiny-site) .sf-btn {
    width: 100%;
    max-width: 290px;
    min-height: 48px;
  }
  :where(#symfiny-site) .sf-sound {
    left: 12px;
    bottom: 12px;
    min-height: 38px;
    padding: 0 12px;
    font-size: 9px;
  }
  :where(#symfiny-site) .sf-intro-grid,
  :where(#symfiny-site) .sf-jal-inner,
  :where(#symfiny-site) .sf-story-grid,
  :where(#symfiny-site) .sf-bros-inner {
    display: flex;
    flex-direction: column;
    gap: 38px;
  }
  :where(#symfiny-site) .sf-intro-image {
    width: 100%;
  }
  :where(#symfiny-site) .sf-intro-image img {
    height: 420px;
    border-radius: 4px 55px 4px 55px;
  }
  :where(#symfiny-site) .sf-image-note {
    right: 8px;
    bottom: 12px;
    max-width: 190px;
    padding: 15px;
  }
  :where(#symfiny-site) .sf-title {
    font-size: clamp(40px,12vw,58px);
  }
  :where(#symfiny-site) .sf-copy {
    font-size: 15px;
    line-height: 1.75;
  }
  :where(#symfiny-site) .sf-triad {
    padding: 35px 0;
  }
  :where(#symfiny-site) .sf-triad-grid {
    grid-template-columns: 1fr;
  }
  :where(#symfiny-site) .sf-triad-item {
    padding: 27px 20px;
  }
  :where(#symfiny-site) .sf-jal-copy {
    order: 1;
  }
  :where(#symfiny-site) .sf-jal-image {
    order: 2;
    width: 100%;
  }
  :where(#symfiny-site) .sf-jal-image img {
    width: 100%;
    height: 430px;
    border-radius: 55px 4px 55px 4px;
  }
  :where(#symfiny-site) .sf-bros {
    min-height: auto;
    padding: 80px 0;
  }
  :where(#symfiny-site) .sf-bros-photo img {
    height: 470px;
    border-radius: 4px 60px 4px 60px;
  }
  :where(#symfiny-site) .sf-bros-note {
    font-size: 18px;
  }
  :where(#symfiny-site) .sf-bros-note.one {
    left: -4px;
    top: 30px;
  }
  :where(#symfiny-site) .sf-bros-note.two {
    right: -4px;
    bottom: 25px;
  }
  :where(#symfiny-site) .sf-family {
    width: 100%;
  }
  :where(#symfiny-site) .sf-family img {
    width: 100%;
    height: 500px;
    border-radius: 55px 4px 55px 4px;
  }
  :where(#symfiny-site) .sf-story-quote {
    font-size: 26px;
  }
  :where(#symfiny-site) .sf-cards {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  :where(#symfiny-site) .sf-card {
    min-height: 440px;
  }
  :where(#symfiny-site) .sf-waterkeeper {
    min-height: 530px;
  }
  :where(#symfiny-site) .sf-waterkeeper-inner {
    width: calc(100% - 30px);
  }
  :where(#symfiny-site) .sf-final {
    padding: 90px 0;
  }
  :where(#symfiny-site) .sf-footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 35px;
  }
  :where(#symfiny-site) .sf-footer-grid > div:first-child {
    grid-column: 1 / -1;
  }
  :where(#symfiny-site) .sf-footer-bottom {
    flex-direction: column;
    gap: 6px;
  }
}


/* ---- 20B. HOMEPAGE REFINEMENT ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â MOBILE ---- */

@media (max-width:760px) {
  :where(#symfiny-site) .sf-purpose {
    padding-top: 92px;
  }
  :where(#symfiny-site) .sf-purpose-intro,
  :where(#symfiny-site) .sf-purpose-reflection,
  :where(#symfiny-site) .sf-latest-head {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  :where(#symfiny-site) .sf-purpose-lead,
  :where(#symfiny-site) .sf-purpose-reflection-copy,
  :where(#symfiny-site) .sf-latest-head > p {
    font-size: 15px;
  }
  :where(#symfiny-site) .sf-purpose-reflection {
    margin-bottom: 30px;
  }
  :where(#symfiny-site) .sf-purpose-reflection-image img {
    height: 380px;
    border-radius: 4px 55px 4px 55px;
  }
  :where(#symfiny-site) .sf-purpose-caption {
    left: 12px;
    bottom: 12px;
    max-width: 240px;
    font-size: 18px;
    padding: 12px 14px;
  }
  :where(#symfiny-site) .sf-purpose-gallery {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 190px 190px;
    gap: 10px;
  }
  :where(#symfiny-site) .sf-purpose-photo:nth-child(1),
  :where(#symfiny-site) .sf-purpose-photo:nth-child(2),
  :where(#symfiny-site) .sf-purpose-photo:nth-child(3),
  :where(#symfiny-site) .sf-purpose-photo:nth-child(4),
  :where(#symfiny-site) .sf-purpose-photo-wide {
    grid-column: auto !important;
    grid-row: auto !important;
  }
  :where(#symfiny-site) .sf-purpose-photo:nth-child(2) {
    grid-row: span 2 !important;
  }
  :where(#symfiny-site) .sf-guiding {
    padding: 85px 0;
  }
  :where(#symfiny-site) .sf-guiding h2 {
    font-size: clamp(54px,15vw,76px);
  }
  :where(#symfiny-site) .sf-bros-new {
    padding: 85px 0 90px;
  }
  :where(#symfiny-site) .sf-bros-stage {
    grid-template-columns: 1fr;
    gap: 35px;
  }
  :where(#symfiny-site) .sf-bros-lines {
    gap: 6px;
    margin-top: 18px;
  }
  :where(#symfiny-site) .sf-bros-lines span {
    font-size: 9px;
    padding: 7px 10px;
  }
  :where(#symfiny-site) .sf-bros-art {
    min-height: 400px;
  }
  :where(#symfiny-site) .sf-bros-art img {
    width: 100%;
    max-height: 440px;
  }
  :where(#symfiny-site) .sf-bros-overlay-note {
    max-width: 155px;
    font-size: 16px;
    padding: 10px 12px;
  }
  :where(#symfiny-site) .sf-bros-overlay-note.note-a {
    left: -2px;
    top: 6%;
  }
  :where(#symfiny-site) .sf-bros-overlay-note.note-b {
    right: -2px;
    top: 28%;
  }
  :where(#symfiny-site) .sf-bros-overlay-note.note-c {
    left: 5%;
    bottom: 3%;
    max-width: 190px;
  }
  :where(#symfiny-site) .sf-speech-bubble {
    padding: 27px 23px;
    border-radius: 26px;
  }
  :where(#symfiny-site) .sf-speech-bubble::before {
    left: 25px;
    top: -25px;
    transform: rotate(90deg);
  }
  :where(#symfiny-site) .sf-speech-bubble p {
    font-size: 14px;
    line-height: 1.7;
  }
  :where(#symfiny-site) .sf-speech-bubble strong {
    font-size: 27px;
  }
  :where(#symfiny-site) .sf-latest {
    padding-top: 80px;
  }
  :where(#symfiny-site) .sf-news-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  :where(#symfiny-site) .sf-news-item {
    min-height: 225px;
    padding: 25px;
  }
  :where(#symfiny-site) .sf-journey {
    min-height: 640px;
  }
  :where(#symfiny-site) .sf-journey-edu {
    padding: 18px 19px;
  }
  :where(#symfiny-site) .sf-footer-minimal {
    align-items: flex-start;
    flex-direction: column;
    gap: 25px;
  }
  :where(#symfiny-site) .sf-footer-contact {
    justify-content: flex-start;
    gap: 12px;
    flex-direction: column;
  }
  :where(#symfiny-site) .sf-menu a {
    font-size: 10px;
  }
}


/* ---- 21. VERY SMALL PHONES ---- */

@media (max-width:390px) {
  :where(#symfiny-site) .sf-hero h1 {
    font-size: 53px;
  }
  :where(#symfiny-site) .sf-intro-image img,
  :where(#symfiny-site) .sf-jal-image img,
  :where(#symfiny-site) .sf-family img {
    height: 390px;
  }
  :where(#symfiny-site) .sf-card {
    min-height: 410px;
  }
}


/* ---- 22. REDUCED MOTION ---- */

@media (prefers-reduced-motion:reduce) {
  #symfiny-site *,
  #symfiny-site *::before,
  #symfiny-site *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
  :where(#symfiny-site) .sf-reveal {
    opacity: 1;
    transform: none;
  }
}


/* ---- SYMFINY PREMIUM GLASS / EDITORIAL FINISH ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â V3 ---- */

#symfiny-site {
  --glass-light: rgba(250,249,245,.62);
  --glass-dark: rgba(10,38,34,.54);
  --glass-border: rgba(250,249,245,.18);
  --glass-shadow: 0 28px 80px rgba(8,29,26,.14);
}

#symfiny-site .sf-section {
  isolation: isolate;
}

#symfiny-site .sf-eyebrow {
  text-shadow: 0 1px 12px rgba(185,154,99,.12);
}

#symfiny-site .sf-purpose {
  position: relative;
}

#symfiny-site .sf-purpose::before {
  content: "";
  position: absolute;
  width: 420px;
  height: 420px;
  left: -190px;
  top: 15%;
  border-radius: 50%;
  background: rgba(141,185,180,.08);
  filter: blur(5px);
  pointer-events: none;
}

#symfiny-site .sf-purpose-intro {
  grid-template-columns: .92fr 1.08fr;
  gap: 110px;
  align-items: end;
}

#symfiny-site .sf-purpose-lead {
  max-width: 620px;
  color: #465b55;
}

#symfiny-site .sf-purpose-feature {
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  align-items: center;
  position: relative;
}

#symfiny-site .sf-purpose-feature-media {
  position: relative;
}

#symfiny-site .sf-purpose-main-media {
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  border-radius: 8px 96px 8px 96px;
  border: 1px solid rgba(250,249,245,.65);
  background: #dfe8e3;
}

#symfiny-site .sf-purpose-main-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,rgba(16,47,43,.02),rgba(16,47,43,.18));
  pointer-events: none;
}

#symfiny-site .sf-purpose-main-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1s cubic-bezier(.2,.65,.25,1);
}

#symfiny-site .sf-purpose-feature:hover .sf-purpose-main-media img {
  transform: scale(1.025);
}

#symfiny-site .sf-media-index {
  position: absolute;
  top: 20px;
  left: 22px;
  z-index: 2;
  padding: 8px 11px;
  border: 1px solid rgba(250,249,245,.38);
  border-radius: 999px;
  color: var(--white);
  background: rgba(16,47,43,.28);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .16em;
}

#symfiny-site .sf-purpose-feature-copy-wrap {
  display: flex;
  flex-direction: column;
}

#symfiny-site .sf-purpose-secondary-media {
  position: relative;
  margin-left: auto;
  overflow: hidden;
}

#symfiny-site .sf-purpose-secondary-media img {
  width: 100%;
  height: 100%;
  transition: transform 1s cubic-bezier(.2,.65,.25,1);
}

#symfiny-site .sf-purpose-secondary-media:hover img {
  transform: scale(1.035);
}

#symfiny-site .sf-purpose-secondary-media span {
  position: absolute;
  color: var(--white);
  font-family: var(--serif);
  text-shadow: 0 2px 16px rgba(0,0,0,.45);
}

#symfiny-site .sf-purpose-feature-copy {
  max-width: 590px;
  padding: 42px 44px;
}

#symfiny-site .sf-glass-kicker {
  margin-bottom: 25px;
  color: var(--gold);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
}

#symfiny-site .sf-purpose-feature-copy p {
  margin: 0 0 21px;
  font-size: 16px;
  line-height: 1.82;
}

#symfiny-site .sf-purpose-signature {
  margin-top: 28px;
  padding-top: 22px;
  border-top: 1px solid rgba(16,47,43,.13);
  font-family: var(--serif);
  font-size: 25px;
  line-height: 1.15;
}

#symfiny-site .sf-guiding-premium {
  padding: 125px 0 135px;
  overflow: hidden;
}

#symfiny-site .sf-guiding-premium::before {
  content: "";
  position: absolute;
  width: 700px;
  height: 700px;
  right: -330px;
  top: -220px;
  border: 1px solid rgba(141,185,180,.10);
  border-radius: 50%;
  box-shadow: 0 0 0 70px rgba(141,185,180,.025),0 0 0 140px rgba(141,185,180,.018);
}

#symfiny-site .sf-guiding-intro {
  max-width: 880px;
  margin: 0 auto 70px;
  text-align: center;
}

#symfiny-site .sf-guiding-intro h2 {
  margin: 0;
  color: var(--white);
  font-family: var(--serif);
  font-weight: 500;
  line-height: .86;
  letter-spacing: -.035em;
}

#symfiny-site .sf-guiding-intro h2 em {
  color: var(--aqua);
  font-style: italic;
}

#symfiny-site .sf-guiding-intro > p:last-child {
  max-width: 590px;
  margin: 28px auto 0;
  color: rgba(250,249,245,.62);
  font-size: 14px;
  line-height: 1.8;
}

#symfiny-site .sf-principle-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  position: relative;
}

#symfiny-site .sf-principle-card {
  position: relative;
}

#symfiny-site .sf-principle-media {
  position: relative;
  height: 390px;
  overflow: hidden;
}

#symfiny-site .sf-principle-media img,
#symfiny-site .sf-principle-media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1s cubic-bezier(.2,.65,.25,1);
}

#symfiny-site .sf-principle-card:hover .sf-principle-media img,
#symfiny-site .sf-principle-card:hover .sf-principle-media video {
  transform: scale(1.035);
}

#symfiny-site .sf-principle-media::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

#symfiny-site .sf-principle-media > span {
  position: absolute;
  top: 15px;
  right: 15px;
  z-index: 2;
  width: 35px;
  height: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(250,249,245,.25);
  border-radius: 50%;
  color: var(--white);
  background: rgba(16,47,43,.35);
  backdrop-filter: blur(10px);
  font-size: 9px;
  font-weight: 700;
}

#symfiny-site .sf-principle-copy p {
  margin: 0;
  font-family: var(--serif);
  line-height: 1;
}

#symfiny-site .sf-principle-copy span {
  display: block;
  margin-top: 7px;
  font-size: 10px;
}

#symfiny-site .sf-bros-premium {
  position: relative;
}

#symfiny-site .sf-bros-bg {
  position: absolute;
  inset: 0;
  background-image: url("https://www.symfinyaquafarm.com/wp-content/uploads/2026/09/ChatGPT-Image-Sep-13-2026-at-01_08_15-AM.png");
  background-size: cover;
}

#symfiny-site .sf-bros-wash {
  position: absolute;
  inset: 0;
}

#symfiny-site .sf-bros-stage {
  grid-template-columns: 1.05fr .95fr;
  gap: 80px;
}

#symfiny-site .sf-bros-art-glass {
  position: absolute;
  inset: 4% 0 0;
  border: 1px solid rgba(250,249,245,.13);
  border-radius: 42px 8px 42px 8px;
  background: linear-gradient(145deg,rgba(250,249,245,.08),rgba(250,249,245,.015));
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

#symfiny-site .sf-bros-overlay-note {
  z-index: 5;
  max-width: 205px;
  padding: 14px 16px;
  border-radius: 7px 19px 7px 19px;
}

#symfiny-site .sf-bros-overlay-note.note-c {
  max-width: 245px;
}

#symfiny-site .sf-speech-bubble {
  padding: 40px 42px;
  border-radius: 34px 8px 34px 8px;
}

#symfiny-site .sf-news-glass {
  position: relative;
  overflow: hidden;
}

#symfiny-site .sf-news-glass::before {
  content: "";
  position: absolute;
  width: 180px;
  height: 180px;
  right: -75px;
  top: -75px;
  border: 1px solid rgba(23,76,69,.10);
  border-radius: 50%;
}

#symfiny-site .sf-news-glass:hover {
  border-color: rgba(23,76,69,.18);
}

#symfiny-site .sf-news-link {
  width: max-content;
  padding-bottom: 4px;
  border-bottom: 1px solid rgba(23,76,69,.22);
}

#symfiny-site .sf-edu-button {
  display: block;
  cursor: pointer;
  transition: transform .35s ease,border-color .35s ease,background .35s ease,box-shadow .35s ease;
}

#symfiny-site .sf-edu-button b {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-top: 18px;
  color: var(--white);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
}

#symfiny-site .sf-edu-button b i {
  color: var(--gold);
  font-style: normal;
  font-size: 15px;
}

#symfiny-site .sf-edu-button:hover {
  transform: translateY(-3px);
  border-color: rgba(250,249,245,.34);
  background: rgba(16,47,43,.43);
  box-shadow: 0 22px 55px rgba(0,0,0,.18);
}

#symfiny-site .sf-final-contact a {
  padding: 11px 16px;
  border: 1px solid rgba(16,47,43,.13);
  border-radius: 999px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

@media (max-width:1000px) {
  #symfiny-site .sf-purpose-intro {
    gap: 50px;
  }
  #symfiny-site .sf-purpose-feature {
    gap: 45px;
  }
  #symfiny-site .sf-principle-media {
    height: 330px;
  }
  #symfiny-site .sf-bros-stage {
    gap: 45px;
  }
}

@media (max-width:760px) {
  #symfiny-site .sf-purpose-intro {
    display: grid;
    grid-template-columns: 1fr;
    gap: 25px;
    margin-bottom: 48px;
  }
  #symfiny-site .sf-purpose-feature {
    display: flex;
    flex-direction: column;
    gap: 35px;
    align-items: stretch;
  }
  #symfiny-site .sf-purpose-main-media {
    border-radius: 6px 58px 6px 58px;
  }
  #symfiny-site .sf-purpose-signature {
    font-size: 22px;
  }
  #symfiny-site .sf-guiding-intro {
    margin-bottom: 45px;
  }
  #symfiny-site .sf-principle-grid {
    grid-template-columns: 1fr;
  }
  #symfiny-site .sf-principle-card {
    padding: 8px;
  }
  #symfiny-site .sf-bros-stage {
    grid-template-columns: 1fr;
    gap: 38px;
  }
  #symfiny-site .sf-bros-art-glass {
    inset: 3% 0 0;
  }
  #symfiny-site .sf-speech-bubble {
    padding: 28px 23px;
    border-radius: 27px 7px 27px 7px;
  }
  #symfiny-site .sf-speech-bubble::before {
    left: 25px;
    top: -24px;
    transform: rotate(90deg);
  }
  #symfiny-site .sf-edu-button {
    padding: 18px 19px;
  }
}


/* ---- V4 POLISH ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â clearer Water Bros composition + calmer luxury glass ---- */

#symfiny-site .sf-purpose,
#symfiny-site .sf-latest,
#symfiny-site .sf-explore {
  background: radial-gradient(circle at 12% 12%, rgba(141,185,180,.10), transparent 28%), radial-gradient(circle at 88% 70%, rgba(95,143,130,.07), transparent 30%), #edf2ee;
}

#symfiny-site .sf-purpose-feature-copy,
#symfiny-site .sf-news-item,
#symfiny-site .sf-final-contact a {
  background: rgba(250,249,245,.58);
  border-color: rgba(16,47,43,.11);
  box-shadow: 0 24px 70px rgba(16,47,43,.08), inset 0 1px 0 rgba(255,255,255,.55);
  backdrop-filter: blur(22px) saturate(125%);
  -webkit-backdrop-filter: blur(22px) saturate(125%);
}

#symfiny-site .sf-purpose-feature-media {
  min-height: 690px;
  padding-bottom: 28px;
}

#symfiny-site .sf-purpose-main-media {
  width: 84%;
  height: 600px;
  z-index: 1;
}

#symfiny-site .sf-purpose-secondary-media {
  z-index: 3;
}

#symfiny-site .sf-purpose-secondary-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,rgba(16,47,43,0),rgba(16,47,43,.10));
  pointer-events: none;
}

#symfiny-site .sf-purpose-secondary-media span {
  z-index: 2;
  left: 17px;
  bottom: 14px;
  font-size: 18px;
}

#symfiny-site .sf-bros-premium {
  min-height: 820px;
  overflow: hidden;
}

#symfiny-site .sf-bros-bg {
  opacity: .94;
  background-position: center center;
}

#symfiny-site .sf-bros-stage {
  display: block;
  min-height: 610px;
  position: relative;
}

#symfiny-site .sf-bros-art {
  position: absolute;
  left: 0;
  bottom: -12px;
  width: 66%;
  min-height: 0;
  height: 570px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  z-index: 3;
}

#symfiny-site .sf-bros-art-glass {
  display: none;
}

#symfiny-site .sf-bros-art img {
  width: min(100%,660px);
  height: auto;
  max-height: 570px;
  object-fit: contain;
  object-position: center bottom;
  filter: drop-shadow(0 32px 48px rgba(0,0,0,.26));
}

#symfiny-site .sf-bros-speech {
  position: absolute;
  right: 0;
  top: 68px;
  width: min(430px,39%);
  z-index: 6;
}

#symfiny-site .sf-speech-bubble {
  border-color: rgba(250,249,245,.58);
}

#symfiny-site .sf-bros-overlay-note.note-a {
  left: 2%;
  top: 45%;
}

#symfiny-site .sf-bros-overlay-note.note-b {
  right: 7%;
  top: 20%;
}

#symfiny-site .sf-bros-overlay-note.note-c {
  left: 13%;
  bottom: 2%;
}

#symfiny-site .sf-jal-video-bg {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

#symfiny-site .sf-jal-video-bg .sf-jal-bg-video {
  position: absolute;
  inset: 0;
  z-index: -2;
  overflow: hidden;
  opacity: .13;
}

#symfiny-site .sf-jal-video-bg .sf-jal-bg-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(.8) contrast(.95);
  transform: scale(1.04);
}

#symfiny-site .sf-jal-video-bg .sf-jal-bg-wash {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg,rgba(237,242,238,.96) 0%,rgba(237,242,238,.82) 52%,rgba(237,242,238,.92) 100%);
}

#symfiny-site .sf-bros-head {
  width: min(920px,100%);
  padding: 24px 30px 27px;
  border: 1px solid rgba(250,249,245,.22);
  border-radius: 28px 7px 28px 7px;
  backdrop-filter: blur(16px) saturate(115%);
  -webkit-backdrop-filter: blur(16px) saturate(115%);
}

#symfiny-site .sf-bros-head .sf-eyebrow {
  color: #d9ece7;
  text-shadow: 0 2px 18px rgba(0,0,0,.45);
}

#symfiny-site .sf-bros-head .sf-title {
  color: #fbfaf4;
  text-shadow: 0 3px 28px rgba(0,0,0,.58);
}

#symfiny-site .sf-bros-head .sf-title em {
  color: #a9d3ca;
}

#symfiny-site .sf-bros-subline {
  color: rgba(250,249,245,.82);
}

#symfiny-site .sf-bros-lines span {
  color: rgba(250,249,245,.84);
}

#symfiny-site .sf-bros-art {
  filter: drop-shadow(0 28px 48px rgba(0,0,0,.18));
}

#symfiny-site .sf-journey .sf-journey-edu,
#symfiny-site .sf-journey .sf-edu-button {
  box-shadow: 0 22px 60px rgba(16,47,43,.12), inset 0 1px 0 rgba(255,255,255,.55);
}

@media (max-width:760px) {
  #symfiny-site .sf-purpose-feature-media {
    min-height: 550px;
    padding-bottom: 22px;
  }
  #symfiny-site .sf-purpose-main-media {
    width: 92%;
    height: 430px;
  }
  #symfiny-site .sf-purpose-secondary-media {
    border-width: 5px;
  }
  #symfiny-site .sf-bros-premium {
    min-height: 0;
    padding: 82px 0 88px;
  }
  #symfiny-site .sf-bros-stage {
    display: block;
    min-height: 0;
    padding-top: 8px;
  }
  #symfiny-site .sf-bros-art {
    position: relative;
    left: auto;
    bottom: auto;
    width: 100%;
    height: 390px;
    min-height: 390px;
    margin-top: 25px;
    z-index: 3;
  }
  #symfiny-site .sf-bros-art img {
    width: 100%;
    max-height: 390px;
  }
  #symfiny-site .sf-bros-speech {
    position: relative;
    right: auto;
    top: auto;
    width: 100%;
    margin-top: -8px;
    z-index: 6;
  }
  #symfiny-site .sf-bros-overlay-note.note-a {
    top: 16%;
  }
  #symfiny-site .sf-bros-overlay-note.note-b {
    top: 8%;
  }
  #symfiny-site .sf-bros-overlay-note.note-c {
    bottom: 0;
  }
  #symfiny-site .sf-purpose-feature-copy-wrap {
    max-width: none;
    gap: 18px;
  }
  #symfiny-site .sf-purpose-secondary-media {
    height: 180px;
    margin: 0 0 0 auto;
    border-radius: 30px 8px 30px 8px;
  }
}


/* ---- WATER BROS ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â DIALOGUE LEGIBILITY ONLY ---- */

#symfiny-site .sf-bros-overlay-note {
  background: rgba(8,28,25,.97) !important;
  border: 1px solid rgba(244,241,232,.18) !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.07) !important;
  backdrop-filter: blur(16px) saturate(125%);
  -webkit-backdrop-filter: blur(16px) saturate(125%);
}

#symfiny-site .sf-speech-bubble {
  background: rgba(8,28,25,.98) !important;
  color: var(--white) !important;
  border: 1px solid rgba(244,241,232,.18) !important;
  backdrop-filter: blur(18px) saturate(125%);
  -webkit-backdrop-filter: blur(18px) saturate(125%);
}

#symfiny-site .sf-speech-bubble::before {
  background: rgba(8,28,25,.98) !important;
}


/* ---- V10 ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â DEEP FOREST / POND / MINERAL GLASS DIRECTION ---- */

#symfiny-site {
  --forest: #0b2521;
  --forest-2: #12352f;
  --pond: #1d4a40;
  --moss: #47685b;
  --mist: #dfe4d8;
  --cream: #eee9dc;
  --gold: #b99a63;
  --gold-soft: rgba(185,154,99,.34);
  --ink: #10251f;
}

#symfiny-site .sf-purpose,
#symfiny-site .sf-journey,
#symfiny-site .sf-latest,
#symfiny-site .sf-explore {
  background: radial-gradient(circle at 78% 15%,rgba(185,154,99,.075),transparent 27%), linear-gradient(135deg,#e9e8dd 0%,#dfe5dc 48%,#d8e1da 100%) !important;
}

#symfiny-site .sf-purpose-feature-copy,
#symfiny-site .sf-journey-edu,
#symfiny-site .sf-card {
  background: rgba(247,244,235,.28) !important;
  border-color: rgba(185,154,99,.24) !important;
  box-shadow: 0 28px 80px rgba(11,37,33,.12),inset 0 1px 0 rgba(255,255,255,.42) !important;
  backdrop-filter: blur(24px) saturate(115%);
  -webkit-backdrop-filter: blur(24px) saturate(115%);
}

#symfiny-site .sf-title,
#symfiny-site .sf-purpose-feature-copy h2,
#symfiny-site .sf-card h3 {
  color: #102f2a;
}

#symfiny-site .sf-eyebrow,
#symfiny-site .sf-glass-kicker {
  color: #806a43;
}

#symfiny-site .sf-purpose-feature-copy-wrap {
  width: 100%;
  max-width: 590px;
  margin-left: auto;
  gap: 18px;
}

#symfiny-site .sf-purpose-secondary-media {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 7 !important;
  border-radius: 28px 7px 28px 7px !important;
  border: 1px solid rgba(185,154,99,.38) !important;
  box-shadow: 0 24px 60px rgba(11,37,33,.18) !important;
}

#symfiny-site .sf-purpose-secondary-media img {
  object-fit: cover !important;
  object-position: center 48% !important;
}

#symfiny-site .sf-guiding,
#symfiny-site .sf-bros-premium,
#symfiny-site .sf-final {
  background: radial-gradient(circle at 15% 20%,rgba(71,104,91,.28),transparent 32%), radial-gradient(circle at 85% 80%,rgba(185,154,99,.055),transparent 28%), linear-gradient(145deg,#081e1b 0%,#0d2b25 52%,#071916 100%) !important;
}

#symfiny-site .sf-principle-card,
#symfiny-site .sf-bros-speech,
#symfiny-site .sf-bros-overlay-note {
  background: rgba(8,30,27,.46) !important;
  border-color: rgba(238,233,220,.16) !important;
  box-shadow: 0 28px 75px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.10) !important;
  backdrop-filter: blur(22px) saturate(125%);
  -webkit-backdrop-filter: blur(22px) saturate(125%);
}

:where(#symfiny-site) #sfHeader {
  opacity: 1;
  transform: translateY(0);
  transition: opacity .55s cubic-bezier(.22,.61,.36,1),transform .65s cubic-bezier(.22,.61,.36,1),background .4s ease,padding .4s ease;
}

:where(#symfiny-site) #sfHeader.sf-scrolled.sf-header-hide {
  opacity: 0;
  transform: translateY(-115%);
  pointer-events: none;
}

:where(#symfiny-site) #sfHeader.sf-scrolled.sf-header-hide:hover,
:where(#symfiny-site) #sfHeader.sf-scrolled:focus-within {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

:where(#symfiny-site) #sfHeader.sf-scrolled {
  background: rgba(8,30,27,.72) !important;
  border-bottom: 1px solid rgba(185,154,99,.16) !important;
  box-shadow: 0 12px 50px rgba(0,0,0,.12);
}

:where(#symfiny-site) #sfHeader .sf-enquire {
  border-color: rgba(185,154,99,.55);
  background: rgba(185,154,99,.08);
}

:where(#symfiny-site) #sfHeader .sf-enquire:hover {
  background: rgba(185,154,99,.16);
  border-color: rgba(185,154,99,.85);
}

@media (max-width:760px) {
  #symfiny-site .sf-purpose-secondary-media {
    aspect-ratio: 16 / 8 !important;
    width: 100% !important;
  }
}


/* ---- V14 ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â SYMFINY LUXURY EDITORIAL ---- */

#symfiny-site {
  --lux-ink: #091a17;
  --lux-deep: #061512;
  --lux-water: #0d2b25;
  --lux-water-2: #123b33;
  --lux-mineral: #e4e5dc;
  --lux-ivory: #eeeade;
  --lux-line: rgba(185,154,99,.28);
}


/* ---- GLOBAL FINISH ---- */

#symfiny-site {
  position: relative;
  background: var(--lux-mineral);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

#symfiny-site .sf-wrap {
  position: relative;
}

#symfiny-site ::selection {
  background: rgba(185,154,99,.78);
  color: #071815;
}

#symfiny-site .sf-purpose,
#symfiny-site .sf-jal,
#symfiny-site .sf-latest,
#symfiny-site .sf-explore,
#symfiny-site .sf-connect {
  position: relative;
}

#symfiny-site .sf-purpose::after,
#symfiny-site .sf-jal::after,
#symfiny-site .sf-latest::after,
#symfiny-site .sf-explore::after,
#symfiny-site .sf-connect::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: min(1240px,calc(100% - 48px));
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg,transparent,rgba(16,47,43,.12),rgba(185,154,99,.20),rgba(16,47,43,.12),transparent);
  pointer-events: none;
}


/* ---- TYPOGRAPHY ---- */

#symfiny-site .sf-eyebrow {
  letter-spacing: .27em;
  font-size: 10px;
  color: #806a43;
}

#symfiny-site .sf-title {
  letter-spacing: -.035em;
  line-height: .91;
}

#symfiny-site .sf-copy {
  color: #4c605a;
  font-size: 16px;
  line-height: 1.88;
}

#symfiny-site .sf-gold-line {
  width: 72px;
  margin-top: 28px;
  margin-bottom: 28px;
  background: linear-gradient(90deg,var(--gold),rgba(185,154,99,0));
}


/* ---- HERO ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â cinematic luxury ---- */

#symfiny-site .sf-hero {
  min-height: 96vh;
  min-height: 96svh;
  background: #061714;
}

#symfiny-site .sf-hero-video {
  transform: scale(1.045);
  filter: saturate(.88) contrast(1.05) brightness(.88);
  transition: filter 1.2s ease,transform 1.8s cubic-bezier(.2,.65,.25,1);
}

#symfiny-site .sf-hero-overlay {
  background: linear-gradient(180deg, rgba(3,18,16,.72) 0%, rgba(7,29,25,.20) 34%, rgba(4,20,17,.40) 62%, rgba(3,15,13,.82) 100%);
}

#symfiny-site .sf-hero-overlay::after {
  background: radial-gradient(ellipse at 50% 45%, transparent 12%, rgba(2,13,11,.22) 62%, rgba(1,10,8,.72) 100%);
}

#symfiny-site .sf-hero-inner {
  width: min(calc(100% - 40px),1040px);
}

#symfiny-site .sf-hero-kicker {
  color: rgba(244,241,232,.78);
  letter-spacing: .31em;
}

#symfiny-site .sf-hero h1 {
  font-size: clamp(64px,9.6vw,126px);
  line-height: .80;
  text-shadow: 0 12px 45px rgba(0,0,0,.42);
}

#symfiny-site .sf-hero-sub {
  max-width: 650px;
  color: rgba(250,249,245,.74);
  font-size: 15px;
  letter-spacing: .01em;
}

#symfiny-site .sf-hero-actions {
  margin-top: 39px;
}

#symfiny-site .sf-btn {
  min-height: 52px;
  padding: 0 27px;
  letter-spacing: .14em;
}

#symfiny-site .sf-btn-light {
  color: #102f2a !important;
  background: linear-gradient(135deg,#f5f1e7,#e5dfcf);
  border: 1px solid rgba(185,154,99,.62);
  box-shadow: 0 14px 35px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.8);
}

#symfiny-site .sf-btn-light:hover {
  background: #f7f3e9;
  box-shadow: 0 18px 45px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.9);
}

#symfiny-site .sf-btn-outline {
  background: rgba(6,25,22,.28);
  border-color: rgba(244,241,232,.45);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

#symfiny-site .sf-scroll {
  opacity: .65;
  letter-spacing: .32em;
}


/* ---- HEADER ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â jewellery-like details ---- */

#symfiny-site .sf-header .sf-nav {
  border-color: rgba(244,241,232,.13);
  box-shadow: 0 8px 35px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.07);
}

#symfiny-site .sf-menu a {
  letter-spacing: .105em;
}

#symfiny-site .sf-menu a::after {
  background: linear-gradient(90deg,transparent,var(--gold),transparent);
}

#symfiny-site .sf-enquire {
  border-color: rgba(185,154,99,.52);
  color: #f4f1e8 !important;
}


/* ---- PURPOSE ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â museum-like composition ---- */

#symfiny-site .sf-purpose-intro {
  margin-bottom: 84px;
}

#symfiny-site .sf-purpose-intro .sf-title {
  font-size: clamp(54px,6.5vw,92px);
}

#symfiny-site .sf-purpose-feature {
  gap: 96px;
}

#symfiny-site .sf-purpose-main-media {
  border-color: rgba(185,154,99,.34);
  box-shadow: 0 38px 90px rgba(8,31,27,.16),inset 0 1px 0 rgba(255,255,255,.6);
}

#symfiny-site .sf-purpose-main-media::before,
#symfiny-site .sf-purpose-secondary-media::before {
  content: "";
  position: absolute;
  inset: 10px;
  border: 1px solid rgba(244,241,232,.16);
  border-radius: inherit;
  z-index: 2;
  pointer-events: none;
}

#symfiny-site .sf-purpose-feature-copy {
  border-color: rgba(185,154,99,.25);
}

#symfiny-site .sf-purpose-signature {
  color: #173b34;
}


/* ---- GUIDING PRINCIPLES ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â private-gallery feel ---- */

#symfiny-site .sf-guiding-premium::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 1px;
  background: linear-gradient(90deg,transparent,rgba(185,154,99,.38),transparent);
}

#symfiny-site .sf-guiding-intro h2 {
  font-size: clamp(60px,7.5vw,108px);
  text-shadow: 0 14px 50px rgba(0,0,0,.28);
}

#symfiny-site .sf-principle-card {
  border-color: rgba(185,154,99,.18);
}

#symfiny-site .sf-principle-card::before {
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  top: 8px;
  height: 1px;
  background: linear-gradient(90deg,transparent,rgba(185,154,99,.52),transparent);
  opacity: .8;
  z-index: 3;
}

#symfiny-site .sf-principle-media::after {
  background: linear-gradient(180deg,transparent 35%,rgba(3,17,14,.68));
}

#symfiny-site .sf-principle-copy p {
  font-size: 33px;
}

#symfiny-site .sf-principle-copy span {
  letter-spacing: .12em;
}


/* ---- WATER PHILOSOPHY ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â quiet resort atmosphere ---- */

#symfiny-site .sf-jal-copy {
  padding: 10px 0;
}


/* ---- WATER BROS ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â luxury atmosphere only. ---- */

#symfiny-site .sf-bros-premium {
  background: radial-gradient(circle at 50% 0%,rgba(95,143,130,.16),transparent 32%), linear-gradient(145deg,#061714 0%,#0b2924 52%,#051411 100%) !important;
}

#symfiny-site .sf-bros-bg {
  filter: saturate(.82) contrast(1.04) brightness(.91);
}

#symfiny-site .sf-bros-wash {
  background: radial-gradient(circle at 28% 38%,rgba(141,185,180,.14),transparent 34%), linear-gradient(90deg,rgba(4,19,17,.88),rgba(8,34,29,.54) 48%,rgba(4,18,15,.90)) !important;
}

#symfiny-site .sf-bros-head {
  border-color: rgba(185,154,99,.24);
  background: linear-gradient(145deg,rgba(5,22,19,.82),rgba(8,35,30,.52));
  box-shadow: 0 30px 80px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.08);
}

#symfiny-site .sf-bros-lines span {
  border-color: rgba(185,154,99,.18);
  background: rgba(244,241,232,.035);
}

#symfiny-site .sf-bros-overlay-note,
#symfiny-site .sf-speech-bubble {
  background: rgba(8,28,25,.98) !important;
  border-color: rgba(244,241,232,.18) !important;
}

#symfiny-site .sf-speech-bubble {
  box-shadow: 0 35px 90px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.07) !important;
}


/* ---- LATEST ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â luxury editorial cards ---- */

#symfiny-site .sf-latest-head {
  margin-bottom: 62px;
}

#symfiny-site .sf-latest-head .sf-title {
  font-size: clamp(52px,6.4vw,88px);
}

#symfiny-site .sf-news-glass {
  padding: 34px;
  border-color: rgba(185,154,99,.24);
}

#symfiny-site .sf-news-glass::after {
  content: "";
  position: absolute;
  left: 24px;
  right: 24px;
  top: 0;
  height: 1px;
  background: linear-gradient(90deg,transparent,rgba(185,154,99,.48),transparent);
}

#symfiny-site .sf-news-glass h3 {
  font-size: 37px;
  line-height: .96;
}

#symfiny-site .sf-news-link {
  border-bottom-color: rgba(185,154,99,.32);
}


/* ---- JOURNEY ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â cinematic statement section ---- */

#symfiny-site .sf-journey {
  min-height: 760px;
  background: #061714 !important;
}

#symfiny-site .sf-waterkeeper video {
  opacity: .50;
  filter: saturate(.78) contrast(1.05) brightness(.80);
}

#symfiny-site .sf-waterkeeper::after {
  background: linear-gradient(90deg,rgba(3,17,15,.91),rgba(7,32,27,.46),rgba(3,17,15,.88)), radial-gradient(circle at 50% 50%,transparent,rgba(1,11,9,.30));
}

#symfiny-site .sf-waterkeeper-inner {
  max-width: 920px;
}

#symfiny-site .sf-waterkeeper .sf-eyebrow {
  color: #c5a96f;
}

#symfiny-site .sf-journey .sf-title {
  font-size: clamp(56px,7.4vw,100px);
  text-shadow: 0 14px 50px rgba(0,0,0,.34);
}

#symfiny-site .sf-waterkeeper-quote {
  font-size: 28px;
  color: #c5a96f;
}

#symfiny-site .sf-journey-edu {
  box-shadow: 0 30px 80px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.09) !important;
  backdrop-filter: blur(24px) saturate(120%);
  -webkit-backdrop-filter: blur(24px) saturate(120%);
}

#symfiny-site .sf-journey-edu strong {
  font-size: 30px;
}


/* ---- EXPLORE ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â art-directed tiles ---- */

#symfiny-site .sf-explore-head {
  margin-bottom: 62px;
}

#symfiny-site .sf-card {
  min-height: 455px;
}

#symfiny-site .sf-card-image::after {
  background: linear-gradient(180deg,rgba(4,20,17,.04) 15%,rgba(4,20,17,.88) 100%);
}

#symfiny-site .sf-card-content {
  padding: 31px 28px;
}

#symfiny-site .sf-card-number {
  color: #c5a96f;
  letter-spacing: .18em;
}

#symfiny-site .sf-card h3 {
  font-size: 34px;
  line-height: .94;
  text-shadow: 0 5px 22px rgba(0,0,0,.25);
}

#symfiny-site .sf-card-link {
  position: relative;
  padding-bottom: 5px;
  color: #eadfca !important;
  border-bottom: 1px solid rgba(185,154,99,.35);
  width: max-content;
}


/* ---- CONNECT ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â private-members-club ending ---- */

#symfiny-site .sf-connect {
  padding: 145px 0;
  color: var(--white);
}

#symfiny-site .sf-connect .sf-title {
  color: var(--white);
  font-size: clamp(56px,7vw,94px);
}

#symfiny-site .sf-connect .sf-title em {
  color: #a9d3ca;
}

#symfiny-site .sf-connect .sf-eyebrow {
  color: #c5a96f;
}

#symfiny-site .sf-connect .sf-final-inner > p:not(.sf-eyebrow) {
  max-width: 600px;
  margin: 28px auto 0;
  color: rgba(250,249,245,.68);
}

#symfiny-site .sf-final-contact span {
  color: rgba(185,154,99,.75);
}


/* ---- FOOTER ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â understated, expensive ---- */

#symfiny-site .sf-footer {
  padding-top: 72px;
}

#symfiny-site .sf-footer-minimal {
  border-bottom-color: rgba(185,154,99,.18);
}

#symfiny-site .sf-footer-minimal p {
  color: rgba(244,241,232,.66);
  letter-spacing: .015em;
}

#symfiny-site .sf-footer-contact a {
  color: rgba(244,241,232,.66);
  transition: color .25s ease,transform .25s ease;
}

#symfiny-site .sf-footer-contact a:hover {
  color: #f4f1e8;
  transform: translateY(-1px);
}

#symfiny-site .sf-footer-bottom {
  color: rgba(244,241,232,.42);
}


/* ---- REVEAL ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â slower, more editorial ---- */

#symfiny-site .sf-reveal {
  transform: translateY(34px);
  transition: opacity 1s cubic-bezier(.22,1,.36,1), transform 1.15s cubic-bezier(.22,1,.36,1);
}

#symfiny-site .sf-reveal.sf-visible {
  transform: none;
}

#symfiny-site .sf-news-grid .sf-reveal:nth-child(2),
#symfiny-site .sf-cards .sf-reveal:nth-child(2) {
  transition-delay: .07s;
}

#symfiny-site .sf-news-grid .sf-reveal:nth-child(3),
#symfiny-site .sf-cards .sf-reveal:nth-child(3) {
  transition-delay: .14s;
}

#symfiny-site .sf-cards .sf-reveal:nth-child(4) {
  transition-delay: .21s;
}

#symfiny-site .sf-principle-grid .sf-reveal:nth-child(2) {
  transition-delay: .08s;
}

#symfiny-site .sf-principle-grid .sf-reveal:nth-child(3) {
  transition-delay: .16s;
}


/* ---- MOBILE LUXURY ---- */

@media (max-width:760px) {
  #symfiny-site .sf-section {
    padding: 86px 0;
  }
  #symfiny-site .sf-purpose-intro .sf-title {
    font-size: clamp(46px,13vw,66px);
  }
  #symfiny-site .sf-purpose-feature-copy {
    padding: 31px 25px;
  }
  #symfiny-site .sf-guiding-premium {
    padding: 92px 0 98px;
  }
  #symfiny-site .sf-guiding-intro h2 {
    font-size: clamp(52px,15vw,78px);
  }
  #symfiny-site .sf-principle-media {
    height: 330px;
  }
  #symfiny-site .sf-principle-copy p {
    font-size: 29px;
  }
  #symfiny-site .sf-latest-head .sf-title {
    font-size: clamp(46px,13vw,68px);
  }
  #symfiny-site .sf-news-glass {
    padding: 28px 25px;
  }
  #symfiny-site .sf-news-glass h3 {
    font-size: 32px;
  }
  #symfiny-site .sf-journey {
    min-height: 690px;
  }
  #symfiny-site .sf-journey .sf-title {
    font-size: clamp(50px,14vw,76px);
  }
  #symfiny-site .sf-connect {
    padding: 100px 0;
  }
  #symfiny-site .sf-connect .sf-title {
    font-size: clamp(50px,14vw,76px);
  }
  #symfiny-site .sf-purpose::after,
  #symfiny-site .sf-jal::after,
  #symfiny-site .sf-latest::after,
  #symfiny-site .sf-explore::after,
  #symfiny-site .sf-connect::after {
    width: calc(100% - 32px);
  }
}

@media (prefers-reduced-motion:reduce) {
  #symfiny-site .sf-hero-video {
    transform: scale(1.02);
  }
}

#symfiny-site .sf-purpose,
#symfiny-site .sf-guiding-premium,
#symfiny-site .sf-jal,
#symfiny-site .sf-latest-premium,
#symfiny-site .sf-explore,
#symfiny-site .sf-connect {
  color: var(--lux-ink);
  border: 0 !important;
}

#symfiny-site .sf-purpose {
  background: radial-gradient(circle at 12% 12%,rgba(95,143,130,.13),transparent 28%), radial-gradient(circle at 88% 78%,rgba(185,154,99,.045),transparent 25%), linear-gradient(145deg,#0a2823 0%,#09221e 48%,#071b18 100%) !important;
}

#symfiny-site .sf-guiding-premium {
  background: radial-gradient(circle at 50% 0%,rgba(95,143,130,.14),transparent 34%), linear-gradient(180deg,#071c19 0%,#09231f 100%) !important;
}

#symfiny-site .sf-jal {
  background: radial-gradient(circle at 85% 12%,rgba(141,185,180,.10),transparent 27%), linear-gradient(145deg,#0c2b26 0%,#0a2521 55%,#081f1c 100%) !important;
}

#symfiny-site .sf-latest-premium {
  background: radial-gradient(circle at 92% 8%,rgba(185,154,99,.065),transparent 24%), linear-gradient(145deg,#081f1c 0%,#0a2622 58%,#071b18 100%) !important;
}

#symfiny-site .sf-explore {
  background: radial-gradient(circle at 8% 15%,rgba(95,143,130,.11),transparent 26%), linear-gradient(145deg,#0a2823 0%,#09221e 55%,#071b18 100%) !important;
}

#symfiny-site .sf-connect {
  background: radial-gradient(circle at 50% 0%,rgba(95,143,130,.14),transparent 30%), radial-gradient(circle at 12% 100%,rgba(185,154,99,.055),transparent 24%), linear-gradient(145deg,#071b18 0%,#0a2823 52%,#061714 100%) !important;
}

#symfiny-site .sf-purpose::after,
#symfiny-site .sf-guiding-premium::after,
#symfiny-site .sf-jal::after,
#symfiny-site .sf-latest-premium::after,
#symfiny-site .sf-explore::after,
#symfiny-site .sf-connect::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: min(1240px,calc(100% - 48px));
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg,transparent,rgba(194,166,108,.25),transparent);
  pointer-events: none;
}


/* ---- TYPE: ivory, not white ---- */

#symfiny-site .sf-purpose .sf-title,
#symfiny-site .sf-jal .sf-title,
#symfiny-site .sf-latest .sf-title,
#symfiny-site .sf-explore .sf-title,
#symfiny-site .sf-connect .sf-title {
  color: #f0eee5 !important;
}

#symfiny-site .sf-purpose .sf-eyebrow,
#symfiny-site .sf-jal .sf-eyebrow,
#symfiny-site .sf-latest .sf-eyebrow,
#symfiny-site .sf-explore .sf-eyebrow,
#symfiny-site .sf-connect .sf-eyebrow,
#symfiny-site .sf-glass-kicker {
  color: var(--lux-gold) !important;
}

#symfiny-site .sf-purpose-lead,
#symfiny-site .sf-purpose-reflection-copy,
#symfiny-site .sf-latest-head > p,
#symfiny-site .sf-jal-copy p,
#symfiny-site .sf-connect .sf-final-inner > p:not(.sf-eyebrow) {
  color: var(--lux-muted) !important;
}


/* ---- PURPOSE: remove the obvious floating-card treatment ---- */

#symfiny-site .sf-purpose-feature-copy {
  background: linear-gradient(145deg,rgba(244,241,232,.075),rgba(244,241,232,.025)) !important;
  border: 1px solid rgba(194,166,108,.20) !important;
  border-radius: 2px 28px 2px 28px !important;
  box-shadow: 0 30px 80px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.065) !important;
  backdrop-filter: blur(20px) saturate(120%);
  -webkit-backdrop-filter: blur(20px) saturate(120%);
}

#symfiny-site .sf-purpose-feature-copy h2,
#symfiny-site .sf-purpose-feature-copy p,
#symfiny-site .sf-purpose-signature {
  color: #f0eee5 !important;
}

#symfiny-site .sf-purpose-feature-copy p {
  color: rgba(240,238,229,.68) !important;
}

#symfiny-site .sf-purpose-signature {
  border-top-color: rgba(194,166,108,.20) !important;
}

#symfiny-site .sf-purpose-main-media,
#symfiny-site .sf-purpose-secondary-media {
  border-color: rgba(194,166,108,.25) !important;
  box-shadow: 0 30px 85px rgba(0,0,0,.30) !important;
}

#symfiny-site .sf-purpose-secondary-media {
  background: #102f2b !important;
}


/* ---- GUIDING PRINCIPLES: gallery, not three cards ---- */

#symfiny-site .sf-principle-grid {
  gap: 1px;
}

#symfiny-site .sf-principle-card {
  padding: 0 !important;
  border: 0 !important;
  border-top: 1px solid rgba(194,166,108,.20) !important;
  border-bottom: 1px solid rgba(244,241,232,.08) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

#symfiny-site .sf-principle-card + .sf-principle-card {
  border-left: 1px solid rgba(244,241,232,.08) !important;
}

#symfiny-site .sf-principle-media {
  border-radius: 0 !important;
  border: 0 !important;
  background: #102f2b !important;
}

#symfiny-site .sf-principle-copy {
  padding: 24px 6px 24px;
}


/* ---- WATER PHILOSOPHY: same dark world, photograph floats ---- */

#symfiny-site .sf-jal-bg-wash {
  background: linear-gradient(90deg,rgba(10,37,33,.96),rgba(10,37,33,.78) 52%,rgba(8,31,28,.94)) !important;
}

#symfiny-site .sf-jal-bg-video {
  opacity: .11 !important;
}

#symfiny-site .sf-jal-image {
  padding: 7px;
  border: 1px solid rgba(194,166,108,.20) !important;
  border-radius: 2px 48px 2px 48px !important;
  background: rgba(244,241,232,.035) !important;
  box-shadow: 0 35px 90px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.06) !important;
}

#symfiny-site .sf-jal-image img {
  border-radius: 0 40px 0 40px !important;
}

#symfiny-site .sf-jal-pill {
  color: #d7c8a8 !important;
  border-color: rgba(194,166,108,.22) !important;
  background: rgba(194,166,108,.055) !important;
}


/* ---- WATER BROS: preserve its current composition + dialogue ---- */

#symfiny-site .sf-bros-premium {
  border-top: 1px solid rgba(194,166,108,.12) !important;
  border-bottom: 1px solid rgba(194,166,108,.18) !important;
}


/* ---- LATEST: turn cards into an editorial index ---- */

#symfiny-site .sf-news-grid {
  gap: 0 !important;
}

#symfiny-site .sf-news-glass {
  min-height: 330px;
  border: 0 !important;
  border-top: 1px solid rgba(194,166,108,.20) !important;
  border-bottom: 1px solid rgba(244,241,232,.08) !important;
  border-radius: 0 !important;
  background: linear-gradient(145deg,rgba(244,241,232,.045),rgba(244,241,232,.012)) !important;
  box-shadow: none !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transition: background .45s ease,transform .45s ease;
}

#symfiny-site .sf-news-glass::after {
  display: none !important;
}

#symfiny-site .sf-news-glass:hover {
  transform: translateY(-3px) !important;
  background: rgba(244,241,232,.065) !important;
  box-shadow: none !important;
}

#symfiny-site .sf-news-glass h3 {
  color: #f0eee5 !important;
}

#symfiny-site .sf-news-glass p {
  color: rgba(240,238,229,.62) !important;
}

#symfiny-site .sf-news-link {
  color: #d8c7a3 !important;
  border-color: rgba(194,166,108,.30) !important;
}


/* ---- JOURNEY: already cinematic ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â let it breathe into the canvas ---- */

#symfiny-site .sf-journey {
  border-top: 1px solid rgba(194,166,108,.12) !important;
  border-bottom: 1px solid rgba(194,166,108,.18) !important;
}

#symfiny-site .sf-journey-edu {
  border-radius: 2px 24px 2px 24px !important;
  background: linear-gradient(145deg,rgba(244,241,232,.065),rgba(244,241,232,.018)) !important;
  border-color: rgba(194,166,108,.22) !important;
}


/* ---- EXPLORE: gallery tiles remain, but lose the UI-box feel ---- */

#symfiny-site .sf-cards {
  gap: 10px !important;
}

#symfiny-site .sf-card {
  border: 1px solid rgba(194,166,108,.19) !important;
  border-radius: 2px 30px 2px 30px !important;
  box-shadow: 0 25px 70px rgba(0,0,0,.28) !important;
}

#symfiny-site .sf-card:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 32px 85px rgba(0,0,0,.35) !important;
}


/* ---- CONNECT: quiet final room, not another white panel ---- */

#symfiny-site .sf-final-contact a {
  color: #f0eee5 !important;
  border-color: rgba(194,166,108,.22) !important;
  background: rgba(244,241,232,.035) !important;
  box-shadow: none !important;
}

#symfiny-site .sf-final-contact a:hover {
  background: rgba(194,166,108,.09) !important;
  border-color: rgba(194,166,108,.48) !important;
}


/* ---- FOOTER: deepest point of the green ---- */

#symfiny-site .sf-footer {
  background: radial-gradient(circle at 80% 0%,rgba(95,143,130,.07),transparent 28%), #03110f !important;
}

#symfiny-site .sf-section {
  position: relative;
}

@media (max-width:760px) {
  #symfiny-site .sf-purpose,
  #symfiny-site .sf-guiding-premium,
  #symfiny-site .sf-jal,
  #symfiny-site .sf-latest-premium,
  #symfiny-site .sf-explore,
  #symfiny-site .sf-connect {
    background: #09221e !important;
  }
  #symfiny-site .sf-principle-grid {
    gap: 0;
  }
  #symfiny-site .sf-principle-card + .sf-principle-card {
    border-left: 0 !important;
  }
  #symfiny-site .sf-news-glass {
    min-height: 260px;
  }
  #symfiny-site .sf-purpose-feature-copy {
    border-radius: 2px 22px 2px 22px !important;
  }
}


/* ---- V16 ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â LUXURY READABILITY ---- */

#symfiny-site {
  --lux-cream: #F4F1E8;
  --lux-white: #FAF9F5;
  --lux-gold: #C2A66C;
  --lux-aqua: #A8CBC5;
}

#symfiny-site .sf-title,
#symfiny-site .sf-title-light,
#symfiny-site h1,
#symfiny-site h2,
#symfiny-site h3,
#symfiny-site h4 {
  color: var(--lux-cream) !important;
}

#symfiny-site .sf-copy,
#symfiny-site .sf-purpose-lead,
#symfiny-site .sf-purpose-reflection-copy,
#symfiny-site .sf-latest-head > p,
#symfiny-site .sf-jal-copy p,
#symfiny-site .sf-card p,
#symfiny-site .sf-news-glass p,
#symfiny-site .sf-connect .sf-final-inner > p:not(.sf-eyebrow),
#symfiny-site .sf-final p {
  color: rgba(244,241,232,.78) !important;
}

#symfiny-site .sf-eyebrow,
#symfiny-site .sf-glass-kicker,
#symfiny-site .sf-card-number,
#symfiny-site .sf-news-item > span:first-child,
#symfiny-site .sf-speech-label,
#symfiny-site .sf-bros-signoff,
#symfiny-site .sf-waterkeeper-quote,
#symfiny-site .sf-purpose-signature {
  color: var(--lux-gold) !important;
}

#symfiny-site .sf-bros-copy .sf-eyebrow,
#symfiny-site .sf-waterkeeper .sf-eyebrow,
#symfiny-site .sf-guiding .sf-eyebrow,
#symfiny-site .sf-bros-head .sf-title em,
#symfiny-site .sf-guiding h2 em {
  color: var(--lux-aqua) !important;
}

#symfiny-site .sf-card-link,
#symfiny-site .sf-news-link,
#symfiny-site .sf-final-contact a {
  color: var(--lux-cream) !important;
}

#symfiny-site .sf-card-link::after,
#symfiny-site .sf-news-link::after {
  background: var(--lux-gold) !important;
}

#symfiny-site .sf-principle-copy p {
  color: var(--lux-cream) !important;
}

#symfiny-site .sf-principle-copy span {
  color: rgba(244,241,232,.62) !important;
}

#symfiny-site .sf-journey-edu span {
  color: var(--lux-gold) !important;
}

#symfiny-site .sf-journey-edu strong {
  color: var(--lux-cream) !important;
}

#symfiny-site .sf-journey-edu p {
  color: rgba(244,241,232,.74) !important;
}

#symfiny-site .sf-menu a,
#symfiny-site .sf-enquire {
  color: var(--lux-cream) !important;
}

#symfiny-site .sf-footer h4 {
  color: var(--lux-cream) !important;
}

#symfiny-site .sf-footer p,
#symfiny-site .sf-footer-links a,
#symfiny-site .sf-footer-contact a,
#symfiny-site .sf-footer-bottom {
  color: rgba(244,241,232,.70) !important;
}

#symfiny-site .sf-speech-bubble p {
  color: rgba(250,249,245,.88) !important;
}

#symfiny-site .sf-speech-bubble strong {
  color: var(--lux-white) !important;
}

#symfiny-site .sf-speech-bubble em {
  color: var(--lux-gold) !important;
}

#symfiny-site .sf-bros-overlay-note {
  color: var(--lux-white) !important;
}


/* ---- SYMFINY NAVIGATION V2 + MOBILE OVERLAP FIXES ---- */

#symfiny-site #sfHeader {
  z-index: 10000 !important;
  width: 100% !important;
  overflow: visible !important;
}

#symfiny-site #sfHeader.sf-header-hide,
#symfiny-site #sfHeader.sf-menu-quiet {
  opacity: 1 !important;
  transform: none !important;
  pointer-events: auto !important;
}

#symfiny-site .sf-menu {
  align-items: center;
}

#symfiny-site .sf-nav-dropdown {
  position: relative;
  display: flex;
  align-items: center;
}

#symfiny-site .sf-nav-dropdown-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 40px;
  padding: 8px 2px;
  border: 0;
  background: transparent;
  color: var(--white) !important;
  font: inherit;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
}

#symfiny-site .sf-nav-chevron {
  font-size: 13px;
  line-height: 1;
  transition: transform .2s ease;
}

#symfiny-site .sf-nav-dropdown.is-open .sf-nav-chevron {
  transform: rotate(180deg);
}

#symfiny-site .sf-nav-dropdown-panel {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  transform: translate(-50%,-5px);
  width: 230px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 9px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  border: 1px solid rgba(244,241,232,.14);
  border-radius: 17px;
  background: rgba(7,28,25,.97);
  box-shadow: 0 24px 60px rgba(0,0,0,.28);
  backdrop-filter: blur(20px) saturate(130%);
  -webkit-backdrop-filter: blur(20px) saturate(130%);
  transition: opacity .2s ease,transform .2s ease,visibility .2s ease;
}

#symfiny-site .sf-nav-dropdown:hover .sf-nav-dropdown-panel,
#symfiny-site .sf-nav-dropdown:focus-within .sf-nav-dropdown-panel,
#symfiny-site .sf-nav-dropdown.is-open .sf-nav-dropdown-panel {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%,0);
}

#symfiny-site .sf-nav-dropdown-panel a {
  display: block;
  width: 100%;
  padding: 11px 12px;
  border-radius: 10px;
  color: rgba(250,249,245,.84) !important;
  font-size: 10px !important;
  line-height: 1.35;
  letter-spacing: .08em;
  text-transform: uppercase;
}

#symfiny-site .sf-nav-dropdown-panel a:hover {
  background: rgba(141,185,180,.10);
  color: var(--white) !important;
  transform: none !important;
}

#symfiny-site .sf-nav-dropdown-panel a::after {
  display: none !important;
}

#symfiny-site #sfHeroVideo,
#symfiny-site #sfWaterVideo {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

@media (max-width:760px) {
  #symfiny-site,
  #symfiny-site body {
    max-width: 100%;
    overflow-x: clip !important;
  }
  #symfiny-site #sfHeader {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    padding: 8px 0 !important;
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
    background: linear-gradient(180deg,rgba(7,31,28,.76),rgba(7,31,28,.20)) !important;
  }
  #symfiny-site #sfHeader.sf-scrolled {
    background: rgba(7,28,25,.88) !important;
    backdrop-filter: blur(18px) saturate(130%);
    -webkit-backdrop-filter: blur(18px) saturate(130%);
  }
  #symfiny-site #sfHeader .sf-nav {
    width: calc(100% - 18px) !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    padding: 5px 7px !important;
    gap: 7px !important;
    border-radius: 18px !important;
  }
  #symfiny-site .sf-logo {
    flex: 0 1 auto !important;
  }
  #symfiny-site .sf-enquire {
    display: none !important;
  }
  #symfiny-site .sf-mobile-toggle {
    position: relative;
    z-index: 10003;
    display: flex !important;
    flex: 0 0 42px !important;
    width: 42px !important;
    height: 42px !important;
    margin-left: auto !important;
  }
  #symfiny-site .sf-menu {
    position: fixed !important;
    top: 68px !important;
    left: 9px !important;
    right: 9px !important;
    width: auto !important;
    max-width: none !important;
    max-height: calc(100svh - 78px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    display: none !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 2px !important;
    padding: 9px !important;
    border: 1px solid rgba(244,241,232,.14) !important;
    border-radius: 20px !important;
    background: rgba(7,28,25,.98) !important;
    box-shadow: 0 25px 70px rgba(0,0,0,.34) !important;
    backdrop-filter: blur(24px) saturate(135%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(135%) !important;
    z-index: 10002 !important;
  }
  #symfiny-site .sf-menu.sf-open {
    display: flex !important;
  }
  #symfiny-site .sf-menu > a,
  #symfiny-site .sf-nav-dropdown-toggle {
    width: 100% !important;
    min-height: 44px !important;
    padding: 12px 13px !important;
    border-radius: 10px !important;
    text-align: left !important;
    font-size: 10px !important;
    line-height: 1.3 !important;
    letter-spacing: .09em !important;
  }
  #symfiny-site .sf-menu > a:hover,
  #symfiny-site .sf-nav-dropdown-toggle:hover {
    background: rgba(141,185,180,.08);
    transform: none !important;
  }
  #symfiny-site .sf-nav-dropdown {
    width: 100% !important;
    display: block !important;
  }
  #symfiny-site .sf-nav-dropdown-toggle {
    justify-content: space-between !important;
  }
  #symfiny-site .sf-nav-dropdown-panel {
    position: static !important;
    width: 100% !important;
    transform: none !important;
    display: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    padding: 3px 0 4px 9px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }
  #symfiny-site .sf-nav-dropdown.is-open .sf-nav-dropdown-panel {
    display: flex !important;
  }
  #symfiny-site .sf-nav-dropdown-panel a {
    min-height: 38px !important;
    padding: 9px 11px !important;
    border-left: 1px solid rgba(185,154,99,.42);
    border-radius: 0 9px 9px 0;
    font-size: 9px !important;
    color: rgba(250,249,245,.72) !important;
  }
  #symfiny-site .sf-hero {
    width: 100% !important;
    min-height: 91svh !important;
    min-height: 91vh !important;
    overflow: hidden !important;
  }
  #symfiny-site .sf-hero-inner {
    width: calc(100% - 28px) !important;
    max-width: 680px !important;
    margin: 0 auto !important;
    padding-top: 68px !important;
  }
  #symfiny-site .sf-hero-kicker {
    max-width: 320px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  #symfiny-site .sf-hero h1 {
    width: 100% !important;
    max-width: 100% !important;
    font-size: clamp(51px,16vw,76px) !important;
    line-height: .87 !important;
  }
  #symfiny-site .sf-hero h1 span {
    display: block !important;
    width: 100% !important;
  }
  #symfiny-site .sf-hero-sub {
    width: 100% !important;
    max-width: 335px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  #symfiny-site .sf-hero-actions {
    width: 100% !important;
    max-width: 100% !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
  }
  #symfiny-site .sf-hero-actions .sf-btn {
    width: min(100%,285px) !important;
    max-width: 285px !important;
  }
  #symfiny-site .sf-bros-art,
  #symfiny-site .sf-bros-stage,
  #symfiny-site .sf-bros-speech {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  #symfiny-site .sf-bros-overlay-note {
    max-width: 145px !important;
    font-size: 13px !important;
    line-height: 1.08 !important;
    padding: 8px 9px !important;
  }
  #symfiny-site .sf-bros-overlay-note.note-a {
    left: 2px !important;
    right: auto !important;
  }
  #symfiny-site .sf-bros-overlay-note.note-b {
    right: 2px !important;
    left: auto !important;
  }
  #symfiny-site .sf-bros-overlay-note.note-c {
    left: 5% !important;
    right: auto !important;
    max-width: 170px !important;
  }
  #symfiny-site .sf-purpose-caption {
    left: 10px !important;
    right: 10px !important;
    max-width: calc(100% - 20px) !important;
  }
  #symfiny-site .sf-wrap,
  #symfiny-site .sf-purpose-intro,
  #symfiny-site .sf-purpose-feature,
  #symfiny-site .sf-purpose-reflection,
  #symfiny-site .sf-purpose-gallery,
  #symfiny-site .sf-latest-head,
  #symfiny-site .sf-news-grid,
  #symfiny-site .sf-footer-minimal,
  #symfiny-site .sf-footer-contact {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  #symfiny-site img,
  #symfiny-site video,
  #symfiny-site iframe {
    max-width: 100% !important;
  }
  #symfiny-site p,
  #symfiny-site h1,
  #symfiny-site h2,
  #symfiny-site h3,
  #symfiny-site h4 {
    overflow-wrap: break-word;
  }
  #symfiny-site .sf-sound {
    left: 9px !important;
    right: auto !important;
    bottom: 9px !important;
    max-width: calc(100vw - 18px) !important;
    z-index: 10004 !important;
  }
}

@media (max-width:390px) {
  #symfiny-site #sfHeader .sf-nav {
    width: calc(100% - 12px) !important;
  }
  #symfiny-site .sf-logo {
    width: 90px !important;
  }
  #symfiny-site .sf-menu {
    left: 6px !important;
    right: 6px !important;
    top: 65px !important;
  }
  #symfiny-site .sf-hero-inner {
    width: calc(100% - 24px) !important;
    padding-top: 64px !important;
  }
  #symfiny-site .sf-hero h1 {
    font-size: 50px !important;
  }
}


/* ---- TARGETED FIX ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â HERO POSTER + MOBILE ALIGNMENT ---- */

@media (max-width:760px) {
  #symfiny-site {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
  }
  #symfiny-site .sf-hero {
    width: 100%;
    min-height: 91svh;
    min-height: 91vh;
    overflow: hidden;
  }
  #symfiny-site .sf-hero-video {
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center center;
    transform: scale(1.025);
  }
  #symfiny-site .sf-hero-inner {
    width: calc(100% - 34px);
    max-width: 680px;
    margin: 0 auto;
    padding-top: 56px;
    text-align: center;
  }
  #symfiny-site .sf-hero-kicker {
    max-width: 330px;
    margin: 0 auto 18px;
  }
  #symfiny-site .sf-hero h1 {
    width: 100%;
    margin: 0 auto;
    font-size: clamp(54px,16.5vw,78px);
    line-height: .86;
    letter-spacing: -.035em;
  }
  #symfiny-site .sf-hero h1 span {
    display: block;
    width: 100%;
  }
  #symfiny-site .sf-hero-sub {
    width: 100%;
    max-width: 340px;
    margin: 23px auto 0;
    font-size: 14px;
    line-height: 1.65;
  }
  #symfiny-site .sf-hero-actions {
    width: 100%;
    margin: 27px auto 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
  }
  #symfiny-site .sf-hero-actions .sf-btn {
    width: min(100%,290px);
    max-width: 290px;
    margin: 0 auto;
  }
  #symfiny-site .sf-scroll {
    bottom: 17px;
  }
  #symfiny-site .sf-nav {
    width: calc(100% - 24px);
    max-width: none;
    margin: 0 auto;
    padding: 5px 8px;
  }
  #symfiny-site .sf-nav .sf-logo {
    width: 104px;
  }
  #symfiny-site .sf-mobile-toggle {
    flex: 0 0 42px;
  }
  #symfiny-site .sf-wrap {
    width: calc(100% - 32px);
    max-width: none;
    margin-left: auto;
    margin-right: auto;
  }
  #symfiny-site .sf-purpose-intro,
  #symfiny-site .sf-purpose-reflection,
  #symfiny-site .sf-latest-head,
  #symfiny-site .sf-bros-stage {
    width: 100%;
  }
  #symfiny-site .sf-purpose-gallery {
    width: 100%;
  }
  #symfiny-site img,
  #symfiny-site video {
    max-width: 100%;
  }
  #symfiny-site .sf-purpose-caption {
    left: 12px;
    right: 12px;
    max-width: calc(100% - 24px);
  }
  #symfiny-site .sf-footer-minimal,
  #symfiny-site .sf-footer-contact {
    width: 100%;
  }
  #symfiny-site .sf-footer-contact {
    align-items: flex-start;
  }
}

@media (max-width:390px) {
  #symfiny-site .sf-hero-inner {
    width: calc(100% - 28px);
    padding-top: 50px;
  }
  #symfiny-site .sf-hero h1 {
    font-size: 52px;
  }
  #symfiny-site .sf-hero-sub {
    max-width: 310px;
  }
  #symfiny-site .sf-nav {
    width: calc(100% - 18px);
  }
}

#symfiny-site .sf-logo {
  width: 132px !important;
}

@media (max-width:760px) {
  #symfiny-site .sf-logo {
    width: 108px !important;
  }
}

#symfiny-site .sf-contact-cta {
  display: inline-flex !important;
  margin-top: 10px;
}

#symfiny-site .sf-purpose-secondary-media {
  right: 0 !important;
  left: auto !important;
  bottom: 0 !important;
  transform: none !important;
  margin: 0 !important;
}

@media (max-width:760px) {
  #symfiny-site .sf-purpose-secondary-media {
    right: 0 !important;
    left: auto !important;
    bottom: 0 !important;
    transform: none !important;
  }
}


/* ---- FINAL POLISH ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â FOOTER, WATERKEEPER HEADING & AQUA BUD CTA ---- */

#symfiny-site .sf-waterkeeper .sf-title {
  line-height: 1.04 !important;
  letter-spacing: -0.025em;
  max-width: 980px;
  margin-left: auto;
  margin-right: auto;
}

#symfiny-site .sf-waterkeeper .sf-copy {
  line-height: 1.75 !important;
}

#symfiny-site .sf-aqua-bud-cta {
  display: inline-flex !important;
  margin-top: 26px;
  align-items: center;
  justify-content: center;
}

#symfiny-site .sf-footer-contact {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
}

#symfiny-site .sf-footer-contact a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

#symfiny-site .sf-footer-contact a span {
  color: var(--lux-gold);
  transition: transform .25s ease;
}

#symfiny-site .sf-footer-contact a:hover span {
  transform: translate(2px,-2px);
}

@media (max-width:760px) {
  #symfiny-site .sf-waterkeeper .sf-title {
    line-height: 1.08 !important;
    max-width: 94%;
  }
  #symfiny-site .sf-aqua-bud-cta {
    width: auto;
    max-width: calc(100% - 32px);
  }
  #symfiny-site .sf-footer-contact {
    gap: 8px;
  }
}


/* ---- Utilities (moved out of inline style="" attributes; the doubled id keeps inline-level priority) ---- */

#symfiny-site#symfiny-site .sf-u-center-x {
  margin-left: auto;
  margin-right: auto;
}


/* ==========================================================
   ABOUT US PAGE (about-us.php)
   Root: #symfiny-about
   ========================================================== */

#symfiny-about {
  --ink: #102F2B;
  --deep: #0B2421;
  --green: #174C45;
  --sage: #5F8F82;
  --mist: #8DB9B4;
  --cream: #F4F1E8;
  --gold: #B99A63;
  --white: #FCFBF6;
  --line: rgba(244,241,232,.15);
  --glass: rgba(244,241,232,.075);
  --shadow: 0 30px 80px rgba(0,0,0,.28);
  --serif: "Playfair Display",Georgia,serif;
  --sans: "Manrope",Arial,sans-serif;
  position: relative;
  left: 50%;
  margin-left: -50vw;
  margin-right: 0;
  overflow: hidden;
  background: var(--deep);
  color: var(--cream);
  font-family: var(--sans);
  line-height: 1.7;
  isolation: isolate;
}

#symfiny-about,
#symfiny-about * {
  box-sizing: border-box;
}

#symfiny-about img,
#symfiny-about video {
  display: block;
  max-width: 100%;
}

#symfiny-about a {
  text-decoration: none;
  color: inherit;
}

#symfiny-about button {
  font: inherit;
}

#symfiny-about .sf-container {
  margin: auto;
}

#symfiny-about .sf-progress {
  position: fixed;
  z-index: 99999;
  top: 0;
  left: 0;
  height: 2px;
  width: 0;
  background: linear-gradient(90deg,var(--mist),var(--gold));
  pointer-events: none;
}

#symfiny-about .sf-eyebrow {
  font-size: 11px;
  letter-spacing: .22em;
  font-weight: 800;
  color: var(--gold);
  text-transform: uppercase;
  margin-bottom: 18px;
}

#symfiny-about h1,
#symfiny-about h2,
#symfiny-about h3,
#symfiny-about h4,
#symfiny-about p {
  margin-top: 0;
}

#symfiny-about .sf-title {
  font-family: var(--serif);
  font-weight: 500;
  letter-spacing: -.035em;
  line-height: 1.03;
  margin-bottom: 25px;
}

#symfiny-about .sf-title span {
  color: var(--mist);
}

#symfiny-about .sf-copy {
  color: rgba(244,241,232,.78);
  font-size: 15.5px;
  line-height: 1.9;
}

#symfiny-about .sf-reveal {
  opacity: 0;
  transform: translateY(28px);
  filter: blur(4px);
  transition: opacity .85s ease,transform .85s ease,filter .85s ease;
}

#symfiny-about .sf-reveal.in {
  opacity: 1;
  transform: none;
  filter: none;
}

#symfiny-about .sf-header {
  width: 100%;
}

#symfiny-about .sf-header.hide {
  transform: translateY(-110%);
}

#symfiny-about .sf-logo {
  object-fit: contain;
}

#symfiny-about .sf-nav a {
  font-size: 11px;
  letter-spacing: .17em;
  font-weight: 800;
  color: rgba(244,241,232,.80);
  text-transform: uppercase;
  transition: color .25s ease;
}

#symfiny-about .sf-nav a:hover {
  color: var(--gold);
}

#symfiny-about .sf-hero {
  position: relative;
  min-height: 100svh;
  display: grid;
  align-items: end;
  overflow: hidden;
}

#symfiny-about .sf-hero-media {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: #071c1a;
}

#symfiny-about .sf-hero-media:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,rgba(5,22,20,.28),rgba(5,22,20,.10) 40%,rgba(5,22,20,.82) 100%);
}

#symfiny-about .sf-hero-media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#symfiny-about .sf-hero-content {
  position: relative;
  z-index: 2;
  width: min(1180px,calc(100vw - 48px));
  margin: 0 auto;
  padding: 0 0 90px;
}

#symfiny-about .sf-hero h1 {
  font-size: clamp(58px,8vw,116px);
  max-width: 950px;
}

#symfiny-about .sf-hero h1 span {
  display: block;
}

#symfiny-about .sf-hero-sub {
  max-width: 660px;
  color: rgba(244,241,232,.84);
  font-size: 16px;
  line-height: 1.8;
}

#symfiny-about .sf-scroll-note {
  margin-top: 36px;
  font-size: 10px;
  letter-spacing: .22em;
  color: rgba(244,241,232,.52);
}

#symfiny-about .sf-section {
  padding: 125px 0;
}

#symfiny-about .sf-meaning {
  background: var(--cream);
  color: var(--ink);
}

#symfiny-about .sf-meaning .sf-eyebrow {
  color: #8f754d;
}

#symfiny-about .sf-meaning .sf-title {
  font-size: clamp(48px,6vw,78px);
  color: var(--ink);
}

#symfiny-about .sf-meaning .sf-title span {
  color: var(--green);
}

#symfiny-about .sf-meaning-grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 70px;
  align-items: center;
}

#symfiny-about .sf-meaning-copy {
  font-size: 16px;
  line-height: 1.9;
  color: rgba(16,47,43,.78);
}

#symfiny-about .sf-meaning-copy p {
  margin-bottom: 20px;
}

#symfiny-about .sf-image-card {
  position: relative;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: var(--shadow);
  background: #d8d4c9;
}

#symfiny-about .sf-image-card img {
  width: 100%;
  height: 580px;
  object-fit: cover;
}

#symfiny-about .sf-image-card:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,transparent 60%,rgba(16,47,43,.30));
  pointer-events: none;
}

#symfiny-about .sf-image-caption {
  position: absolute;
  z-index: 2;
  left: 22px;
  bottom: 20px;
  padding: 12px 15px;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 16px;
  background: rgba(16,47,43,.42);
  backdrop-filter: blur(12px);
  font-size: 11px;
  letter-spacing: .08em;
}

#symfiny-about .sf-philosophy {
  background: linear-gradient(145deg,#102f2b,#174c45);
  padding: 130px 0;
}

#symfiny-about .sf-philosophy-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 75px;
  align-items: center;
}

#symfiny-about .sf-philosophy-media {
  position: relative;
  min-height: 610px;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: var(--shadow);
  background: #092522;
}

#symfiny-about .sf-philosophy-media img {
  width: 100%;
  height: 610px;
  object-fit: cover;
}

#symfiny-about .sf-philosophy-media:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,transparent 45%,rgba(5,24,22,.65));
}

#symfiny-about .sf-philosophy-label {
  position: absolute;
  z-index: 2;
  bottom: 25px;
  left: 25px;
  padding: 13px 16px;
  border-radius: 16px;
  background: rgba(244,241,232,.08);
  border: 1px solid rgba(244,241,232,.18);
  backdrop-filter: blur(14px);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
}

#symfiny-about .sf-philosophy .sf-title {
  font-size: clamp(48px,5vw,76px);
}

#symfiny-about .sf-philosophy-copy p {
  color: rgba(244,241,232,.76);
  font-size: 15.5px;
  line-height: 1.9;
}

#symfiny-about .sf-philosophy-points {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}

#symfiny-about .sf-pill {
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(244,241,232,.16);
  background: rgba(244,241,232,.055);
  font-size: 11px;
  letter-spacing: .09em;
}

#symfiny-about .sf-vision-head {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 70px;
  margin-bottom: 55px;
}

#symfiny-about .sf-vision-intro {
  align-self: end;
}

#symfiny-about .sf-vision-card {
  backdrop-filter: blur(14px);
  position: relative;
  overflow: hidden;
  transition: transform .35s ease,border-color .35s ease;
}

#symfiny-about .sf-vision-card:after {
  content: "";
  position: absolute;
  width: 170px;
  height: 170px;
  left: var(--cx,50%);
  top: var(--cy,0%);
  transform: translate(-50%,-50%);
  background: radial-gradient(circle,rgba(141,185,180,.20),transparent 68%);
  pointer-events: none;
}

#symfiny-about .sf-vision-card:hover {
  transform: translateY(-8px);
  border-color: rgba(185,154,99,.42);
}

#symfiny-about .sf-vision-number {
  font-size: 10px;
  letter-spacing: .2em;
}

#symfiny-about .sf-vision-card h3 {
  font-family: var(--serif);
  font-weight: 500;
}

#symfiny-about .sf-vision-belief {
  color: rgba(244,241,232,.76);
  font-size: 16px;
  line-height: 1.9;
}

#symfiny-about .sf-story {
  color: var(--ink);
}

#symfiny-about .sf-story-title {
  font-size: clamp(54px,7vw,94px);
}

#symfiny-about .sf-story-lead {
  margin-bottom: 70px;
}

#symfiny-about .sf-story-band {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 18px;
  margin: 0 calc((1180px - 100vw)/2) 70px;
}

#symfiny-about .sf-story-band figure {
  margin: 0;
  height: 510px;
  overflow: hidden;
}

#symfiny-about .sf-story-band img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1s ease;
}

#symfiny-about .sf-story-band figure:hover img {
  transform: scale(1.04);
}

#symfiny-about .sf-story-band figcaption {
  position: absolute;
}

#symfiny-about .sf-story-copy {
  padding-bottom: 65px;
}

#symfiny-about .sf-story-quote {
  margin: 50px 0;
  padding: 38px 0 38px 30px;
  border-left: 2px solid var(--gold);
  font-family: var(--serif);
  font-size: clamp(30px,4vw,52px);
  line-height: 1.2;
}

#symfiny-about .sf-story-photo {
  margin: 55px 0;
  border-radius: 26px;
  overflow: hidden;
  box-shadow: 0 25px 70px rgba(16,47,43,.18);
}

#symfiny-about .sf-story-photo img {
  width: 100%;
  height: 620px;
  object-fit: cover;
}

#symfiny-about .sf-story-video-section {
  background: #0a2421;
  padding: 80px 0;
}

#symfiny-about .sf-video-intro {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 35px;
  margin-bottom: 30px;
}

#symfiny-about .sf-video-intro h2 {
  font-family: var(--serif);
  font-size: clamp(40px,5vw,68px);
  font-weight: 500;
  line-height: 1.05;
  margin: 0;
}

#symfiny-about .sf-video-intro p {
  max-width: 390px;
  color: rgba(244,241,232,.60);
  font-size: 13px;
  line-height: 1.8;
}

#symfiny-about .sf-video-frame {
  position: relative;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: var(--shadow);
  background: #061917;
}

#symfiny-about .sf-video-frame video {
  width: 100%;
  height: min(68vh,720px);
  object-fit: cover;
}

#symfiny-about .sf-video-label {
  position: absolute;
  left: 20px;
  bottom: 20px;
  padding: 10px 14px;
  border-radius: 14px;
  background: rgba(7,31,29,.60);
  border: 1px solid rgba(244,241,232,.15);
  backdrop-filter: blur(12px);
  font-size: 10px;
  letter-spacing: .15em;
  text-transform: uppercase;
}

#symfiny-about .sf-water-turn {
  background: linear-gradient(180deg,#0a2421,#102f2b);
  padding: 120px 0;
  text-align: center;
}

#symfiny-about .sf-water-word {
  font-family: var(--serif);
  font-size: clamp(90px,18vw,240px);
  line-height: .8;
  color: rgba(244,241,232,.06);
  letter-spacing: -.08em;
}

#symfiny-about .sf-water-turn h3 {
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(34px,4.5vw,62px);
  margin: -15px auto 12px;
  max-width: 800px;
}

#symfiny-about .sf-water-turn p {
  color: rgba(244,241,232,.58);
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
}

#symfiny-about .sf-bros-intro {
  background: radial-gradient(circle at 50% 0%,#285e55 0,#102f2b 44%,#071d1b 100%);
  text-align: center;
}

#symfiny-about .sf-bros-logo {
  width: min(520px,82vw);
  height: auto;
  max-height: 230px;
  object-fit: contain;
  margin: 0 auto 30px;
  filter: drop-shadow(0 20px 35px rgba(0,0,0,.35));
}

#symfiny-about .sf-bros-kicker {
  font-size: 11px;
  letter-spacing: .22em;
  color: var(--gold);
  font-weight: 800;
}

#symfiny-about .sf-bros-intro h2 {
  font-family: var(--serif);
  font-size: clamp(48px,6vw,82px);
  font-weight: 500;
  line-height: 1;
  margin: 12px auto 20px;
}

#symfiny-about .sf-bros-intro p {
  max-width: 650px;
  margin: 0 auto 35px;
  color: rgba(244,241,232,.72);
  font-size: 15px;
  line-height: 1.8;
}

#symfiny-about .sf-bros-buttons {
  display: flex;
  justify-content: center;
  gap: 13px;
  flex-wrap: wrap;
}

#symfiny-about .sf-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 23px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
  transition: transform .3s ease,box-shadow .3s ease;
}

#symfiny-about .sf-btn:hover {
  transform: translateY(-3px);
}

#symfiny-about .sf-btn-gold {
  background: linear-gradient(135deg,#b99a63,#e0c995,#a9834c);
  box-shadow: 0 12px 35px rgba(185,154,99,.22);
}

#symfiny-about .sf-btn-glass {
  background: rgba(244,241,232,.07);
  border: 1px solid rgba(244,241,232,.22);
  backdrop-filter: blur(15px);
}

#symfiny-about .sf-bros-visual {
  margin: 65px auto 0;
  width: min(900px,100%);
  height: 310px;
  position: relative;
}

#symfiny-about .sf-bro {
  position: absolute;
  bottom: 0;
  height: 300px;
  width: auto;
  object-fit: contain;
  filter: drop-shadow(0 20px 30px rgba(0,0,0,.35));
}

#symfiny-about .sf-bro.asher {
  left: 16%;
}

:where(#symfiny-about) .sf-bro.aidan {
  right: 16%;
}

#symfiny-about .sf-comic {
  display: none;
}

#symfiny-about .sf-comic.open {
  display: block;
}

#symfiny-about .sf-comic-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

#symfiny-about .sf-comic-head h2 {
  font-family: var(--serif);
  font-size: clamp(42px,5vw,70px);
  font-weight: 500;
  line-height: 1;
  margin: 0;
}

#symfiny-about .sf-comic-actions {
  display: flex;
  gap: 9px;
  flex-wrap: wrap;
}

#symfiny-about .sf-comic-btn {
  border: 1px solid rgba(16,47,43,.18);
  background: rgba(255,255,255,.5);
  color: var(--ink);
  border-radius: 999px;
  padding: 11px 15px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  cursor: pointer;
}

#symfiny-about .sf-comic-chapter:first-of-type {
  border-top: 0;
}

#symfiny-about .sf-chapter-number {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .18em;
}

#symfiny-about .sf-chapter-title {
  font-family: var(--serif);
  font-size: clamp(34px,4vw,58px);
  font-weight: 500;
  line-height: 1.05;
  margin: 12px 0 35px;
}

#symfiny-about .sf-bubble {
  position: absolute;
}

#symfiny-about .sf-bubble strong {
  display: block;
  font-size: 10px;
  letter-spacing: .14em;
  margin-bottom: 7px;
}

#symfiny-about .sf-bubble span {
  font-family: var(--serif);
  font-size: 19px;
  line-height: 1.35;
}

#symfiny-about .sf-comic-single {
  max-width: 720px;
  margin: 0 auto;
}

#symfiny-about .sf-comic-single img {
  height: 420px;
}

#symfiny-about .sf-comic-together {
  display: block;
  object-fit: contain;
}

#symfiny-about .sf-comic-breath {
  text-align: center;
}

#symfiny-about .sf-comic-breath h3 {
  font-family: var(--serif);
  font-weight: 500;
}

#symfiny-about .sf-comic-breath p {
  max-width: 600px;
  margin: auto;
}

#symfiny-about .sf-dream {
  position: relative;
  min-height: 720px;
  display: grid;
  align-items: end;
  overflow: hidden;
}

#symfiny-about .sf-dream-bg {
  position: absolute;
  inset: 0;
}

#symfiny-about .sf-dream-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#symfiny-about .sf-dream-bg:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,rgba(7,28,26,.08),rgba(7,28,26,.84));
}

#symfiny-about .sf-dream-content {
  position: relative;
  z-index: 2;
  padding: 95px 0;
}

#symfiny-about .sf-dream h2 {
  font-family: var(--serif);
  font-size: clamp(55px,8vw,110px);
  line-height: .95;
  font-weight: 500;
  max-width: 800px;
}

#symfiny-about .sf-dream p {
  max-width: 630px;
  color: rgba(244,241,232,.78);
  font-size: 16px;
  line-height: 1.9;
}

#symfiny-about .sf-farm {
  background: var(--cream);
  color: var(--ink);
  padding: 125px 0;
}

#symfiny-about .sf-farm-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 75px;
  align-items: center;
}

#symfiny-about .sf-farm h2 {
  font-size: clamp(52px,6vw,80px);
  color: var(--ink);
}

#symfiny-about .sf-farm h2 span {
  color: var(--green);
}

#symfiny-about .sf-farm p {
  font-size: 15.5px;
  line-height: 1.9;
  color: rgba(16,47,43,.76);
}

#symfiny-about .sf-farm-media {
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 25px 65px rgba(16,47,43,.18);
}

#symfiny-about .sf-farm-media img {
  width: 100%;
  height: 650px;
  object-fit: cover;
}

#symfiny-about .sf-ethics {
  padding: 125px 0;
}

#symfiny-about .sf-ethics-head {
  max-width: 800px;
  margin-bottom: 55px;
}

#symfiny-about .sf-ethics h2 {
  font-family: var(--serif);
  font-size: clamp(50px,6vw,82px);
  font-weight: 500;
  line-height: 1;
}

#symfiny-about .sf-ethics-intro {
  color: rgba(244,241,232,.65);
  font-size: 15px;
}

#symfiny-about .sf-principles {
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: 12px;
}

#symfiny-about .sf-principle {
  position: relative;
  padding: 28px;
  border-radius: 22px;
  border: 1px solid var(--line);
  overflow: hidden;
  min-height: 175px;
}

#symfiny-about .sf-principle:after {
  content: "";
  position: absolute;
  inset: auto -50px -80px auto;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle,rgba(141,185,180,.18),transparent 68%);
  pointer-events: none;
}

#symfiny-about .sf-principle-no {
  font-size: 10px;
  letter-spacing: .18em;
}

#symfiny-about .sf-principle h3 {
  font-family: var(--serif);
  font-size: 25px;
  font-weight: 500;
  margin: 12px 0 7px;
}

#symfiny-about .sf-principle p {
  font-size: 12.5px;
  line-height: 1.75;
  margin: 0;
}

#symfiny-about .sf-fish {
  background: var(--cream);
  color: var(--ink);
  padding: 125px 0;
}

#symfiny-about .sf-fish-head {
  max-width: 800px;
  margin-bottom: 55px;
}

#symfiny-about .sf-fish h2 {
  font-family: var(--serif);
  font-size: clamp(55px,6vw,86px);
  font-weight: 500;
  line-height: 1;
  color: var(--ink);
}

#symfiny-about .sf-fish-intro {
  color: rgba(16,47,43,.68);
  font-size: 15px;
  line-height: 1.9;
}

#symfiny-about .sf-tip {
  display: inline-block;
  margin-top: 12px;
  padding: 9px 13px;
  border-radius: 999px;
  background: rgba(23,76,69,.07);
  font-size: 11px;
  color: var(--green);
}

#symfiny-about .sf-fish-grid {
  display: grid;
}

#symfiny-about .sf-fish-card {
  position: relative;
  overflow: hidden;
  box-shadow: 0 20px 55px rgba(16,47,43,.14);
}

#symfiny-about .sf-fish-photo {
  position: absolute;
  inset: 0;
  transition: transform .7s ease;
}

#symfiny-about .sf-fish-card:after {
  content: "";
  position: absolute;
  inset: 0;
}

#symfiny-about .sf-fish-info {
  position: absolute;
}

#symfiny-about .sf-fish-no {
  font-size: 10px;
  letter-spacing: .18em;
  color: var(--gold);
  font-weight: 800;
}

#symfiny-about .sf-fish-name {
  font-family: var(--serif);
  line-height: 1;
}

#symfiny-about .sf-fish-personality {
  font-size: 12px;
}

#symfiny-about .sf-fish-spec {
  display: grid;
  grid-template-columns: repeat(2,1fr);
}

#symfiny-about .sf-fish-spec div {
  border: 1px solid rgba(244,241,232,.12);
  background: rgba(244,241,232,.055);
  border-radius: 12px;
  backdrop-filter: blur(10px);
}

#symfiny-about .sf-fish-spec small {
  display: block;
  font-size: 8px;
  letter-spacing: .12em;
  color: rgba(244,241,232,.48);
  text-transform: uppercase;
}

#symfiny-about .sf-fish-spec strong {
  display: block;
  font-size: 10px;
  font-weight: 600;
  margin-top: 2px;
}

#symfiny-about .sf-fish-note {
  font-size: 10.5px;
  line-height: 1.6;
}

#symfiny-about .sf-no-photo-card {
  background: radial-gradient(circle at 50% 35%,rgba(141,185,180,.18),transparent 30%),linear-gradient(145deg,#1d4b43,#071d1b);
}

#symfiny-about .sf-no-photo-art {
  position: absolute;
  border: 1px solid rgba(244,241,232,.10);
  border-radius: 50%;
  box-shadow: inset 0 0 80px rgba(141,185,180,.06);
  display: grid;
  place-items: center;
  color: rgba(244,241,232,.20);
  font-size: 10px;
  letter-spacing: .20em;
  text-transform: uppercase;
}

#symfiny-about .sf-no-photo-art:before {
  content: "AQUATIC SPECIMEN";
  position: absolute;
  top: 24%;
  left: 0;
  right: 0;
  text-align: center;
}

#symfiny-about .sf-no-photo-art:after {
  content: "PHOTO COMING SOON";
  position: absolute;
  bottom: 24%;
  left: 0;
  right: 0;
  text-align: center;
  color: rgba(185,154,99,.58);
}

#symfiny-about .sf-fish-card.no-photo:after {
  background: linear-gradient(180deg,rgba(5,24,22,.02),rgba(5,24,22,.78));
}

#symfiny-about .sf-fish-card.no-photo .sf-fish-info {
  bottom: 25px;
}

#symfiny-about .sf-footer {
  background: #071d1b;
  padding: 120px 0 65px;
  text-align: center;
  border-top: 1px solid rgba(244,241,232,.08);
}

#symfiny-about .sf-footer h2 {
  font-family: var(--serif);
  font-size: clamp(55px,8vw,105px);
  font-weight: 500;
  line-height: .9;
  margin-bottom: 18px;
}

#symfiny-about .sf-footer h2 span {
  color: var(--mist);
}

#symfiny-about .sf-footer p {
  max-width: 620px;
  margin: 0 auto 30px;
  color: rgba(244,241,232,.58);
  font-size: 14px;
  line-height: 1.8;
}

#symfiny-about .sf-footer-mark {
  font-size: 10px;
  letter-spacing: .2em;
  color: var(--gold);
  font-weight: 800;
}

@media (max-width:980px) {
  #symfiny-about .sf-nav {
    gap: 15px;
  }
  #symfiny-about .sf-nav a {
    font-size: 9px;
  }
  #symfiny-about .sf-meaning-grid,
  #symfiny-about .sf-philosophy-grid,
  #symfiny-about .sf-vision-head,
  #symfiny-about .sf-farm-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  #symfiny-about .sf-story-band {
    margin-left: 0;
    margin-right: 0;
  }
  #symfiny-about .sf-fish-grid {
    grid-template-columns: 1fr;
  }
  #symfiny-about .sf-principles {
    grid-template-columns: 1fr;
  }
}

@media (max-width:700px) {
  #symfiny-about .sf-section,
  #symfiny-about .sf-philosophy,
  #symfiny-about .sf-vision,
  #symfiny-about .sf-story,
  #symfiny-about .sf-farm,
  #symfiny-about .sf-ethics,
  #symfiny-about .sf-fish {
    padding: 85px 0;
  }
  #symfiny-about .sf-story-band {
    grid-template-columns: 1fr;
  }
  #symfiny-about .sf-story-band figure {
    height: 300px;
  }
  #symfiny-about .sf-story-photo img {
    height: 380px;
  }
  #symfiny-about .sf-video-frame video {
    height: 55vh;
  }
  :where(#symfiny-about) .sf-bro.aidan {
    right: 2%;
  }
  #symfiny-about .sf-comic-grid {
    grid-template-columns: 1fr;
  }
  #symfiny-about .sf-comic-panel,
  #symfiny-about .sf-comic-panel img {
    min-height: 290px;
    height: 290px;
  }
  #symfiny-about .sf-comic-breath {
    margin-left: 0;
    margin-right: 0;
  }
}

@media (prefers-reduced-motion:reduce) {
  #symfiny-about * {
    scroll-behavior: auto !important;
    animation: none !important;
    transition: none !important;
  }
}


/* ---- SYMFINY FINAL VISUAL PASS ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â COMIC + CONTRAST + FISH UX ---- */

#symfiny-about .sf-comic {
  background: radial-gradient(circle at 10% 15%,rgba(185,154,99,.12),transparent 28%), radial-gradient(circle at 90% 80%,rgba(95,143,130,.12),transparent 30%), #f4f1e8 !important;
  color: #102f2b !important;
}

#symfiny-about .sf-comic-head h2,
#symfiny-about .sf-chapter-title {
  color: #102f2b !important;
}

#symfiny-about .sf-comic-chapter {
  position: relative;
  border-top: 1px solid rgba(16,47,43,.12) !important;
}

#symfiny-about .sf-comic-chapter:before {
  content: "";
  position: absolute;
  left: 0;
  background: linear-gradient(90deg,#b99a63,#8db9b4);
  border-radius: 99px;
}

#symfiny-about .sf-chapter-number {
  color: #9b7844 !important;
}

#symfiny-about .sf-comic-grid {
  display: grid !important;
}

#symfiny-about .sf-comic-panel {
  border-radius: 0 !important;
  overflow: visible !important;
  position: relative !important;
  background: radial-gradient(circle,rgba(16,47,43,.10) 1px,transparent 1.2px) 0 0/12px 12px, linear-gradient(135deg,rgba(255,255,255,.72),rgba(230,226,211,.75)) !important;
  border: 1px solid rgba(16,47,43,.10) !important;
  clip-path: polygon(1.5% 2%,98% 0,100% 97%,2% 100%) !important;
}

#symfiny-about .sf-comic-chapter:nth-of-type(3n) .sf-comic-panel {
  clip-path: polygon(0 1%,97% 2%,100% 99%,3% 97%) !important;
}

#symfiny-about .sf-comic-panel:before {
  content: "";
  position: absolute;
  inset: 12px;
  border: 1px solid rgba(16,47,43,.10);
  pointer-events: none;
  z-index: 0;
}

#symfiny-about .sf-comic-panel img {
  position: absolute !important;
  min-height: 0 !important;
  object-fit: contain !important;
  z-index: 1 !important;
  filter: drop-shadow(0 16px 18px rgba(16,47,43,.16)) !important;
  transition: transform .6s cubic-bezier(.2,.8,.2,1) !important;
}

#symfiny-about .sf-comic-panel:hover img {
  transform: translateY(-7px) scale(1.025);
}

#symfiny-about .sf-bubble {
  left: auto !important;
  background: #fffdf5 !important;
  color: #102f2b !important;
  border: 1px solid rgba(16,47,43,.16) !important;
  box-shadow: 0 16px 30px rgba(16,47,43,.16) !important;
  z-index: 4 !important;
}

#symfiny-about .sf-bubble:after {
  content: "";
  position: absolute;
  right: 32px;
  bottom: -11px;
  width: 20px;
  height: 20px;
  background: #fffdf5;
  border-right: 1px solid rgba(16,47,43,.16);
  border-bottom: 1px solid rgba(16,47,43,.16);
  transform: rotate(45deg);
}

#symfiny-about .sf-bubble strong {
  color: #a07e4c !important;
}

#symfiny-about .sf-bubble span {
  color: #102f2b !important;
}

#symfiny-about .sf-comic-single .sf-comic-panel {
  max-width: 720px;
  margin: 34px auto 0 !important;
}

#symfiny-about .sf-comic-together {
  filter: drop-shadow(0 18px 28px rgba(16,47,43,.16)) !important;
}

#symfiny-about .sf-comic-breath {
  margin-left: calc((1180px - 100vw)/2) !important;
  margin-right: calc((1180px - 100vw)/2) !important;
  background: linear-gradient(135deg,#0d332e,#174c45) !important;
  color: #f4f1e8 !important;
  position: relative;
  overflow: hidden;
}

#symfiny-about .sf-comic-breath:before {
  content: "";
  position: absolute;
  border: 1px solid rgba(244,241,232,.13);
  pointer-events: none;
}

#symfiny-about .sf-comic-breath .sf-water-word {
  color: rgba(244,241,232,.08) !important;
  letter-spacing: -.08em;
}

#symfiny-about .sf-comic-breath h3 {
  color: #e7f0eb !important;
  position: relative;
}

#symfiny-about .sf-comic-breath p {
  color: #d5e2dc !important;
  letter-spacing: .24em;
  font-weight: 800;
}

#symfiny-about .sf-philosophy .sf-title,
#symfiny-about .sf-vision h2,
#symfiny-about .sf-vision-card h3,
#symfiny-about .sf-ethics h2,
#symfiny-about .sf-ethics .sf-principle h3,
#symfiny-about .sf-dream h2,
#symfiny-about .sf-footer h2 {
  color: #f4f1e8 !important;
}

#symfiny-about .sf-philosophy .sf-title span,
#symfiny-about .sf-vision h2 span,
#symfiny-about .sf-ethics h2 span,
#symfiny-about .sf-dream h2 span,
#symfiny-about .sf-footer h2 span {
  color: #8db9b4 !important;
}

#symfiny-about .sf-philosophy-copy p,
#symfiny-about .sf-vision-intro,
#symfiny-about .sf-vision-card p,
#symfiny-about .sf-vision-belief,
#symfiny-about .sf-ethics-intro,
#symfiny-about .sf-principle p,
#symfiny-about .sf-dream p,
#symfiny-about .sf-footer p {
  color: rgba(244,241,232,.82) !important;
}

#symfiny-about .sf-ethics {
  border-top: 1px solid rgba(16,47,43,.08);
  border-bottom: 1px solid rgba(16,47,43,.08);
}

#symfiny-about .sf-ethics h2 {
  color: #102f2b !important;
}

#symfiny-about .sf-principle {
  box-shadow: 0 14px 35px rgba(16,47,43,.06);
}

#symfiny-about .sf-principle h3 {
  color: #102f2b !important;
}

#symfiny-about .sf-principle p {
  color: rgba(16,47,43,.68) !important;
}

#symfiny-about .sf-principle-no {
  color: #9b7844 !important;
}

#symfiny-about .sf-fish-grid {
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
}

#symfiny-about .sf-fish-card {
  cursor: pointer !important;
  background: #071f1d !important;
  isolation: isolate !important;
}

#symfiny-about .sf-fish-card:before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: radial-gradient(circle at 50% 32%,rgba(141,185,180,.18),transparent 46%),linear-gradient(180deg,#163e37 0%,#071f1d 100%);
}

#symfiny-about .sf-fish-photo {
  z-index: 1 !important;
  transform: none !important;
  filter: drop-shadow(0 24px 30px rgba(0,0,0,.30)) !important;
}

#symfiny-about .sf-fish-card:hover .sf-fish-photo {
  transform: scale(1.018) !important;
}

#symfiny-about .sf-fish-card:after {
  z-index: 2 !important;
}

#symfiny-about .sf-fish-info {
  z-index: 5 !important;
  border: 1px solid rgba(244,241,232,.18) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  transition: transform .48s cubic-bezier(.2,.8,.2,1) !important;
  overflow: auto !important;
}

#symfiny-about .sf-fish-card .sf-fish-personality {
  color: rgba(244,241,232,.82) !important;
}

#symfiny-about .sf-fish-card .sf-fish-spec div {
  background: rgba(244,241,232,.08) !important;
  border-color: rgba(244,241,232,.16) !important;
}

#symfiny-about .sf-fish-card .sf-fish-spec strong {
  color: #fffdf5 !important;
  font-size: 11px !important;
}

#symfiny-about .sf-fish-card .sf-fish-spec small {
  color: rgba(244,241,232,.56) !important;
}

#symfiny-about .sf-fish-card .sf-fish-note {
  color: rgba(244,241,232,.78) !important;
}

#symfiny-about .sf-fish-card .sf-fish-no {
  color: #d2b47d !important;
}

#symfiny-about .sf-fish-card:focus {
  outline: 2px solid #b99a63;
  outline-offset: 4px;
}

#symfiny-about .sf-fish-card:after {
  pointer-events: none;
}

#symfiny-about .sf-fish-cta {
  position: absolute;
  z-index: 6;
  padding: 8px 12px;
  border-radius: 999px;
  color: #102f2b;
  background: #f4f1e8;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  transition: opacity .25s ease,transform .25s ease;
  box-shadow: 0 8px 20px rgba(0,0,0,.16);
}

#symfiny-about .sf-fish-card:hover .sf-fish-cta,
#symfiny-about .sf-fish-card.is-open .sf-fish-cta {
  opacity: 0;
  transform: translateY(8px);
  pointer-events: none;
}

#symfiny-about .sf-fish-gallery {
  position: absolute;
  z-index: 1;
  overflow: hidden;
}

#symfiny-about .sf-fish-slide {
  position: absolute;
  opacity: 0;
  visibility: hidden;
  transition: opacity .35s ease;
}

#symfiny-about .sf-fish-slide.active {
  opacity: 1;
  visibility: visible;
}

#symfiny-about .sf-fish-gallery .sf-fish-photo {
  position: absolute !important;
}

#symfiny-about .sf-gallery-controls {
  position: absolute;
  z-index: 7;
  display: flex;
  gap: 6px;
}

#symfiny-about .sf-gallery-btn {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(244,241,232,.30);
  background: rgba(7,31,29,.46);
  color: #fffdf5;
  backdrop-filter: blur(10px);
  cursor: pointer;
  font-size: 17px;
  line-height: 1;
}

#symfiny-about .sf-gallery-dots {
  position: absolute;
  z-index: 7;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 5px;
}

#symfiny-about .sf-gallery-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(255,255,255,.42);
}

#symfiny-about .sf-gallery-dot.active {
  background: #d6b77d;
  width: 18px;
  border-radius: 9px;
}

#symfiny-about .sf-no-photo-card .sf-fish-info {
  transform: translateY(calc(100% - 72px));
}

#symfiny-about .sf-no-photo-art {
  inset: 13% !important;
  z-index: 1 !important;
}

@media (max-width:800px) {
  #symfiny-about .sf-comic-grid,
  #symfiny-about .sf-comic-chapter:nth-of-type(odd) .sf-comic-grid {
    grid-template-columns: 1fr !important;
  }
  #symfiny-about .sf-comic-panel {
    height: 380px !important;
    min-height: 380px !important;
  }
  #symfiny-about .sf-comic-breath {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 105px 20px !important;
  }
  #symfiny-about .sf-comic-breath:before {
    inset: 18px;
  }
  #symfiny-about .sf-fish-grid {
    grid-template-columns: 1fr !important;
  }
  #symfiny-about .sf-fish-card {
    height: 640px !important;
    min-height: 640px !important;
  }
  #symfiny-about .sf-fish-photo {
    padding: 18px 12px 175px !important;
  }
  #symfiny-about .sf-fish-info {
    max-height: 80% !important;
  }
}


/* ---- 1) Ethical guide: force readable editorial contrast. ---- */

#symfiny-about .sf-ethics .sf-principle h3 {
  color: #102f2b !important;
  opacity: 1 !important;
  text-shadow: none !important;
  font-family: var(--serif) !important;
  font-weight: 600 !important;
}

#symfiny-about .sf-ethics .sf-principle-no {
  opacity: 1 !important;
  color: #9b7844 !important;
}

#symfiny-about .sf-ethics .sf-principle p {
  color: rgba(16,47,43,.76) !important;
  opacity: 1 !important;
}

#symfiny-about .sf-ethics .sf-ethics-intro {
  color: rgba(16,47,43,.74) !important;
  opacity: 1 !important;
}


/* ---- 2) Water Bros in the intro: subtle character motion, not cartoonish bouncing. ---- */

#symfiny-about .sf-bros-visual .sf-bro.asher {
  animation: sfBrosFloatA 4.8s ease-in-out infinite;
}

#symfiny-about .sf-bros-visual .sf-bro.aidan {
  animation: sfBrosFloatB 4.2s ease-in-out infinite .25s;
}


/* ---- 3) Comic: tighter, more intimate panels. The characters occupy the stage. ---- */

#symfiny-about .sf-comic {
  padding: 62px 0 78px !important;
}

#symfiny-about .sf-comic-head {
  margin-bottom: 26px !important;
}

#symfiny-about .sf-comic-chapter {
  padding: 48px 0 56px !important;
}

#symfiny-about .sf-comic-chapter:before {
  top: 25px !important;
  width: 58px !important;
  height: 2px !important;
}

#symfiny-about .sf-comic-grid {
  grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important;
  gap: 12px !important;
  align-items: end !important;
}

#symfiny-about .sf-comic-chapter:nth-of-type(odd) .sf-comic-grid {
  grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important;
}

#symfiny-about .sf-comic-panel {
  min-height: 315px !important;
  height: 315px !important;
  box-shadow: 0 16px 34px rgba(16,47,43,.10) !important;
}

#symfiny-about .sf-comic-panel img {
  inset: 0 4px 0 !important;
  width: calc(100% - 8px) !important;
  height: 100% !important;
  object-position: center bottom !important;
}

#symfiny-about .sf-bubble {
  right: 12px !important;
  bottom: 10px !important;
  width: min(82%,390px) !important;
  padding: 13px 15px 14px !important;
  border-radius: 15px !important;
  font-size: 12px !important;
}

#symfiny-about .sf-comic-together {
  width: min(500px,100%) !important;
  height: 220px !important;
  margin: 18px auto 0 !important;
}


/* ---- 4) WATER segregation: compact chapter-break card instead of a full-width block. ---- */

#symfiny-about .sf-comic-breath {
  width: min(1020px,calc(100% - 32px)) !important;
  margin: 18px auto !important;
  padding: 64px 30px !important;
  border-radius: 26px !important;
  box-shadow: 0 22px 55px rgba(16,47,43,.14) !important;
}

#symfiny-about .sf-comic-breath:before {
  inset: 16px !important;
  border-radius: 18px !important;
}

#symfiny-about .sf-comic-breath .sf-water-word {
  font-size: clamp(72px,11vw,150px) !important;
}

#symfiny-about .sf-comic-breath h3 {
  font-size: clamp(28px,4vw,50px) !important;
  margin: -6px auto 10px !important;
}

#symfiny-about .sf-comic-breath p {
  font-size: 10px !important;
}

#symfiny-about .sf-comic-panel:nth-child(odd) img {
  animation: sfComicFloatA 5.4s ease-in-out infinite;
}

#symfiny-about .sf-comic-panel:nth-child(even) img {
  animation: sfComicFloatB 4.9s ease-in-out infinite .35s;
}


/* ---- 5) Fish: remove the big dead zones. Fish/photo is the hero; information is an ov ---- */

#symfiny-about .sf-fish-grid {
  gap: 14px !important;
}

#symfiny-about .sf-fish-card:after {
  background: linear-gradient(180deg,rgba(5,24,22,.02) 35%,rgba(5,24,22,.10) 52%,rgba(5,24,22,.95) 100%) !important;
}

#symfiny-about .sf-fish-info {
  left: 12px !important;
  right: 12px !important;
  bottom: 12px !important;
  padding: 15px 15px 14px !important;
  border-radius: 17px !important;
  max-height: 84% !important;
  transform: translateY(calc(100% - 62px));
}

#symfiny-about .sf-fish-name {
  font-size: 34px !important;
  margin: 6px 0 3px !important;
}

#symfiny-about .sf-fish-personality {
  margin-bottom: 12px !important;
}

#symfiny-about .sf-fish-spec {
  gap: 5px !important;
}

#symfiny-about .sf-fish-spec div {
  padding: 7px 8px !important;
}

#symfiny-about .sf-fish-note {
  margin-top: 9px !important;
}

#symfiny-about .sf-fish-cta {
  right: 24px !important;
  bottom: 16px !important;
}

#symfiny-about .sf-gallery-controls {
  right: 12px !important;
  top: 12px !important;
      display: none;
}

#symfiny-about .sf-gallery-dots {
  top: 18px !important;
}

@media (hover:hover) and (pointer:fine) {
  #symfiny-about .sf-fish-card:hover .sf-fish-info {
    transform: translateY(0) !important;
  }
  #symfiny-about .sf-fish-card:hover .sf-fish-cta {
    opacity: 0;
    transform: translateY(8px);
    pointer-events: none;
  }
  #symfiny-about .sf-fish-card.is-open .sf-fish-info {
    transform: translateY(0) !important;
  }
}

#symfiny-about .sf-fish-card:focus-within .sf-fish-info {
  transform: translateY(calc(100% - 62px)) !important;
}

#symfiny-about .sf-fish-card.is-open .sf-fish-info {
  transform: translateY(0) !important;
}

#symfiny-about .sf-fish-card.is-open .sf-fish-cta {
  opacity: 0 !important;
  transform: translateY(8px) !important;
  pointer-events: none !important;
}

#symfiny-about .sf-fish-card.is-user-closed .sf-fish-info {
  transform: translateY(calc(100% - 62px)) !important;
}

#symfiny-about .sf-fish-card.is-user-closed .sf-fish-cta {
  opacity: 1 !important;
  transform: none !important;
  pointer-events: auto !important;
}

@media (hover:none), (pointer:coarse) {
  #symfiny-about .sf-fish-card:hover .sf-fish-info {
    transform: translateY(calc(100% - 62px)) !important;
  }
  #symfiny-about .sf-fish-card:hover .sf-fish-cta {
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
  }
  #symfiny-about .sf-fish-card:hover .sf-fish-photo {
    transform: none !important;
  }
}

@media (max-width:900px) {
  #symfiny-about .sf-comic-grid {
    grid-template-columns: 1fr !important;
  }
  #symfiny-about .sf-comic-panel {
    height: 290px !important;
    min-height: 290px !important;
  }
  #symfiny-about .sf-comic-breath {
    width: calc(100% - 20px) !important;
    padding: 54px 20px !important;
  }
  #symfiny-about .sf-fish-card {
    height: 500px !important;
    min-height: 500px !important;
  }
}

@media (prefers-reduced-motion:reduce) {
  #symfiny-about .sf-bros-visual .sf-bro,
  #symfiny-about .sf-comic-panel img {
    animation: none !important;
  }
}


/* ---- SYMFINY ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â EDITORIAL SYSTEM PASS ---- */

#symfiny-about {
  --sf-max: 1180px;
  --sf-glass: rgba(244,241,232,.075);
  --sf-glass-strong: rgba(244,241,232,.11);
  --sf-border: rgba(244,241,232,.14);
  --sf-shadow: 0 30px 80px rgba(0,0,0,.25);
}

#symfiny-about:before {
  content: "";
  position: fixed;
  z-index: 0;
  width: 520px;
  height: 520px;
  left: var(--mx,50%);
  top: var(--my,20%);
  transform: translate(-50%,-50%);
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle,rgba(141,185,180,.045),transparent 68%);
  mix-blend-mode: screen;
}

#symfiny-about .sf-header-inner {
  position: relative;
}

#symfiny-about .sf-header:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg,transparent,rgba(141,185,180,.22),rgba(185,154,99,.25),transparent);
}

#symfiny-about .sf-nav a {
  position: relative;
  padding: 8px 0;
}

#symfiny-about .sf-nav a:after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: 2px;
  height: 1px;
  background: var(--gold);
  transition: right .35s ease;
}

#symfiny-about .sf-nav a:hover:after,
#symfiny-about .sf-nav a.is-active:after {
  right: 0;
}

#symfiny-about .sf-nav a.is-active {
  color: var(--cream);
}


/* ---- VISION: no more dead space ---- */

#symfiny-about .sf-vision {
  position: relative;
  overflow: hidden;
  background: radial-gradient(circle at 84% 24%,rgba(95,143,130,.11),transparent 28%), radial-gradient(circle at 12% 82%,rgba(185,154,99,.055),transparent 25%), linear-gradient(135deg,#0b2824 0%,#09231f 54%,#071c1a 100%);
  padding: 108px 0 112px;
}

#symfiny-about .sf-vision:before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .28;
  background-image: linear-gradient(rgba(244,241,232,.025) 1px,transparent 1px), linear-gradient(90deg,rgba(244,241,232,.025) 1px,transparent 1px);
  background-size: 80px 80px;
  mask-image: linear-gradient(90deg,black,transparent 78%);
}

#symfiny-about .sf-vision-top {
  display: grid;
  grid-template-columns: minmax(0,.93fr) minmax(0,1.07fr);
  gap: 58px;
  align-items: center;
  margin-bottom: 48px;
}

#symfiny-about .sf-vision-copy {
  position: relative;
  z-index: 2;
}

#symfiny-about .sf-vision h2 {
  max-width: 650px;
  font-size: clamp(46px,5.45vw,78px);
  line-height: .98;
  margin-bottom: 28px;
  color: var(--cream) !important;
}

#symfiny-about .sf-vision h2 span {
  color: var(--mist) !important;
}

#symfiny-about .sf-vision-intro {
  max-width: 570px;
  color: rgba(244,241,232,.76) !important;
  font-size: 14px;
  line-height: 1.85;
}

#symfiny-about .sf-vision-intro p {
  margin: 0 0 14px;
}

#symfiny-about .sf-vision-signature {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 28px;
  color: rgba(244,241,232,.52);
}

#symfiny-about .sf-vision-signature span {
  font-size: 9px;
  letter-spacing: .2em;
  color: var(--gold);
  font-weight: 800;
}

#symfiny-about .sf-vision-signature i {
  width: 34px;
  height: 1px;
  background: rgba(185,154,99,.55);
}

#symfiny-about .sf-vision-signature small {
  font-size: 9px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

#symfiny-about .sf-ecosystem {
  position: relative;
  min-height: 500px;
  border: 1px solid rgba(244,241,232,.12);
  border-radius: 30px;
  overflow: hidden;
  background: radial-gradient(circle at 50% 50%,rgba(141,185,180,.13),transparent 31%), linear-gradient(145deg,rgba(244,241,232,.075),rgba(244,241,232,.018));
  box-shadow: var(--sf-shadow);
  backdrop-filter: blur(18px) saturate(120%);
  -webkit-backdrop-filter: blur(18px) saturate(120%);
}

#symfiny-about .sf-ecosystem:before {
  content: "";
  position: absolute;
  inset: 16px;
  border: 1px solid rgba(244,241,232,.08);
  border-radius: 22px;
  pointer-events: none;
}

#symfiny-about .sf-ecosystem-glow {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 230px;
  height: 230px;
  transform: translate(-50%,-50%);
  border-radius: 50%;
  background: radial-gradient(circle,rgba(141,185,180,.22),rgba(141,185,180,.05) 43%,transparent 70%);
  filter: blur(2px);
  animation: sfWaterPulse 5.5s ease-in-out infinite;
}

#symfiny-about .sf-ecosystem-orbit {
  position: absolute;
  left: 50%;
  top: 50%;
  border: 1px solid rgba(141,185,180,.18);
  border-radius: 50%;
  transform: translate(-50%,-50%);
  pointer-events: none;
}

#symfiny-about .sf-ecosystem-orbit.orbit-one {
  width: 285px;
  height: 285px;
}

#symfiny-about .sf-ecosystem-orbit.orbit-two {
  width: 410px;
  height: 410px;
  border-color: rgba(185,154,99,.12);
  border-style: dashed;
  animation: sfOrbit 22s linear infinite;
}

#symfiny-about .sf-ecosystem-core {
  position: absolute;
  z-index: 3;
  left: 50%;
  top: 50%;
  width: 160px;
  height: 160px;
  transform: translate(-50%,-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  border: 1px solid rgba(244,241,232,.22);
  border-radius: 50%;
  background: rgba(9,38,34,.72);
  box-shadow: inset 0 0 45px rgba(141,185,180,.08),0 18px 40px rgba(0,0,0,.20);
  backdrop-filter: blur(16px);
}

#symfiny-about .sf-core-kicker {
  font-size: 8px;
  letter-spacing: .2em;
  color: var(--gold);
  font-weight: 800;
  margin-bottom: 5px;
}

#symfiny-about .sf-ecosystem-core strong {
  font-family: var(--serif);
  font-size: 32px;
  line-height: 1;
  font-weight: 500;
  color: var(--cream);
}

#symfiny-about .sf-ecosystem-core small {
  margin-top: 7px;
  font-size: 8px;
  letter-spacing: .08em;
  color: rgba(244,241,232,.48);
}

#symfiny-about .sf-eco-node {
  position: absolute;
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 88px;
  min-height: 62px;
  padding: 9px 12px;
  border-radius: 16px;
  border: 1px solid rgba(244,241,232,.14);
  background: rgba(8,31,29,.64);
  backdrop-filter: blur(12px);
  box-shadow: 0 12px 28px rgba(0,0,0,.15);
  transition: transform .35s ease,border-color .35s ease,background .35s ease;
}

#symfiny-about .sf-eco-node:hover {
  transform: translateY(-5px);
  border-color: rgba(185,154,99,.45);
  background: rgba(244,241,232,.09);
}

#symfiny-about .sf-eco-node b {
  font-size: 8px;
  letter-spacing: .16em;
  color: var(--gold);
  margin-bottom: 2px;
}

#symfiny-about .sf-eco-node strong {
  font-size: 10px;
  letter-spacing: .12em;
  color: var(--cream);
}

#symfiny-about .sf-eco-node span {
  margin-top: 2px;
  font-size: 8px;
  color: rgba(244,241,232,.44);
  letter-spacing: .08em;
  text-transform: uppercase;
}

#symfiny-about .node-fish {
  left: 8%;
  top: 18%;
}

#symfiny-about .node-learn {
  right: 8%;
  top: 18%;
}

#symfiny-about .node-build {
  left: 6%;
  bottom: 18%;
}

#symfiny-about .node-well {
  right: 6%;
  bottom: 18%;
}

#symfiny-about .node-space {
  left: 50%;
  top: 8%;
  transform: translateX(-50%);
}

#symfiny-about .node-space:hover {
  transform: translateX(-50%) translateY(-5px);
}

#symfiny-about .sf-ecosystem-caption {
  position: absolute;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  white-space: nowrap;
  font-size: 8px;
  letter-spacing: .18em;
  color: rgba(244,241,232,.42);
}

#symfiny-about .sf-vision-grid {
  display: grid !important;
  grid-template-columns: repeat(5,minmax(0,1fr)) !important;
  gap: 10px !important;
  position: relative;
  z-index: 2;
}

#symfiny-about .sf-vision-card {
  min-height: 205px !important;
  padding: 22px 18px 20px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(244,241,232,.13) !important;
  background: linear-gradient(145deg,rgba(244,241,232,.085),rgba(244,241,232,.025)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

#symfiny-about .sf-vision-card h3 {
  font-size: 26px !important;
  margin: 48px 0 10px !important;
}

#symfiny-about .sf-vision-card p {
  font-size: 11px !important;
  line-height: 1.7 !important;
  max-width: 170px;
}

#symfiny-about .sf-vision-number {
  color: var(--gold) !important;
}

#symfiny-about .sf-card-arrow {
  position: absolute;
  right: 16px;
  bottom: 15px;
  font-size: 16px;
  color: rgba(141,185,180,.65);
  transition: transform .3s ease,color .3s ease;
}

#symfiny-about .sf-vision-card:hover .sf-card-arrow {
  transform: translate(3px,-3px);
  color: var(--gold);
}

#symfiny-about .sf-vision-belief {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 24px;
  align-items: center;
  margin-top: 24px !important;
  padding: 22px 24px !important;
  border: 1px solid rgba(244,241,232,.11) !important;
  border-left: 2px solid var(--gold) !important;
  border-radius: 0 18px 18px 0;
  background: rgba(244,241,232,.035) !important;
}

#symfiny-about .sf-belief-label {
  font-size: 8px;
  letter-spacing: .2em;
  font-weight: 800;
  white-space: nowrap;
}

#symfiny-about .sf-vision-belief strong {
  font-size: 13px;
  line-height: 1.7;
  font-weight: 500;
}

#symfiny-about .sf-story {
  position: relative;
}

#symfiny-about .sf-story:before {
  content: "";
  display: block;
  width: 70px;
  height: 2px;
  margin-bottom: 34px;
  background: linear-gradient(90deg,var(--gold),var(--green));
  border-radius: 99px;
}

#symfiny-about .sf-ethics,
#symfiny-about .sf-fish {
  position: relative;
}

#symfiny-about .sf-ethics:before,
#symfiny-about .sf-fish:before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: min(1180px,calc(100% - 48px));
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg,transparent,rgba(185,154,99,.25),transparent);
}

@media (max-width:980px) {
  #symfiny-about .sf-vision-top {
    grid-template-columns: 1fr;
    gap: 42px;
  }
  #symfiny-about .sf-ecosystem {
    min-height: 460px;
  }
  #symfiny-about .sf-vision-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
  #symfiny-about .sf-vision-card:last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width:700px) {
  #symfiny-about .sf-container {
    width: calc(100vw - 30px);
  }
  #symfiny-about .sf-vision {
    padding: 78px 0 82px;
  }
  #symfiny-about .sf-vision-top {
    gap: 30px;
    margin-bottom: 30px;
  }
  #symfiny-about .sf-vision h2 {
    font-size: clamp(43px,12vw,62px);
    line-height: 1;
  }
  #symfiny-about .sf-ecosystem {
    min-height: 390px;
    border-radius: 24px;
  }
  #symfiny-about .sf-ecosystem-orbit.orbit-one {
    width: 220px;
    height: 220px;
  }
  #symfiny-about .sf-ecosystem-orbit.orbit-two {
    width: 310px;
    height: 310px;
  }
  #symfiny-about .sf-ecosystem-core {
    width: 128px;
    height: 128px;
  }
  #symfiny-about .sf-ecosystem-core strong {
    font-size: 25px;
  }
  #symfiny-about .sf-eco-node {
    min-width: 72px;
    min-height: 54px;
    padding: 7px 8px;
  }
  #symfiny-about .sf-eco-node strong {
    font-size: 8px;
  }
  #symfiny-about .sf-eco-node span {
    font-size: 7px;
  }
  #symfiny-about .node-fish {
    left: 3%;
    top: 19%;
  }
  #symfiny-about .node-learn {
    right: 3%;
    top: 19%;
  }
  #symfiny-about .node-build {
    left: 3%;
    bottom: 20%;
  }
  #symfiny-about .node-well {
    right: 3%;
    bottom: 20%;
  }
  #symfiny-about .node-space {
    top: 5%;
  }
  #symfiny-about .sf-ecosystem-caption {
    font-size: 6.5px;
    letter-spacing: .1em;
    bottom: 12px;
  }
  #symfiny-about .sf-vision-card:last-child {
    grid-column: auto;
  }
  #symfiny-about .sf-vision-card h3 {
    margin-top: 34px !important;
  }
  #symfiny-about .sf-vision-belief {
    grid-template-columns: 1fr;
    gap: 9px;
  }
}

@media (prefers-reduced-motion:reduce) {
  #symfiny-about .sf-ecosystem-glow,
  #symfiny-about .sf-ecosystem-orbit.orbit-two {
    animation: none !important;
  }
}


/* ---- SYMFINY ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â SHARED MAIN NAVIGATION ---- */

#symfiny-about .sf-header-inner {
  width: min(1180px,calc(100vw - 48px));
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}

#symfiny-about .sf-logo-link {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
}

#symfiny-about .sf-menu > a,
#symfiny-about .sf-dropdown-toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 8px 0;
  border: 0;
  background: transparent;
  color: rgba(244,241,232,.80);
  font-family: var(--sans);
  font-size: 11px;
  line-height: 1.25;
  letter-spacing: .17em;
  font-weight: 800;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
  transition: color .25s ease;
}

#symfiny-about .sf-menu > a:after,
#symfiny-about .sf-dropdown-toggle:after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: 2px;
  height: 1px;
  background: var(--gold);
  transition: right .35s ease;
}

#symfiny-about .sf-menu > a:hover,
#symfiny-about .sf-dropdown-toggle:hover,
#symfiny-about .sf-dropdown-toggle.is-active {
  color: var(--cream);
}

#symfiny-about .sf-menu > a:hover:after,
#symfiny-about .sf-dropdown-toggle:hover:after,
#symfiny-about .sf-dropdown-toggle.is-active:after {
  right: 0;
}

#symfiny-about .sf-menu-item {
  position: relative;
  display: flex;
  align-items: center;
}

#symfiny-about .sf-dropdown-arrow {
  display: inline-block;
  font-size: 14px;
  line-height: 1;
  transform: translateY(-1px);
  transition: transform .25s ease,color .25s ease;
  color: rgba(244,241,232,.60);
}

#symfiny-about .sf-dropdown:hover .sf-dropdown-arrow,
#symfiny-about .sf-dropdown.is-open .sf-dropdown-arrow {
  transform: rotate(180deg) translateY(1px);
  color: var(--gold);
}

#symfiny-about .sf-dropdown-menu {
  position: absolute;
  top: calc(100% + 16px);
  left: 50%;
  transform: translate(-50%,-8px);
  width: 235px;
  padding: 9px;
  border: 1px solid rgba(244,241,232,.14);
  border-radius: 18px;
  background: rgba(7,29,27,.96);
  box-shadow: 0 25px 65px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter: blur(22px) saturate(125%);
  -webkit-backdrop-filter: blur(22px) saturate(125%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .22s ease,transform .22s ease,visibility .22s ease;
  z-index: 1100;
}

#symfiny-about .sf-dropdown-menu:before {
  content: "";
  position: absolute;
  top: -6px;
  left: 50%;
  width: 11px;
  height: 11px;
  transform: translateX(-50%) rotate(45deg);
  background: rgba(7,29,27,.96);
  border-left: 1px solid rgba(244,241,232,.14);
  border-top: 1px solid rgba(244,241,232,.14);
}

#symfiny-about .sf-dropdown:hover .sf-dropdown-menu,
#symfiny-about .sf-dropdown.is-open .sf-dropdown-menu,
#symfiny-about .sf-dropdown:focus-within .sf-dropdown-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%,0);
}

#symfiny-about .sf-dropdown-menu a {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  padding: 11px 13px;
  border-radius: 11px;
  color: rgba(244,241,232,.72);
  font-family: var(--sans);
  font-size: 10px;
  line-height: 1.35;
  letter-spacing: .12em;
  font-weight: 700;
  text-transform: uppercase;
  transition: background .22s ease,color .22s ease,transform .22s ease;
}

#symfiny-about .sf-dropdown-menu a:after {
  display: none !important;
}

#symfiny-about .sf-dropdown-menu a:hover,
#symfiny-about .sf-dropdown-menu a.is-active {
  color: var(--cream);
  background: rgba(244,241,232,.07);
  transform: translateX(2px);
}

#symfiny-about .sf-enquire {
  flex: 0 0 auto;
}

@media (max-width:1120px) and (min-width:701px) {
  #symfiny-about .sf-header-inner {
    gap: 18px;
  }
  #symfiny-about .sf-menu > a,
  #symfiny-about .sf-dropdown-toggle {
    font-size: 9.5px;
    letter-spacing: .13em;
  }
}

@media (max-width:700px) {
  #symfiny-about .sf-logo-link {
    display: flex !important;
  }
  #symfiny-about .sf-mobile-drawer-inner > a,
  #symfiny-about .sf-mobile-about-toggle {
    display: block !important;
    width: 100% !important;
    padding: 13px 12px !important;
    border: 0 !important;
    border-top: 1px solid rgba(244,241,232,.08) !important;
    background: transparent !important;
    color: #f4f1e8 !important;
    font-family: var(--sans) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .13em !important;
    line-height: 1.4 !important;
    text-align: left !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
  }
  #symfiny-about .sf-mobile-about {
    width: 100%;
  }
  #symfiny-about .sf-mobile-about-toggle {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }
  #symfiny-about .sf-mobile-about-toggle span {
    pointer-events: none;
  }
  #symfiny-about .sf-mobile-about-arrow {
    color: var(--gold) !important;
    font-size: 14px !important;
    transition: transform .25s ease !important;
  }
  #symfiny-about .sf-mobile-about.is-open .sf-mobile-about-arrow {
    transform: rotate(180deg);
  }
  #symfiny-about .sf-mobile-about-links {
    display: grid;
    grid-template-rows: 0fr;
    overflow: hidden;
    opacity: 0;
    transition: grid-template-rows .28s ease,opacity .22s ease;
  }
  #symfiny-about .sf-mobile-about-links > div {
    min-height: 0;
  }
  #symfiny-about .sf-mobile-about.is-open .sf-mobile-about-links {
    grid-template-rows: 1fr;
    opacity: 1;
  }
  #symfiny-about .sf-mobile-about-links a {
    display: block !important;
    padding: 10px 12px 10px 27px !important;
    border-top: 1px solid rgba(244,241,232,.055) !important;
    color: rgba(244,241,232,.62) !important;
    font-family: var(--sans) !important;
    font-size: 9.5px !important;
    font-weight: 600 !important;
    letter-spacing: .10em !important;
    line-height: 1.45 !important;
    text-transform: uppercase !important;
  }
  #symfiny-about .sf-mobile-about-links a:before {
    content: "";
    display: inline-block;
    width: 4px;
    height: 4px;
    margin: 0 9px 2px 0;
    border-radius: 50%;
    background: var(--gold);
  }
}


/* ---- FINAL REFINEMENT ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â HOME HEADER / VISUAL VISION / PLEDGE ---- */

#symfiny-about .sf-header {
  border-bottom: 0;
  transition: background .45s ease,padding .45s ease,opacity .55s ease,transform .65s ease;
}

#symfiny-about .sf-nav {
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#symfiny-about .sf-logo {
  flex-shrink: 0;
  display: block;
}

#symfiny-about .sf-logo img {
  object-fit: contain;
}

#symfiny-about .sf-menu > a,
#symfiny-about .sf-nav-dropdown-toggle {
  position: relative;
  color: var(--white) !important;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  opacity: .96;
  transition: color .25s ease,opacity .25s ease,transform .28s ease;
  white-space: nowrap;
}

#symfiny-about .sf-menu > a {
  padding: 10px 2px;
}

#symfiny-about .sf-menu > a:hover {
  color: #fff !important;
  opacity: 1;
  transform: translateY(-2px);
}

#symfiny-about .sf-menu > a:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 1px;
  background: var(--gold);
  transition: width .3s ease;
  opacity: .7;
}

#symfiny-about .sf-menu > a:hover:after {
  width: 100%;
}

#symfiny-about .sf-nav-dropdown-panel a {
  transition: background .2s ease,color .2s ease;
}

#symfiny-about .sf-nav-dropdown-panel a:after {
  display: none !important;
}

#symfiny-about .sf-enquire {
  transition: background .3s ease,border-color .3s ease,transform .3s ease;
}

#symfiny-about .sf-enquire:hover {
  background: rgba(250,249,245,.13);
  border-color: rgba(250,249,245,.95);
  transform: translateY(-1px);
}

#symfiny-about .sf-mobile-toggle {
  width: 42px;
  height: 42px;
  border: 1px solid rgba(250,249,245,.4);
  border-radius: 50%;
  background: rgba(16,47,43,.35);
  color: white;
  cursor: pointer;
}

#symfiny-about .sf-mobile-toggle span,
#symfiny-about .sf-mobile-toggle span:before,
#symfiny-about .sf-mobile-toggle span:after {
  display: block;
  width: 16px;
  height: 1px;
  margin: auto;
  background: white;
  content: "";
}

#symfiny-about .sf-mobile-toggle span:before {
  transform: translateY(-5px);
}

#symfiny-about .sf-mobile-toggle span:after {
  transform: translateY(4px);
}

#symfiny-about .sf-way-photo {
  position: absolute;
  left: 12px;
  right: 12px;
  top: 42px;
  height: 82px;
  border-radius: 15px;
  overflow: hidden;
  border: 1px solid rgba(244,241,232,.13);
  box-shadow: 0 12px 28px rgba(0,0,0,.18);
  background: #102f2b;
}

#symfiny-about .sf-way-photo:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,rgba(5,24,22,.02),rgba(5,24,22,.42));
}

#symfiny-about .sf-way-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .6s ease;
}

#symfiny-about .sf-vision-card:hover .sf-way-photo img {
  transform: scale(1.06);
}

#symfiny-about .sf-vision-card h3 {
  margin-top: 145px !important;
}

#symfiny-about .sf-waterkeeper-pledge {
  position: relative;
  overflow: hidden;
  padding: 110px 24px;
  background: radial-gradient(circle at 50% 0%,rgba(95,143,130,.20),transparent 38%),linear-gradient(145deg,#071c1a,#102f2b 55%,#174c45);
  color: #f4f1e8;
}

#symfiny-about .sf-waterkeeper-pledge:before {
  content: "";
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(185,154,99,.28);
  border-radius: 28px;
  pointer-events: none;
}

#symfiny-about .sf-pledge-inner {
  position: relative;
  z-index: 2;
  width: min(900px,100%);
  margin: auto;
  text-align: center;
  padding: 54px 52px;
  border: 1px solid rgba(244,241,232,.16);
  border-radius: 28px;
  background: rgba(244,241,232,.07);
  box-shadow: 0 30px 80px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter: blur(18px);
}

#symfiny-about .sf-pledge-inner .sf-eyebrow {
  color: #d4b77b;
  margin-bottom: 14px;
}

#symfiny-about #waterkeeper-pledge-title {
  margin: 0 auto 16px !important;
  color: #fcfbf6 !important;
  font-family: var(--serif) !important;
  font-size: clamp(42px,5.5vw,70px) !important;
  line-height: 1.02 !important;
  font-weight: 500 !important;
  letter-spacing: -.03em !important;
}

#symfiny-about #waterkeeper-pledge-title em {
  color: #8db9b4 !important;
  font-style: italic;
}

#symfiny-about .sf-pledge-lead {
  max-width: 650px;
  margin: 0 auto 34px !important;
  color: rgba(252,251,246,.84) !important;
  font-size: 15px !important;
  line-height: 1.8 !important;
}

#symfiny-about .sf-pledge-promises {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 10px;
  text-align: left;
  margin: 0 auto 28px;
  max-width: 700px;
}

#symfiny-about .sf-pledge-promises label {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 68px;
  padding: 14px 16px;
  border: 1px solid rgba(244,241,232,.16);
  border-radius: 15px;
  background: rgba(7,28,25,.42);
  color: #fcfbf6;
  cursor: pointer;
  transition: border-color .25s ease,background .25s ease,transform .25s ease;
}

#symfiny-about .sf-pledge-promises label:hover {
  transform: translateY(-2px);
  border-color: rgba(185,154,99,.55);
  background: rgba(244,241,232,.08);
}

#symfiny-about .sf-pledge-promises input {
  appearance: none;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  border: 1px solid rgba(244,241,232,.45);
  border-radius: 5px;
  background: transparent;
  position: relative;
  cursor: pointer;
}

#symfiny-about .sf-pledge-promises input:checked {
  background: #b99a63;
  border-color: #b99a63;
}

#symfiny-about .sf-pledge-promises input:checked:after {
  content: "";
  position: absolute;
  left: 3px;
  top: -1px;
  color: #102f2b;
  font-weight: 900;
  font-size: 14px;
}

#symfiny-about .sf-pledge-promises span {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fcfbf6 !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  font-weight: 600;
}

#symfiny-about .sf-pledge-promises b {
  color: #d4b77b;
  font-size: 9px;
  letter-spacing: .14em;
}

#symfiny-about .sf-pledge-submit {
  border: 0;
  cursor: pointer;
  min-height: 50px;
  padding: 0 22px;
  box-shadow: 0 12px 30px rgba(185,154,99,.20);
}

#symfiny-about .sf-pledge-status {
  min-height: 22px;
  margin: 16px 0 0 !important;
  color: #bfe0d8 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .04em;
}

#symfiny-about .sf-comic-end {
  width: min(900px,calc(100% - 48px));
  margin: 30px auto 0;
  padding: 42px 20px 10px;
  text-align: center;
}

#symfiny-about .sf-comic-end-line {
  width: 70px;
  height: 1px;
  margin: 0 auto 20px;
  background: linear-gradient(90deg,transparent,#b99a63,transparent);
}

#symfiny-about .sf-comic-end p {
  margin: 0 0 18px;
  color: rgba(16,47,43,.65);
  font-family: var(--serif);
  font-size: 22px;
}

#symfiny-about .sf-comic-close-bottom {
  border: 1px solid rgba(16,47,43,.20) !important;
  background: #102f2b !important;
  color: #f4f1e8 !important;
  cursor: pointer !important;
  position: relative;
  z-index: 20;
}

#symfiny-about .sf-comic-close-bottom:hover {
  background: #174c45 !important;
  transform: translateY(-2px);
}

@media (max-width:900px) {
  #symfiny-about .sf-menu {
    gap: 14px;
  }
  #symfiny-about .sf-menu > a,
  #symfiny-about .sf-nav-dropdown-toggle {
    font-size: 10px;
    letter-spacing: .06em;
  }
}

@media (max-width:760px) {
  #symfiny-about .sf-header {
    padding: 12px 0;
  }
  #symfiny-about .sf-header.sf-scrolled {
    padding: 8px 0;
  }
  #symfiny-about .sf-nav {
    width: calc(100% - 28px);
    padding: 0;
  }
  #symfiny-about .sf-logo {
    width: 105px;
  }
  #symfiny-about .sf-menu {
    position: absolute;
    left: 14px;
    right: 14px;
    top: calc(100% + 10px);
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    margin: 0;
    padding: 10px;
    border: 1px solid rgba(244,241,232,.14);
    border-radius: 18px;
    background: rgba(7,28,25,.97);
    box-shadow: 0 24px 60px rgba(0,0,0,.28);
    backdrop-filter: blur(20px);
  }
  #symfiny-about .sf-menu.sf-open {
    display: flex;
  }
  #symfiny-about .sf-menu > a,
  #symfiny-about .sf-nav-dropdown-toggle {
    width: 100%;
    min-height: 44px;
    padding: 12px 13px;
    text-align: left;
    font-size: 10px;
    letter-spacing: .09em;
    border-radius: 10px;
  }
  #symfiny-about .sf-menu > a:hover,
  #symfiny-about .sf-nav-dropdown-toggle:hover {
    background: rgba(141,185,180,.08);
    transform: none;
  }
  #symfiny-about .sf-nav-dropdown {
    width: 100%;
    display: block;
  }
  #symfiny-about .sf-nav-dropdown-toggle {
    justify-content: space-between;
  }
  #symfiny-about .sf-nav-dropdown-panel {
    position: static;
    width: 100%;
    transform: none;
    display: none;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    padding: 3px 0 4px 9px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
  }
  #symfiny-about .sf-nav-dropdown.is-open .sf-nav-dropdown-panel {
    display: flex;
  }
  #symfiny-about .sf-nav-dropdown-panel a {
    min-height: 38px;
    padding: 9px 11px;
    border-left: 1px solid rgba(185,154,99,.42);
    border-radius: 0 9px 9px 0;
    font-size: 9px !important;
    color: rgba(250,249,245,.72) !important;
  }
  #symfiny-about .sf-enquire {
    display: none;
  }
  #symfiny-about .sf-mobile-toggle {
    display: block;
  }
  #symfiny-about .sf-way-photo {
    top: 40px;
    height: 92px;
  }
  #symfiny-about .sf-vision-card h3 {
    margin-top: 150px !important;
  }
  #symfiny-about .sf-pledge-inner {
    padding: 42px 20px;
  }
  #symfiny-about .sf-pledge-promises {
    grid-template-columns: 1fr;
  }
  #symfiny-about .sf-waterkeeper-pledge {
    padding: 80px 14px;
  }
}


/* ---- SYMFINY V4 ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â ACTUAL LIVE-PAGE FIX ---- */

#symfiny-about {
  --sf-ink: #102f2b;
  --sf-deep: #071d1b;
  --sf-green: #174c45;
  --sf-mist: #8db9b4;
  --sf-cream: #f4f1e8;
  --sf-gold: #b99a63;
}


/* ---- UNIVERSAL CONTRAST RESET ---- */

#symfiny-about .sf-story,
#symfiny-about .sf-meaning,
#symfiny-about .sf-farm,
#symfiny-about .sf-fish,
#symfiny-about .sf-ethics {
  color: var(--sf-ink) !important;
}

#symfiny-about .sf-story h1,
#symfiny-about .sf-story h2,
#symfiny-about .sf-story h3,
#symfiny-about .sf-story h4,
#symfiny-about .sf-story p,
#symfiny-about .sf-story li,
#symfiny-about .sf-story-copy,
#symfiny-about .sf-story-copy *:not(.sf-story-side-card *),
#symfiny-about .sf-meaning h1,
#symfiny-about .sf-meaning h2,
#symfiny-about .sf-meaning h3,
#symfiny-about .sf-farm h1,
#symfiny-about .sf-farm h2,
#symfiny-about .sf-farm h3,
#symfiny-about .sf-farm p,
#symfiny-about .sf-fish h1,
#symfiny-about .sf-fish h2,
#symfiny-about .sf-fish h3,
#symfiny-about .sf-fish p,
#symfiny-about .sf-ethics h1,
#symfiny-about .sf-ethics h2,
#symfiny-about .sf-ethics h3,
#symfiny-about .sf-ethics p {
  text-shadow: none !important;
}

#symfiny-about .sf-story-copy p {
  color: rgba(16,47,43,.86) !important;
  opacity: 1 !important;
  font-size: 16px !important;
  line-height: 1.95 !important;
}

#symfiny-about .sf-story-lead {
  opacity: 1 !important;
}

#symfiny-about .sf-story-title span {
  color: #174c45 !important;
}

#symfiny-about .sf-story .sf-eyebrow {
  color: #8c6b3c !important;
}

#symfiny-about .sf-story-quote {
  color: #174c45 !important;
}

#symfiny-about .sf-philosophy,
#symfiny-about .sf-vision,
#symfiny-about .sf-story-video-section,
#symfiny-about .sf-water-turn,
#symfiny-about .sf-bros-intro,
#symfiny-about .sf-dream,
#symfiny-about .sf-footer {
  color: #f4f1e8 !important;
}

#symfiny-about .sf-philosophy h1,
#symfiny-about .sf-philosophy h2,
#symfiny-about .sf-philosophy h3,
#symfiny-about .sf-philosophy p,
#symfiny-about .sf-vision h1,
#symfiny-about .sf-vision h2,
#symfiny-about .sf-vision h3,
#symfiny-about .sf-vision p,
#symfiny-about .sf-story-video-section h1,
#symfiny-about .sf-story-video-section h2,
#symfiny-about .sf-story-video-section h3,
#symfiny-about .sf-story-video-section p,
#symfiny-about .sf-bros-intro h1,
#symfiny-about .sf-bros-intro h2,
#symfiny-about .sf-bros-intro h3,
#symfiny-about .sf-bros-intro p,
#symfiny-about .sf-dream h1,
#symfiny-about .sf-dream h2,
#symfiny-about .sf-dream h3,
#symfiny-about .sf-dream p,
#symfiny-about .sf-footer h1,
#symfiny-about .sf-footer h2,
#symfiny-about .sf-footer h3,
#symfiny-about .sf-footer p {
  opacity: 1 !important;
}

#symfiny-about .sf-philosophy h2,
#symfiny-about .sf-vision h2,
#symfiny-about .sf-story-video-section h2,
#symfiny-about .sf-bros-intro h2,
#symfiny-about .sf-dream h2,
#symfiny-about .sf-footer h2 {
  color: #f4f1e8 !important;
}

#symfiny-about .sf-philosophy h2 span,
#symfiny-about .sf-vision h2 span,
#symfiny-about .sf-dream h2 span,
#symfiny-about .sf-footer h2 span {
  color: #8db9b4 !important;
}

#symfiny-about .sf-philosophy-copy p,
#symfiny-about .sf-vision-intro,
#symfiny-about .sf-vision-card p,
#symfiny-about .sf-vision-belief,
#symfiny-about .sf-video-intro p,
#symfiny-about .sf-bros-intro p,
#symfiny-about .sf-dream p,
#symfiny-about .sf-footer p {
  color: rgba(244,241,232,.84) !important;
}


/* ---- STORY: BALANCED EDITORIAL SPREAD ---- */

#symfiny-about .sf-story-layout {
  display: grid !important;
  grid-template-columns: minmax(0,1.08fr) minmax(360px,.92fr) !important;
  gap: 64px !important;
  align-items: start !important;
  margin-top: 20px !important;
}

#symfiny-about .sf-story-copy {
  min-width: 0 !important;
  max-width: 720px !important;
  margin: 0 !important;
  padding: 0 0 25px !important;
  color: #102f2b !important;
}

#symfiny-about .sf-story-copy p {
  margin-bottom: 24px !important;
}

#symfiny-about .sf-story-marker {
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  margin: 2px 0 30px !important;
  color: #8c6b3c !important;
}

#symfiny-about .sf-story-marker span {
  font-size: 9px !important;
  letter-spacing: .20em !important;
  font-weight: 800 !important;
}

#symfiny-about .sf-story-marker i {
  display: block !important;
  width: 42px !important;
  height: 1px !important;
  background: #b99a63 !important;
}

#symfiny-about .sf-story-marker small {
  font-size: 9px !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: rgba(16,47,43,.48) !important;
}

#symfiny-about .sf-story-aside {
  position: relative !important;
  top: auto !important;
  min-height: 680px !important;
  display: block !important;
  align-self: start !important;
}

#symfiny-about .sf-story-side-card {
  outline: 1px solid rgba(16,47,43,.10) !important;
  transform: none !important;
}

#symfiny-about .sf-story-side-card:first-child {
  width: 78% !important;
  height: 355px !important;
  top: 0 !important;
  right: 0 !important;
  z-index: 2 !important;
  transform: rotate(1.15deg) !important;
}

#symfiny-about .sf-story-side-card:nth-child(2) {
  width: 76% !important;
  height: 315px !important;
  left: 0 !important;
  bottom: 22px !important;
  z-index: 3 !important;
  transform: rotate(-1.35deg) !important;
}

#symfiny-about .sf-story-side-card img {
  transition: transform .8s cubic-bezier(.2,.8,.2,1) !important;
}

#symfiny-about .sf-story-side-card:first-child img {
  object-position: center 52% !important;
}

#symfiny-about .sf-story-side-card:nth-child(2) img {
  object-position: center 48% !important;
}

#symfiny-about .sf-story-side-card:hover img {
  transform: scale(1.045) !important;
}

#symfiny-about .sf-story-side-card:after {
  background: linear-gradient(180deg,transparent 48%,rgba(7,29,27,.74) 100%) !important;
}

#symfiny-about .sf-story-side-card figcaption {
  left: 18px !important;
  right: 18px !important;
  bottom: 16px !important;
}

#symfiny-about .sf-story-side-card figcaption strong {
  color: #fffdf5 !important;
}

#symfiny-about .sf-story-side-card figcaption small {
  color: rgba(255,253,245,.78) !important;
}

#symfiny-about .sf-story-copy .sf-story-photo {
  margin: 58px 0 !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  box-shadow: 0 22px 55px rgba(16,47,43,.14) !important;
}

#symfiny-about .sf-story-copy .sf-story-photo img {
  width: 100% !important;
  height: 360px !important;
  object-fit: cover !important;
}


/* ---- MEANING / FARM / FISH LIGHT SURFACES ---- */

#symfiny-about .sf-meaning .sf-title,
#symfiny-about .sf-farm h2,
#symfiny-about .sf-fish h2 {
  color: #102f2b !important;
}

#symfiny-about .sf-meaning .sf-title span,
#symfiny-about .sf-farm h2 span {
  color: #174c45 !important;
}

#symfiny-about .sf-meaning-copy,
#symfiny-about .sf-meaning-copy p,
#symfiny-about .sf-farm p,
#symfiny-about .sf-fish-intro {
  color: rgba(16,47,43,.82) !important;
}

#symfiny-about .sf-meaning .sf-eyebrow,
#symfiny-about .sf-farm .sf-eyebrow,
#symfiny-about .sf-fish .sf-eyebrow {
  color: #8c6b3c !important;
}


/* ---- VISION: KEEP IT LEGIBLE, LESS BUSY ---- */

#symfiny-about .sf-vision-card h3 {
  color: #f4f1e8 !important;
}

#symfiny-about .sf-vision-card p {
  color: rgba(244,241,232,.78) !important;
}

#symfiny-about .sf-vision-belief strong {
  color: #f4f1e8 !important;
}

#symfiny-about .sf-belief-label {
  color: #d2b47d !important;
}


/* ---- ETHICS: LIGHT, READABLE, DISTINCT ---- */

#symfiny-about .sf-ethics {
  background: linear-gradient(180deg,#f4f1e8,#e9e5d9) !important;
  color: #102f2b !important;
}

#symfiny-about .sf-ethics h2,
#symfiny-about .sf-principle h3 {
  color: #102f2b !important;
}

#symfiny-about .sf-ethics h2 span {
  color: #174c45 !important;
}

#symfiny-about .sf-ethics-intro,
#symfiny-about .sf-principle p {
  color: rgba(16,47,43,.76) !important;
}

#symfiny-about .sf-principle {
  background: rgba(255,255,255,.52) !important;
  border-color: rgba(16,47,43,.12) !important;
}


/* ---- WATER BROS: CLEANER CHARACTER STAGE ---- */

#symfiny-about .sf-bros-intro {
  padding: 105px 0 70px !important;
}

#symfiny-about .sf-bros-buttons {
  margin-top: 26px !important;
}

#symfiny-about .sf-bros-together {
  height: 300px !important;
  margin: 18px auto 0 !important;
}

#symfiny-about .sf-bro-together {
  width: min(430px,65vw) !important;
  height: 290px !important;
  bottom: 0 !important;
}

#symfiny-about .sf-bros-together:before {
  width: 380px !important;
  height: 62px !important;
}

#symfiny-about .sf-bros-ripple.ripple-a {
  width: 290px !important;
}

#symfiny-about .sf-bros-ripple.ripple-b {
  width: 360px !important;
}

#symfiny-about .sf-bros-ripple.ripple-c {
  width: 420px !important;
}


/* ---- FISH: STOP GIANT TEXT/IMAGE COLLISIONS ---- */

#symfiny-about .sf-fish-card {
  height: 530px !important;
  min-height: 530px !important;
  border-radius: 22px !important;
}

#symfiny-about .sf-fish-info {
  background: rgba(7,31,29,.84) !important;
  color: #f4f1e8 !important;
}

#symfiny-about .sf-fish-name {
  color: #fffdf5 !important;
}

#symfiny-about .sf-fish-personality {
  color: rgba(244,241,232,.84) !important;
}

#symfiny-about .sf-fish-spec strong {
  color: #fffdf5 !important;
}

#symfiny-about .sf-fish-note {
  color: rgba(244,241,232,.78) !important;
}


/* ---- BUTTONS ---- */

#symfiny-about .sf-btn {
  white-space: nowrap !important;
}

#symfiny-about .sf-btn-gold {
  color: #102f2b !important;
}

#symfiny-about .sf-btn-glass {
  color: #f4f1e8 !important;
}


/* ---- TABLET / MOBILE ---- */

@media (max-width:900px) {
  #symfiny-about .sf-story-layout {
    grid-template-columns: 1fr !important;
    gap: 42px !important;
  }
  #symfiny-about .sf-story-aside {
    min-height: 560px !important;
    max-width: 680px !important;
    width: 100% !important;
    margin: 0 auto !important;
  }
  #symfiny-about .sf-story-side-card:first-child {
    width: 72% !important;
    height: 310px !important;
  }
  #symfiny-about .sf-story-side-card:nth-child(2) {
    width: 70% !important;
    height: 280px !important;
    bottom: 0 !important;
  }
}

@media (max-width:600px) {
  #symfiny-about .sf-story-layout {
    gap: 30px !important;
  }
  #symfiny-about .sf-story-aside {
    min-height: 485px !important;
  }
  #symfiny-about .sf-story-side-card:first-child {
    width: 82% !important;
    height: 275px !important;
  }
  #symfiny-about .sf-story-side-card:nth-child(2) {
    width: 78% !important;
    height: 240px !important;
  }
  #symfiny-about .sf-story-side-card figcaption strong {
    font-size: 17px !important;
  }
  #symfiny-about .sf-story-copy .sf-story-photo img {
    height: 300px !important;
  }
  #symfiny-about .sf-bros-together {
    height: 255px !important;
  }
  #symfiny-about .sf-bro-together {
    width: min(360px,92vw) !important;
    height: 245px !important;
  }
  #symfiny-about .sf-bros-together:before {
    width: 290px !important;
  }
  #symfiny-about .sf-bros-ripple.ripple-a {
    width: 230px !important;
  }
  #symfiny-about .sf-bros-ripple.ripple-b {
    width: 290px !important;
  }
  #symfiny-about .sf-bros-ripple.ripple-c {
    width: 340px !important;
  }
}

@media (prefers-reduced-motion:reduce) {
  #symfiny-about .sf-story-side-card img,
  #symfiny-about .sf-bro-together,
  #symfiny-about .sf-bros-ripple,
  #symfiny-about .sf-bros-together:before {
    animation: none !important;
    transition: none !important;
  }
}


/* ---- STORY: 2 PHOTOS LEFT + TEXT CENTRE + 2 PHOTOS RIGHT ---- */

#symfiny-about .sf-story-four-sides {
  display: grid !important;
  grid-template-columns: 220px minmax(0,680px) 220px !important;
  column-gap: clamp(30px,5vw,80px) !important;
  align-items: start !important;
  width: min(100%,1380px) !important;
  box-sizing: border-box !important;
  margin: 0 auto !important;
  padding: 35px 24px 110px !important;
  position: relative !important;
}

#symfiny-about .sf-story-four-sides .sf-story-copy {
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: 100% !important;
  max-width: 680px !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 5 !important;
}

#symfiny-about .sf-story-four-sides .sf-story-left {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

#symfiny-about .sf-story-four-sides .sf-story-right {
  grid-column: 3 !important;
  grid-row: 1 !important;
}

#symfiny-about .sf-story-side {
  display: flex !important;
  flex-direction: column !important;
  min-height: 1100px !important;
  position: relative !important;
  z-index: 2 !important;
}

#symfiny-about .sf-story-side-card {
  position: relative !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
  background: #fffdf5 !important;
  border: 1px solid rgba(23,63,57,.22) !important;
  border-radius: 15px !important;
  box-shadow: 0 16px 38px rgba(16,47,43,.13) !important;
}

#symfiny-about .sf-story-side-card img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

#symfiny-about .sf-story-side-card figcaption {
  display: block !important;
  box-sizing: border-box !important;
  padding: 8px 10px 9px !important;
  color: #173f39 !important;
  background: #fffdf5 !important;
  font-size: 8px !important;
  line-height: 1.25 !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;
  opacity: 1 !important;
}

#symfiny-about .side-left-1 {
  width: 205px !important;
  height: 275px !important;
  align-self: flex-end !important;
  margin-top: 105px !important;
  transform: rotate(-3deg) !important;
}

#symfiny-about .side-left-2 {
  width: 215px !important;
  height: 285px !important;
  align-self: flex-start !important;
  margin-top: 300px !important;
  transform: rotate(3deg) !important;
}

#symfiny-about .side-right-1 {
  width: 215px !important;
  height: 285px !important;
  align-self: flex-start !important;
  margin-top: 40px !important;
  transform: rotate(3deg) !important;
}

#symfiny-about .side-right-2 {
  width: 205px !important;
  height: 275px !important;
  align-self: flex-end !important;
  margin-top: 300px !important;
  transform: rotate(-3deg) !important;
}

#symfiny-about .sf-story-four-sides .sf-story-copy p {
  color: #173f39 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  font-size: 16px !important;
  line-height: 1.9 !important;
  max-width: 680px !important;
  margin-bottom: 22px !important;
}

#symfiny-about .sf-story-four-sides .sf-story-copy .sf-story-lead {
  color: #173f39 !important;
  font-size: 17px !important;
  line-height: 1.85 !important;
}

#symfiny-about .sf-story-four-sides .sf-story-quote {
  color: #174c45 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  border-left: 1px solid #b99a63 !important;
  padding: 18px 0 18px 18px !important;
  margin: 55px 0 !important;
  font-size: clamp(38px,4vw,58px) !important;
  line-height: 1.02 !important;
}

#symfiny-about .sf-story-four-sides .sf-story-marker span,
#symfiny-about .sf-story-four-sides .sf-story-marker small {
  color: #5f8f82 !important;
  opacity: 1 !important;
}

#symfiny-about .sf-story-four-sides .sf-story-marker i {
  background: #b99a63 !important;
  opacity: 1 !important;
}

#symfiny-about .sf-story-four-sides .sf-story-photo,
#symfiny-about .sf-story-four-sides .sf-story-pile,
#symfiny-about .sf-story-four-sides .sf-pile-label {
  display: none !important;
}

@media (max-width:1120px) {
  #symfiny-about .sf-story-four-sides {
    grid-template-columns: 165px minmax(0,1fr) 165px !important;
    column-gap: 24px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  #symfiny-about .side-left-1,
  #symfiny-about .side-left-2,
  #symfiny-about .side-right-1,
  #symfiny-about .side-right-2 {
    width: 145px !important;
  }
}

@media (max-width:760px) {
  #symfiny-about .sf-story-four-sides {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    padding: 20px 18px 70px !important;
  }
  #symfiny-about .sf-story-four-sides .sf-story-copy {
    order: 1 !important;
    max-width: 100% !important;
  }
  #symfiny-about .sf-story-four-sides .sf-story-left {
    order: 2 !important;
  }
  #symfiny-about .sf-story-four-sides .sf-story-right {
    order: 3 !important;
  }
  #symfiny-about .sf-story-side {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
    min-height: 0 !important;
    width: 100% !important;
    margin: 20px 0 !important;
  }
  #symfiny-about .sf-story-side-card,
  #symfiny-about .side-left-1,
  #symfiny-about .side-left-2,
  #symfiny-about .side-right-1,
  #symfiny-about .side-right-2 {
    width: 100% !important;
    height: 190px !important;
    margin: 0 !important;
    transform: none !important;
  }
  #symfiny-about .sf-story-four-sides .sf-story-copy p {
    font-size: 15px !important;
    line-height: 1.85 !important;
  }
}

#symfiny-about .sf-bros-originals {
  position: relative !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 330px !important;
  margin: 10px auto 0 !important;
}

#symfiny-about .sf-bros-originals .sf-bro-together {
  position: relative !important;
  display: block !important;
  width: auto !important;
  height: 330px !important;
  max-width: 82vw !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center bottom !important;
  transform: none !important;
  margin: 0 auto !important;
  z-index: 4 !important;
}

#symfiny-about .sf-bros-originals .sf-bros-ripple {
  z-index: 1 !important;
}

@media (max-width:760px) {
  #symfiny-about .sf-bros-originals {
    min-height: 280px !important;
  }
  #symfiny-about .sf-bros-originals .sf-bro-together {
    height: 280px !important;
    max-width: 92vw !important;
  }
}

#symfiny-about .sf-bros-intro .sf-bros-visual.sf-bros-together {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 28px auto 0 !important;
  padding: 0 !important;
  transform: none !important;
  text-align: center !important;
  z-index: 5 !important;
}

#symfiny-about .sf-bros-intro .sf-bros-visual.sf-bros-together .sf-bro-together {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  display: block !important;
  width: auto !important;
  height: 360px !important;
  max-width: 78vw !important;
  max-height: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center top !important;
  transform-origin: center bottom !important;
  z-index: 4 !important;
  animation: sfBrosDramaticEntrance 1.5s cubic-bezier(.16,1,.3,1) both, sfBrosFloat 5.5s ease-in-out 1.5s infinite !important;
  filter: drop-shadow(0 22px 28px rgba(0,0,0,.20)) !important;
}

#symfiny-about .sf-bros-intro .sf-bros-visual.sf-bros-together .sf-bros-ripple {
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  bottom: 2px !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

#symfiny-about .sf-bros-intro .sf-bros-buttons {
  position: relative !important;
  z-index: 8 !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

@media (max-width:760px) {
  #symfiny-about .sf-bros-intro .sf-bros-visual.sf-bros-together {
    margin-top: 22px !important;
  }
  #symfiny-about .sf-bros-intro .sf-bros-visual.sf-bros-together .sf-bro-together {
    height: 290px !important;
    max-width: 92vw !important;
  }
}

#symfiny-about .sf-comic .sf-comic-together {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

#symfiny-about .sf-comic .sf-comic-single:has(.sf-comic-together) {
  display: none !important;
}


/* ---- SYMFINY V16 ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â FINAL RESPONSIVE / STORY FIX ---- */

#symfiny-about {
  width: 100vw !important;
  max-width: none !important;
  overflow-x: hidden !important;
}

#symfiny-about .sf-container {
  width: min(1180px,calc(100vw - 48px)) !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#symfiny-about .sf-story {
  overflow: hidden !important;
  padding: 118px 0 90px !important;
  background: #f4f1e8 !important;
}

#symfiny-about .sf-story-title {
  max-width: 920px !important;
  color: #102f2b !important;
}

#symfiny-about .sf-story-lead {
  max-width: 820px !important;
  color: #173f39 !important;
  font-size: 17px !important;
  line-height: 1.9 !important;
}

#symfiny-about .sf-story-main {
  position: relative !important;
  width: 100% !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
  min-height: 760px !important;
}

#symfiny-about .sf-story-main-copy {
  width: min(760px,100%) !important;
  max-width: 760px !important;
  margin: 0 auto !important;
  padding: 25px 0 45px !important;
  position: relative !important;
  z-index: 5 !important;
}

#symfiny-about .sf-story-main-copy p {
  color: #173f39 !important;
  opacity: 1 !important;
  font-size: 16px !important;
  line-height: 1.9 !important;
  margin: 0 0 22px !important;
  max-width: 760px !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}

#symfiny-about .sf-story-main-copy .sf-story-quote {
  color: #174c45 !important;
  opacity: 1 !important;
  margin: 55px 0 20px !important;
  padding: 18px 0 18px 18px !important;
  border-left: 1px solid #b99a63 !important;
  font-family: var(--serif) !important;
  font-size: clamp(38px,4vw,58px) !important;
  line-height: 1.02 !important;
}

#symfiny-about .sf-story-memory-rail {
  position: absolute !important;
  top: 0 !important;
  width: 175px !important;
  min-height: 700px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 155px !important;
  z-index: 2 !important;
}

#symfiny-about .sf-story-memory-left {
  left: 0 !important;
}

#symfiny-about .sf-story-memory-right {
  right: 0 !important;
}

#symfiny-about .sf-story-memory-card {
  position: relative !important;
  width: 170px !important;
  height: 225px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 6px solid #fffdf5 !important;
  border-radius: 15px !important;
  background: #fffdf5 !important;
  box-shadow: 0 18px 40px rgba(16,47,43,.14) !important;
}

#symfiny-about .sf-story-memory-card:nth-child(2) {
  align-self: flex-end !important;
}

#symfiny-about .sf-story-memory-card img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

#symfiny-about .sf-story-memory-card figcaption {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  padding: 9px 10px !important;
  color: #fffdf5 !important;
  background: linear-gradient(180deg,transparent,rgba(7,29,27,.78)) !important;
  font-size: 9px !important;
  line-height: 1.25 !important;
}

#symfiny-about .sf-postquote-spread {
  width: 100% !important;
  max-width: 1180px !important;
  margin: 10px auto 0 !important;
  display: grid !important;
  grid-template-columns: 175px minmax(0,760px) 175px !important;
  column-gap: 35px !important;
  align-items: start !important;
}

#symfiny-about .sf-postquote-copy {
  width: 100% !important;
  max-width: 760px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

#symfiny-about .sf-postquote-copy p {
  color: #173f39 !important;
  opacity: 1 !important;
  font-size: 16px !important;
  line-height: 1.9 !important;
  margin: 0 0 22px !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}

#symfiny-about .sf-postquote-photo-column {
  display: flex !important;
  flex-direction: column !important;
  gap: 145px !important;
  width: 175px !important;
}

#symfiny-about .sf-postquote-photo {
  display: block !important;
  width: 170px !important;
  height: 220px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 6px solid #fffdf5 !important;
  border-radius: 15px !important;
  background: #fffdf5 !important;
  box-shadow: 0 18px 40px rgba(16,47,43,.14) !important;
}

#symfiny-about .sf-postquote-photo img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

#symfiny-about .postquote-new-left-1 {
  transform: rotate(-3deg) !important;
  align-self: flex-end !important;
}

#symfiny-about .postquote-new-left-2 {
  transform: rotate(3deg) !important;
  align-self: flex-start !important;
}

#symfiny-about .postquote-new-right-1 {
  transform: rotate(3deg) !important;
  align-self: flex-start !important;
}

#symfiny-about .postquote-new-right-2 {
  transform: rotate(-3deg) !important;
  align-self: flex-end !important;
}

#symfiny-about .sf-watch-water-v16 {
  background: #102f2b !important;
  padding: 92px 0 105px !important;
}

#symfiny-about .sf-watch-water-v16 .sf-video-intro h2 {
  color: #f4f1e8 !important;
  opacity: 1 !important;
}

#symfiny-about .sf-watch-water-v16 .sf-video-intro p {
  color: rgba(244,241,232,.80) !important;
  opacity: 1 !important;
}

#symfiny-about .sf-watch-water-v16 .sf-video-frame {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 26px !important;
  box-shadow: 0 28px 65px rgba(0,0,0,.22) !important;
}

#symfiny-about .sf-watch-water-v16 .sf-video-frame video {
  display: block !important;
  width: 100% !important;
  height: min(68vh,720px) !important;
  min-height: 380px !important;
  object-fit: cover !important;
}

#symfiny-about .sf-fish-card img[alt="Guppies"] {
  display: block !important;
}

@media (max-width:1180px) {
  #symfiny-about .sf-story-main,
  #symfiny-about .sf-postquote-spread {
    max-width: 100% !important;
  }
  #symfiny-about .sf-story-memory-rail {
    width: 135px !important;
  }
  #symfiny-about .sf-story-memory-card {
    width: 130px !important;
    height: 190px !important;
  }
  #symfiny-about .sf-postquote-spread {
    grid-template-columns: 140px minmax(0,1fr) 140px !important;
    column-gap: 24px !important;
  }
  #symfiny-about .sf-postquote-photo-column {
    width: 140px !important;
  }
  #symfiny-about .sf-postquote-photo {
    width: 135px !important;
    height: 185px !important;
  }
  #symfiny-about .sf-story-main-copy,
  #symfiny-about .sf-postquote-copy {
    max-width: 650px !important;
  }
}

@media (max-width:900px) {
  #symfiny-about .sf-story-memory-rail {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 18px !important;
    margin: 0 auto 30px !important;
  }
  #symfiny-about .sf-story-memory-card {
    width: 100% !important;
    max-width: none !important;
    height: 220px !important;
  }
  #symfiny-about .sf-story-memory-card:nth-child(2) {
    align-self: auto !important;
  }
  #symfiny-about .sf-story-main {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
  }
  #symfiny-about .sf-story-memory-left {
    order: 1 !important;
  }
  #symfiny-about .sf-story-main-copy {
    order: 2 !important;
    max-width: 760px !important;
  }
  #symfiny-about .sf-story-memory-right {
    order: 3 !important;
  }
  #symfiny-about .sf-postquote-spread {
    grid-template-columns: 1fr !important;
    row-gap: 28px !important;
  }
  #symfiny-about .sf-postquote-copy {
    order: 1 !important;
    max-width: 760px !important;
    margin: 0 auto !important;
  }
  #symfiny-about .sf-postquote-photo-column {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 16px !important;
  }
  #symfiny-about .sf-postquote-photo-left {
    order: 2 !important;
  }
  #symfiny-about .sf-postquote-photo-right {
    order: 3 !important;
  }
  #symfiny-about .sf-postquote-photo {
    width: 100% !important;
    height: 240px !important;
    transform: none !important;
  }
  #symfiny-about .sf-watch-water-v16 {
    padding: 72px 0 82px !important;
  }
  #symfiny-about .sf-watch-water-v16 .sf-video-frame video {
    height: 58vh !important;
    min-height: 330px !important;
  }
}

@media (max-width:600px) {
  #symfiny-about .sf-container {
    width: calc(100vw - 30px) !important;
  }
  #symfiny-about .sf-story {
    padding: 88px 0 65px !important;
  }
  #symfiny-about .sf-story-title {
    font-size: clamp(44px,13vw,65px) !important;
  }
  #symfiny-about .sf-story-lead {
    font-size: 15px !important;
    line-height: 1.85 !important;
  }
  #symfiny-about .sf-story-memory-rail {
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }
  #symfiny-about .sf-story-memory-card {
    height: 175px !important;
    border-width: 4px !important;
    border-radius: 12px !important;
  }
  #symfiny-about .sf-story-main-copy p,
  #symfiny-about .sf-postquote-copy p {
    font-size: 15px !important;
    line-height: 1.85 !important;
  }
  #symfiny-about .sf-postquote-photo-column {
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }
  #symfiny-about .sf-postquote-photo {
    height: 165px !important;
    border-width: 4px !important;
    border-radius: 12px !important;
  }
  #symfiny-about .sf-watch-water-v16 {
    padding: 62px 0 70px !important;
  }
  #symfiny-about .sf-watch-water-v16 .sf-video-frame {
    border-radius: 18px !important;
  }
  #symfiny-about .sf-watch-water-v16 .sf-video-frame video {
    height: 56vh !important;
    min-height: 280px !important;
  }
}

@media (prefers-reduced-motion:reduce) {
  #symfiny-about .sf-story-memory-card img {
    transition: none !important;
  }
}


/* ---- SYMFINY ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â MOBILE / PHONE FRIENDLY PASS ---- */

#symfiny-about .sf-mobile-menu,
#symfiny-about .sf-mobile-drawer {
  display: none;
}

@media (max-width:700px) {
  #symfiny-about .sf-header {
    padding: 7px 0 !important;
    height: 62px !important;
    background: rgba(7,29,27,.94) !important;
    backdrop-filter: blur(20px) saturate(125%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(125%) !important;
  }
  #symfiny-about .sf-header.hide {
    transform: none !important;
  }
  #symfiny-about .sf-header-inner {
    width: calc(100vw - 28px) !important;
    height: 48px !important;
    gap: 12px !important;
  }
  #symfiny-about .sf-header-inner>a {
    display: flex !important;
    align-items: center !important;
    min-width: 0 !important;
  }
  #symfiny-about .sf-logo {
    height: 42px !important;
  }
  #symfiny-about .sf-nav {
    display: none !important;
  }
  #symfiny-about .sf-mobile-menu {
    display: flex !important;
    margin-left: auto !important;
    width: 43px !important;
    height: 43px !important;
    padding: 0 !important;
    border: 1px solid rgba(244,241,232,.22) !important;
    border-radius: 50% !important;
    background: rgba(244,241,232,.07) !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    gap: 5px !important;
    cursor: pointer !important;
    position: relative !important;
    z-index: 1003 !important;
  }
  #symfiny-about .sf-mobile-menu span {
    display: block !important;
    width: 17px !important;
    height: 1.5px !important;
    border-radius: 2px !important;
    background: #f4f1e8 !important;
    transition: transform .25s ease,opacity .25s ease !important;
  }
  #symfiny-about .sf-mobile-menu.is-open span:nth-child(1) {
    transform: translateY(6.5px) rotate(45deg) !important;
  }
  #symfiny-about .sf-mobile-menu.is-open span:nth-child(2) {
    opacity: 0 !important;
  }
  #symfiny-about .sf-mobile-menu.is-open span:nth-child(3) {
    transform: translateY(-6.5px) rotate(-45deg) !important;
  }
  #symfiny-about .sf-mobile-drawer {
    display: block !important;
    border-bottom: 1px solid rgba(244,241,232,.14) !important;
  }
  #symfiny-about .sf-mobile-drawer-inner {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    padding: 12px 5px 5px !important;
  }
  #symfiny-about .sf-mobile-label {
    padding: 6px 12px 10px !important;
    color: #b99a63 !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    letter-spacing: .2em !important;
  }
  #symfiny-about .sf-mobile-drawer a {
    display: block !important;
    padding: 13px 12px !important;
    border-top: 1px solid rgba(244,241,232,.08) !important;
    color: #f4f1e8 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .13em !important;
    text-transform: uppercase !important;
  }
  #symfiny-about {
    width: 100% !important;
    max-width: 100% !important;
    left: 0 !important;
    margin-left: 0 !important;
    overflow-x: hidden !important;
  }
  #symfiny-about .sf-container,
  #symfiny-about .sf-header-inner,
  #symfiny-about .sf-hero-content {
    width: calc(100% - 30px) !important;
    max-width: none !important;
  }
  #symfiny-about .sf-section,
  #symfiny-about .sf-philosophy,
  #symfiny-about .sf-vision,
  #symfiny-about .sf-story,
  #symfiny-about .sf-farm,
  #symfiny-about .sf-ethics,
  #symfiny-about .sf-fish {
    padding-top: 76px !important;
    padding-bottom: 76px !important;
  }
  #symfiny-about .sf-hero {
    min-height: 100svh !important;
  }
  #symfiny-about .sf-hero-content {
    padding-bottom: 48px !important;
  }
  #symfiny-about .sf-hero h1 {
    font-size: clamp(47px,14vw,67px) !important;
    line-height: .98 !important;
    letter-spacing: -.045em !important;
  }
  #symfiny-about .sf-hero-sub {
    max-width: 100% !important;
    font-size: 14px !important;
    line-height: 1.75 !important;
  }
  #symfiny-about .sf-eyebrow {
    font-size: 9px !important;
    letter-spacing: .17em !important;
  }
  #symfiny-about .sf-meaning-grid,
  #symfiny-about .sf-philosophy-grid,
  #symfiny-about .sf-vision-head,
  #symfiny-about .sf-farm-grid {
    grid-template-columns: 1fr !important;
    gap: 30px !important;
  }
  #symfiny-about .sf-meaning .sf-title,
  #symfiny-about .sf-philosophy .sf-title,
  #symfiny-about .sf-vision h2,
  #symfiny-about .sf-farm h2,
  #symfiny-about .sf-ethics h2 {
    font-size: clamp(40px,11vw,58px) !important;
    line-height: 1.02 !important;
  }
  #symfiny-about .sf-meaning-copy,
  #symfiny-about .sf-philosophy-copy p,
  #symfiny-about .sf-farm p,
  #symfiny-about .sf-vision-intro,
  #symfiny-about .sf-ethics-intro {
    font-size: 14px !important;
    line-height: 1.82 !important;
  }
  #symfiny-about .sf-image-card img,
  #symfiny-about .sf-philosophy-media img {
    height: 330px !important;
  }
  #symfiny-about .sf-philosophy-media {
    min-height: 330px !important;
  }
  #symfiny-about .sf-vision-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  #symfiny-about .sf-vision-card {
    min-height: 0 !important;
    padding: 22px 19px !important;
  }
  #symfiny-about .sf-vision-card h3 {
    font-size: 25px !important;
    margin: 25px 0 9px !important;
  }
  #symfiny-about .sf-vision-card p {
    font-size: 12px !important;
    line-height: 1.7 !important;
  }
  #symfiny-about .sf-vision-belief {
    margin-top: 28px !important;
    padding: 22px !important;
    font-size: 14px !important;
  }
  #symfiny-about .sf-story {
    overflow: hidden !important;
  }
  #symfiny-about .sf-story-title {
    max-width: 100% !important;
    font-size: clamp(43px,12.5vw,62px) !important;
    line-height: 1 !important;
  }
  #symfiny-about .sf-story-lead {
    max-width: 100% !important;
    font-size: 14px !important;
    line-height: 1.8 !important;
    margin-bottom: 35px !important;
  }
  #symfiny-about .sf-story-main {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-height: 0 !important;
  }
  #symfiny-about .sf-story-memory-rail {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 9px !important;
    margin: 0 0 25px !important;
  }
  #symfiny-about .sf-story-memory-card {
    width: 100% !important;
    height: 155px !important;
    border: 4px solid #fffdf5 !important;
    border-radius: 11px !important;
  }
  #symfiny-about .sf-story-memory-card:nth-child(2) {
    align-self: auto !important;
  }
  #symfiny-about .sf-story-main-copy {
    order: 2 !important;
    width: 100% !important;
    max-width: none !important;
    padding-bottom: 20px !important;
  }
  #symfiny-about .sf-story-main-copy p,
  #symfiny-about .sf-postquote-copy p {
    font-size: 14.5px !important;
    line-height: 1.82 !important;
    margin-bottom: 18px !important;
  }
  #symfiny-about .sf-story-main-copy .sf-story-quote {
    font-size: clamp(30px,9vw,44px) !important;
    line-height: 1.06 !important;
    margin: 35px 0 25px !important;
    padding: 15px 0 15px 15px !important;
  }
  #symfiny-about .sf-postquote-spread {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
    margin-top: 5px !important;
  }
  #symfiny-about .sf-postquote-copy {
    order: 1 !important;
    width: 100% !important;
    max-width: none !important;
  }
  #symfiny-about .sf-postquote-photo-column {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 9px !important;
  }
  #symfiny-about .sf-postquote-photo-left {
    order: 2 !important;
  }
  #symfiny-about .sf-postquote-photo-right {
    order: 3 !important;
  }
  #symfiny-about .sf-postquote-photo {
    width: 100% !important;
    height: 155px !important;
    border: 4px solid #fffdf5 !important;
    border-radius: 11px !important;
    transform: none !important;
  }
  #symfiny-about .sf-video-intro {
    display: block !important;
    margin-bottom: 20px !important;
  }
  #symfiny-about .sf-video-intro h2 {
    font-size: clamp(37px,10vw,52px) !important;
  }
  #symfiny-about .sf-video-intro p {
    max-width: 100% !important;
    margin-top: 14px !important;
    font-size: 13px !important;
  }
  #symfiny-about .sf-video-frame {
    border-radius: 17px !important;
  }
  #symfiny-about .sf-video-frame video {
    height: 58svh !important;
    min-height: 270px !important;
    max-height: 520px !important;
  }
  #symfiny-about .sf-bros-intro {
    padding: 78px 0 65px !important;
  }
  #symfiny-about .sf-bros-logo {
    width: min(360px,88vw) !important;
    max-height: 170px !important;
    margin-bottom: 22px !important;
  }
  #symfiny-about .sf-bros-intro h2 {
    font-size: clamp(43px,12vw,60px) !important;
  }
  #symfiny-about .sf-bros-intro p {
    width: calc(100% - 10px) !important;
    font-size: 13px !important;
    line-height: 1.75 !important;
  }
  #symfiny-about .sf-bros-buttons {
    gap: 9px !important;
  }
  #symfiny-about .sf-btn {
    min-height: 46px !important;
    padding: 0 17px !important;
    font-size: 9px !important;
  }
  #symfiny-about .sf-bros-visual {
    height: 205px !important;
    margin-top: 40px !important;
    width: 100% !important;
  }
  #symfiny-about .sf-bro {
    height: 200px !important;
  }
  #symfiny-about .sf-bro.asher {
    left: 0 !important;
  }
  #symfiny-about .sf-bro.aidan {
    right: 0 !important;
  }
  #symfiny-about .sf-comic {
    padding: 55px 0 70px !important;
    overflow: hidden !important;
  }
  #symfiny-about .sf-comic-head {
    display: block !important;
    margin-bottom: 25px !important;
  }
  #symfiny-about .sf-comic-head h2 {
    font-size: clamp(42px,11vw,58px) !important;
    line-height: 1 !important;
  }
  #symfiny-about .sf-comic-actions {
    margin-top: 17px !important;
    gap: 7px !important;
  }
  #symfiny-about .sf-comic-btn {
    padding: 10px 12px !important;
    font-size: 9px !important;
  }
  #symfiny-about .sf-comic-chapter {
    padding: 40px 0 44px !important;
  }
  #symfiny-about .sf-comic-chapter:before {
    top: 19px !important;
    width: 48px !important;
  }
  #symfiny-about .sf-chapter-title {
    font-size: clamp(30px,8.5vw,44px) !important;
    line-height: 1.06 !important;
    margin: 10px 0 18px !important;
  }
  #symfiny-about .sf-comic-grid,
  #symfiny-about .sf-comic-chapter:nth-of-type(odd) .sf-comic-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    align-items: stretch !important;
  }
  #symfiny-about .sf-comic-panel {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 9px !important;
    border-radius: 13px !important;
    clip-path: none !important;
    overflow: hidden !important;
  }
  #symfiny-about .sf-comic-panel:before {
    inset: 7px !important;
  }
  #symfiny-about .sf-comic-panel img {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: 230px !important;
    min-height: 230px !important;
    flex: none !important;
    object-fit: contain !important;
    object-position: center bottom !important;
    transform: none !important;
    filter: drop-shadow(0 10px 13px rgba(16,47,43,.14)) !important;
    animation: none !important;
  }
  #symfiny-about .sf-comic-panel:hover img {
    transform: none !important;
  }
  #symfiny-about .sf-bubble {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: none !important;
    margin: 7px 0 0 !important;
    padding: 11px 12px 12px !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 18px rgba(16,47,43,.12) !important;
    z-index: 4 !important;
  }
  #symfiny-about .sf-bubble:after {
    display: none !important;
  }
  #symfiny-about .sf-bubble strong {
    font-size: 8px !important;
    margin-bottom: 5px !important;
  }
  #symfiny-about .sf-bubble span {
    font-size: 15px !important;
    line-height: 1.3 !important;
  }
  #symfiny-about .sf-comic-single .sf-comic-panel {
    width: 100% !important;
    max-width: none !important;
    margin: 20px auto 0 !important;
  }
  #symfiny-about .sf-comic-together {
    width: min(380px,100%) !important;
    height: auto !important;
    max-height: 190px !important;
    margin: 15px auto 0 !important;
  }
  #symfiny-about .sf-comic-breath {
    width: calc(100% - 12px) !important;
    margin: 14px auto !important;
    padding: 50px 17px !important;
    border-radius: 20px !important;
  }
  #symfiny-about .sf-comic-breath:before {
    inset: 12px !important;
    border-radius: 14px !important;
  }
  #symfiny-about .sf-comic-breath .sf-water-word {
    font-size: clamp(62px,18vw,105px) !important;
  }
  #symfiny-about .sf-comic-breath h3 {
    font-size: clamp(28px,8vw,42px) !important;
  }
  #symfiny-about .sf-fish {
    padding-top: 76px !important;
    padding-bottom: 76px !important;
  }
  #symfiny-about .sf-fish-head {
    max-width: 100% !important;
    margin-bottom: 30px !important;
  }
  #symfiny-about .sf-fish h2 {
    font-size: clamp(44px,12vw,62px) !important;
  }
  #symfiny-about .sf-fish-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  #symfiny-about .sf-fish-card {
    width: 100% !important;
    height: 520px !important;
    min-height: 520px !important;
    border-radius: 17px !important;
  }
  #symfiny-about .sf-fish-info {
    left: 9px !important;
    right: 9px !important;
    bottom: 9px !important;
    padding: 13px !important;
  }
  #symfiny-about .sf-fish-name {
    font-size: 30px !important;
  }
  #symfiny-about .sf-fish-spec div {
    padding: 6px 7px !important;
  }
  #symfiny-about .sf-gallery-controls {
    right: 9px !important;
    top: 9px !important;
  }
  #symfiny-about .sf-gallery-dots {
    top: 15px !important;
  }
  #symfiny-about .sf-farm-media img {
    height: 360px !important;
  }
  #symfiny-about .sf-dream {
    min-height: 560px !important;
  }
  #symfiny-about .sf-dream-content {
    padding: 72px 0 !important;
  }
  #symfiny-about .sf-dream h2 {
    font-size: clamp(45px,13vw,65px) !important;
  }
  #symfiny-about .sf-dream p {
    font-size: 14px !important;
    line-height: 1.8 !important;
  }
  #symfiny-about .sf-principles {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  #symfiny-about .sf-principle {
    min-height: 0 !important;
    padding: 21px !important;
  }
  #symfiny-about .sf-principle h3 {
    font-size: 23px !important;
  }
  #symfiny-about .sf-principle p {
    font-size: 12px !important;
  }
  #symfiny-about .sf-footer {
    padding: 80px 0 45px !important;
  }
  #symfiny-about .sf-footer h2 {
    font-size: clamp(48px,14vw,70px) !important;
  }
}


/* ---- SYMFINY FINAL ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â CENTRE FISH PHOTOS ---- */

#symfiny-about .sf-fish-card {
  display: block !important;
}

#symfiny-about .sf-fish-photo {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  padding: 12px 18px 105px !important;
}

#symfiny-about .sf-fish-gallery .sf-fish-photo {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  padding: 12px 18px 105px !important;
}


/* ---- SYMFINY FINAL FISH FIX ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â FULL FRAME PHOTOS ---- */

#symfiny-about .sf-fish-photo,
#symfiny-about .sf-fish-gallery .sf-fish-photo {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  object-fit: cover !important;
  object-position: center center !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#symfiny-about .sf-fish-gallery {
  inset: 0 !important;
  background: transparent !important;
}

#symfiny-about .sf-fish-slide {
  inset: 0 !important;
  background: transparent !important;
}

@media (max-width:700px) {
  #symfiny-about .sf-fish-photo,
  #symfiny-about .sf-fish-gallery .sf-fish-photo {
    padding: 0 !important;
    object-fit: cover !important;
    object-position: center center !important;
  }
}

#symfiny-about .sf-header {
  position: absolute !important;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10000;
  padding: 22px 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#symfiny-about .sf-header.sf-scrolled {
  position: fixed !important;
  padding: 13px 0 !important;
  background: rgba(16,47,43,.88) !important;
  border-bottom: 1px solid rgba(250,249,245,.12) !important;
  box-shadow: 0 12px 50px rgba(0,0,0,.12) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

#symfiny-about .sf-nav {
  width: min(calc(100% - 48px),1380px) !important;
  margin: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 30px !important;
  padding: 0 !important;
  background: transparent !important;
}

#symfiny-about .sf-logo {
  width: 130px !important;
  flex: 0 0 130px !important;
  height: auto !important;
}

#symfiny-about .sf-logo img {
  width: 100% !important;
  height: auto !important;
}

#symfiny-about .sf-menu {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 27px !important;
  margin-left: auto !important;
  flex: 0 1 auto !important;
  min-width: 0 !important;
}

#symfiny-about .sf-menu>a,
#symfiny-about .sf-nav-dropdown-toggle {
  position: relative !important;
  color: #fcfbf6 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .07em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  opacity: .96 !important;
}

#symfiny-about .sf-menu>a {
  padding: 10px 2px !important;
}

#symfiny-about .sf-nav-dropdown {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
}

#symfiny-about .sf-nav-dropdown-toggle {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 40px !important;
  padding: 8px 2px !important;
  border: 0 !important;
  background: transparent !important;
  font: inherit !important;
  cursor: pointer !important;
}

#symfiny-about .sf-nav-chevron {
  font-size: 12px !important;
  line-height: 1 !important;
  transition: transform .2s ease !important;
}

#symfiny-about .sf-nav-dropdown.is-open .sf-nav-chevron {
  transform: rotate(180deg) !important;
}

#symfiny-about .sf-nav-dropdown-panel {
  position: absolute !important;
  top: calc(100% + 10px) !important;
  left: 50% !important;
  transform: translate(-50%,-5px) !important;
  width: 235px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  padding: 9px !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  border: 1px solid rgba(244,241,232,.14) !important;
  border-radius: 17px !important;
  background: rgba(7,28,25,.97) !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.28) !important;
  backdrop-filter: blur(20px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(130%) !important;
  transition: opacity .2s ease,transform .2s ease,visibility .2s ease !important;
}

#symfiny-about .sf-nav-dropdown:hover .sf-nav-dropdown-panel,
#symfiny-about .sf-nav-dropdown:focus-within .sf-nav-dropdown-panel,
#symfiny-about .sf-nav-dropdown.is-open .sf-nav-dropdown-panel {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translate(-50%,0) !important;
}

#symfiny-about .sf-nav-dropdown-panel a {
  display: block !important;
  width: 100% !important;
  padding: 11px 12px !important;
  border-radius: 10px !important;
  color: rgba(250,249,245,.84) !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

#symfiny-about .sf-nav-dropdown-panel a:hover {
  background: rgba(141,185,180,.10) !important;
  color: #fcfbf6 !important;
}

#symfiny-about .sf-enquire {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  min-height: 43px !important;
  padding: 0 18px !important;
  color: #fcfbf6 !important;
  border: 1px solid rgba(250,249,245,.65) !important;
  border-radius: 999px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
  background: rgba(16,47,43,.28) !important;
  white-space: nowrap !important;
}

#symfiny-about .sf-mobile-toggle {
  display: none !important;
}

@media (max-width:1120px) and (min-width:701px) {
  #symfiny-about .sf-nav {
    gap: 18px !important;
  }
  #symfiny-about .sf-menu {
    gap: 15px !important;
  }
  #symfiny-about .sf-menu>a,
  #symfiny-about .sf-nav-dropdown-toggle {
    font-size: 9px !important;
    letter-spacing: .055em !important;
  }
  #symfiny-about .sf-enquire {
    font-size: 9px !important;
    padding: 0 13px !important;
  }
}

@media (max-width:700px) {
  #symfiny-about .sf-header,
  #symfiny-about .sf-header.sf-scrolled {
    position: fixed !important;
    top: 0 !important;
    height: 62px !important;
    padding: 7px 0 !important;
    background: rgba(7,29,27,.94) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-bottom: 1px solid rgba(244,241,232,.10) !important;
  }
  #symfiny-about .sf-nav {
    width: calc(100% - 28px) !important;
    height: 48px !important;
    gap: 12px !important;
  }
  #symfiny-about .sf-logo {
    width: 78px !important;
    flex-basis: 78px !important;
  }
  #symfiny-about .sf-menu,
  #symfiny-about .sf-enquire {
    display: none !important;
  }
  #symfiny-about .sf-mobile-toggle {
    display: flex !important;
    margin-left: auto !important;
    width: 43px !important;
    height: 43px !important;
    padding: 0 !important;
    border: 1px solid rgba(244,241,232,.22) !important;
    border-radius: 50% !important;
    background: rgba(244,241,232,.07) !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
  }
  #symfiny-about .sf-mobile-toggle span,
  #symfiny-about .sf-mobile-toggle span:before,
  #symfiny-about .sf-mobile-toggle span:after {
    display: block !important;
    width: 17px !important;
    height: 1.5px !important;
    margin: auto !important;
    background: #f4f1e8 !important;
    content: "" !important;
  }
  #symfiny-about .sf-mobile-toggle span:before {
    transform: translateY(-5px) !important;
  }
  #symfiny-about .sf-mobile-toggle span:after {
    transform: translateY(4px) !important;
  }
  #symfiny-about .sf-mobile-drawer {
    position: fixed !important;
    top: 62px !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 9999 !important;
    max-height: calc(100vh - 62px) !important;
    overflow: auto !important;
    padding: 10px 14px 18px !important;
    background: rgba(7,29,27,.98) !important;
    border-top: 1px solid rgba(244,241,232,.08) !important;
    box-shadow: 0 24px 50px rgba(0,0,0,.3) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(-12px) !important;
    transition: opacity .25s ease,transform .25s ease,visibility .25s ease !important;
  }
  #symfiny-about .sf-mobile-drawer.is-open {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }
  #symfiny-about .sf-mobile-drawer a,
  #symfiny-about .sf-mobile-group>button {
    display: block !important;
    width: 100% !important;
    padding: 14px 10px !important;
    border: 0 !important;
    border-top: 1px solid rgba(244,241,232,.08) !important;
    background: transparent !important;
    color: #f4f1e8 !important;
    font-family: var(--sans) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
    text-align: left !important;
  }
  #symfiny-about .sf-mobile-group>button {
    cursor: pointer !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }
  #symfiny-about .sf-mobile-sub {
    display: none !important;
    padding: 0 0 5px !important;
  }
  #symfiny-about .sf-mobile-group.is-open .sf-mobile-sub {
    display: block !important;
  }
  #symfiny-about .sf-mobile-sub a {
    padding: 10px 10px 10px 27px !important;
    color: rgba(244,241,232,.65) !important;
    font-size: 9.5px !important;
    font-weight: 600 !important;
  }
}


/* ---- Keyframes ---- */

@keyframes sfBrosFloatA {
  0%, 100% {
    transform: translate3d(0,0,0) rotate(-.6deg);
  }
  50% {
    transform: translate3d(-5px,-12px,0) rotate(.7deg);
  }
}

@keyframes sfBrosFloatB {
  0%, 100% {
    transform: translate3d(0,0,0) rotate(.6deg);
  }
  50% {
    transform: translate3d(6px,-9px,0) rotate(-.7deg);
  }
}

@keyframes sfComicFloatA {
  0%, 100% {
    transform: translate3d(0,0,0);
  }
  50% {
    transform: translate3d(-3px,-7px,0);
  }
}

@keyframes sfComicFloatB {
  0%, 100% {
    transform: translate3d(0,0,0);
  }
  50% {
    transform: translate3d(3px,-5px,0);
  }
}

@keyframes sfWaterPulse {
  0%, 100% {
    transform: translate(-50%,-50%) scale(.94);
    opacity: .75;
  }
  50% {
    transform: translate(-50%,-50%) scale(1.06);
    opacity: 1;
  }
}

@keyframes sfOrbit {
  to {
    transform: translate(-50%,-50%) rotate(360deg);
  }
}

@keyframes sfBrosDramaticEntrance {
  0% {
    opacity: 0;
    transform: translate3d(0,70px,0) scale(.78) rotate(-1.5deg);
    filter: blur(7px) drop-shadow(0 8px 15px rgba(0,0,0,.05));
  }
  55% {
    opacity: 1;
    transform: translate3d(0,-8px,0) scale(1.035) rotate(.35deg);
    filter: blur(0) drop-shadow(0 24px 32px rgba(0,0,0,.22));
  }
  100% {
    opacity: 1;
    transform: translate3d(0,0,0) scale(1) rotate(0);
    filter: drop-shadow(0 22px 28px rgba(0,0,0,.20));
  }
}

@keyframes sfBrosFloat {
  0%, 100% {
    transform: translate3d(0,0,0) rotate(0deg);
  }
  50% {
    transform: translate3d(0,-9px,0) rotate(.35deg);
  }
}


/* ---- Utilities (moved out of inline style="" attributes; the doubled id keeps inline-level priority) ---- */

#symfiny-about#symfiny-about .sf-u-bg-forest {
  background: #102f2b;
}

#symfiny-about#symfiny-about .sf-u-mt-18 {
  margin-top: 18px;
}


/* ==========================================================
   CONTACT PAGE (contact.php)
   Root: #symfiny-contact
   ========================================================== */

#symfiny-contact {
  --forest: #102F2B;
  --green: #174C45;
  --sage: #5F8F82;
  --aqua: #8DB9B4;
  --cream: #F4F1E8;
  --gold: #B99A63;
  background: var(--forest);
  color: var(--cream);
  font-family: Inter,sans-serif;
  width: 100%;
  overflow: hidden;
}

#symfiny-contact * {
  box-sizing: border-box;
}

#symfiny-contact a {
  color: inherit;
  text-decoration: none;
}

#symfiny-contact .shell {
  width: min(1160px,90%);
  margin: auto;
}

#symfiny-contact .serif {
  font-family: "Cormorant Garamond",Georgia,serif;
  font-weight: 400;
}

#symfiny-contact .muted {
  color: rgba(244,241,232,.72);
  font-size: 13px;
  line-height: 1.9;
}

#symfiny-contact .eyebrow {
  color: var(--gold);
  font-size: 10px;
  letter-spacing: 3px;
  text-transform: uppercase;
  font-weight: 700;
}

#symfiny-contact .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 15px 21px;
  background: var(--gold);
  color: var(--forest);
  border: 1px solid var(--gold);
  border-radius: 4px;
  font: 700 10px Inter,sans-serif;
  letter-spacing: 1.3px;
  cursor: pointer;
  transition: .25s;
}

#symfiny-contact .btn:hover {
  background: var(--cream);
  border-color: var(--cream);
  transform: translateY(-2px);
}

#symfiny-contact .outline {
  background: transparent;
  color: var(--cream);
  border-color: rgba(244,241,232,.4);
}

#symfiny-contact .outline:hover {
  background: var(--cream);
  color: var(--forest);
}

#symfiny-contact .glass {
  background: linear-gradient(145deg,rgba(95,143,130,.15),rgba(16,47,43,.52));
  border: 1px solid rgba(244,241,232,.14);
  border-radius: 14px;
  box-shadow: 0 18px 50px rgba(0,0,0,.13);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

#symfiny-contact .nav {
  position: relative;
  z-index: 10;
  background: rgba(16,47,43,.97);
  border-bottom: 1px solid rgba(244,241,232,.12);
}

#symfiny-contact .nav-inner {
  width: min(1280px,92%);
  min-height: 80px;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}

#symfiny-contact .logo img {
  width: 145px;
  max-height: 62px;
  object-fit: contain;
  display: block;
}

#symfiny-contact .links {
  display: flex;
  align-items: center;
  gap: 22px;
  font-size: 10px;
  letter-spacing: .7px;
}

#symfiny-contact .links>a,
#symfiny-contact .menu-trigger {
  color: rgba(244,241,232,.86);
  transition: .2s;
}

#symfiny-contact .links>a:hover,
#symfiny-contact .menu-trigger:hover {
  color: var(--gold);
}

#symfiny-contact .dropdown {
  position: relative;
}

#symfiny-contact .menu-trigger {
  background: none;
  border: 0;
  padding: 12px 0;
  font: inherit;
  cursor: pointer;
  letter-spacing: inherit;
}

#symfiny-contact .submenu {
  display: none;
  position: absolute;
  top: 100%;
  left: -14px;
  min-width: 205px;
  padding: 9px;
  background: #153c35;
  border: 1px solid rgba(185,154,99,.3);
  border-radius: 7px;
  box-shadow: 0 15px 35px #0004;
}

#symfiny-contact .dropdown:hover .submenu,
#symfiny-contact .dropdown:focus-within .submenu,
#symfiny-contact .dropdown.open .submenu {
  display: block;
}

#symfiny-contact .submenu a {
  display: block;
  padding: 12px 10px;
  border-radius: 4px;
  font-size: 11px;
}

#symfiny-contact .submenu a:hover {
  background: #ffffff12;
}

#symfiny-contact .mobile-toggle {
  display: none;
  background: none;
  border: 1px solid #ffffff50;
  border-radius: 4px;
  color: var(--cream);
  padding: 10px 12px;
}

#symfiny-contact .hero {
  position: relative;
  padding: 105px 0 95px;
  background: radial-gradient(ellipse at 83% 12%,#5f8f823b,transparent 42%),radial-gradient(ellipse at 5% 90%,#b99a6318,transparent 40%),linear-gradient(145deg,#102f2b,#143e36 58%,#102f2b);
}

#symfiny-contact .hero:after {
  content: "S";
  position: absolute;
  right: 4%;
  top: -55px;
  font: clamp(250px,35vw,500px)/1 "Cormorant Garamond",serif;
  color: #ffffff06;
  pointer-events: none;
}

#symfiny-contact .hero-grid {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 65px;
  align-items: center;
  position: relative;
  z-index: 1;
}

#symfiny-contact .hero h1 {
  font-size: clamp(60px,8vw,104px);
  line-height: .88;
  letter-spacing: -2px;
  margin: 25px 0;
  color: var(--cream);
}

#symfiny-contact .hero h1 em {
  color: var(--aqua);
  font-weight: 400;
}

#symfiny-contact .hero-copy {
  max-width: 480px;
  margin: 24px 0 30px;
}

#symfiny-contact .quote {
  padding: 30px;
}

#symfiny-contact .quote-mark {
  font: 70px/.7 "Cormorant Garamond",serif;
  color: var(--gold);
  margin-bottom: 20px;
}

#symfiny-contact .quote blockquote {
  font: 30px/1.2 "Cormorant Garamond",serif;
  margin: 0 0 22px;
}

#symfiny-contact .quote-caption {
  font-size: 9px;
  letter-spacing: 1.6px;
  color: var(--aqua);
}

#symfiny-contact .quick-strip {
  background: var(--cream);
  color: var(--forest);
  padding: 25px 0;
}

#symfiny-contact .quick-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 22px;
}

#symfiny-contact .quick-item {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

#symfiny-contact .quick-icon {
  height: 43px;
  width: 43px;
  border: 1px solid #174c453b;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 18px;
  flex-shrink: 0;
}

#symfiny-contact .quick-label {
  font-size: 9px;
  letter-spacing: 1.5px;
  color: #718078;
  margin-bottom: 6px;
}

#symfiny-contact .quick-value {
  font-size: 12px;
  font-weight: 600;
  overflow-wrap: anywhere;
}

#symfiny-contact .contact-section {
  padding: 100px 0;
}

#symfiny-contact .section-heading {
  max-width: 690px;
  margin-bottom: 42px;
}

#symfiny-contact .section-heading h2 {
  font: clamp(44px,5.5vw,68px)/.98 "Cormorant Garamond",serif;
  margin: 20px 0;
  color: var(--cream);
}

#symfiny-contact .section-heading h2 em {
  color: var(--aqua);
  font-weight: 400;
}

#symfiny-contact .contact-grid {
  display: grid;
  grid-template-columns: .83fr 1.17fr;
  gap: 27px;
  align-items: stretch;
}

#symfiny-contact .details {
  padding: 32px;
}

#symfiny-contact .details h3 {
  font: 35px/1.05 "Cormorant Garamond",serif;
  margin: 18px 0 12px;
}

#symfiny-contact .detail {
  padding: 20px 0;
  border-bottom: 1px solid #ffffff1a;
}

#symfiny-contact .detail:last-of-type {
  border-bottom: 0;
}

#symfiny-contact .detail-label {
  font-size: 9px;
  letter-spacing: 1.8px;
  color: var(--gold);
  margin-bottom: 8px;
}

#symfiny-contact .detail-value {
  font-size: 12px;
  line-height: 1.9;
  overflow-wrap: anywhere;
}

#symfiny-contact .detail-value a:hover {
  color: var(--aqua);
}

#symfiny-contact .socials {
  display: flex;
  gap: 9px;
  flex-wrap: wrap;
  margin-top: 22px;
}

#symfiny-contact .socials a {
  font-size: 9px;
  letter-spacing: .6px;
  padding: 11px 13px;
  border: 1px solid #ffffff35;
  border-radius: 4px;
}

#symfiny-contact .socials a:hover {
  background: var(--gold);
  color: var(--forest);
  border-color: var(--gold);
}

#symfiny-contact .form-card {
  padding: clamp(24px,4vw,40px);
  background: linear-gradient(145deg,#F4F1E8,#E8E2D3);
  border: 1px solid #b99a6375;
  border-radius: 14px;
  color: var(--forest);
}

#symfiny-contact .form-card .eyebrow {
  color: #80663c;
}

#symfiny-contact .form-card h3 {
  font: 42px/1 "Cormorant Garamond",serif;
  margin: 17px 0 12px;
  color: var(--forest);
}

#symfiny-contact .form-intro {
  color: #5e7068;
  font-size: 12px;
  line-height: 1.85;
  margin-bottom: 25px;
}

#symfiny-contact .form-slot {
  padding: 22px;
  border: 1px dashed #174c4560;
  border-radius: 8px;
  background: #174c4508;
}

#symfiny-contact .form-slot strong {
  font: 25px "Cormorant Garamond",serif;
  display: block;
  margin-bottom: 8px;
}

#symfiny-contact .form-slot p {
  font-size: 12px;
  line-height: 1.8;
  color: #5e7068;
  margin: 0;
}

#symfiny-contact .form-slot {
  width: 100%;
  min-width: 0;
}

#symfiny-contact .form-slot .elementor-widget-shortcode,
#symfiny-contact .form-slot .elementor-widget-container {
  width: 100%;
  max-width: 100%;
  margin: 0;
}

#symfiny-contact .form-slot .fluentform,
#symfiny-contact .form-slot .frm-fluent-form {
  width: 100%;
  max-width: 100%;
}

#symfiny-contact .form-slot .ff-el-group {
  margin-bottom: 17px;
}

#symfiny-contact .form-slot .ff-el-input--label label,
#symfiny-contact .form-slot .ff-el-form-check-label {
  font-family: Inter,sans-serif;
  color: #174C45;
  font-size: 11px;
  font-weight: 600;
}

#symfiny-contact .form-slot input:not([type=checkbox]):not([type=radio]):not([type=submit]),
#symfiny-contact .form-slot select,
#symfiny-contact .form-slot textarea {
  width: 100%;
  max-width: 100%;
  min-height: 46px;
  padding: 12px 13px;
  border: 1px solid #174c4530;
  border-radius: 5px;
  background: #fffdf8;
  color: #102F2B;
  font: 12px Inter,sans-serif;
  box-shadow: none;
}

#symfiny-contact .form-slot textarea {
  min-height: 115px;
  resize: vertical;
}

#symfiny-contact .form-slot input:focus,
#symfiny-contact .form-slot select:focus,
#symfiny-contact .form-slot textarea:focus {
  outline: 2px solid #8DB9B4;
  outline-offset: 1px;
}

#symfiny-contact .form-slot button[type=submit],
#symfiny-contact .form-slot input[type=submit],
#symfiny-contact .form-slot .ff-btn-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 13px 20px;
  border: 1px solid #B99A63;
  border-radius: 4px;
  background: #B99A63;
  color: #102F2B;
  font: 700 10px Inter,sans-serif;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  cursor: pointer;
}

#symfiny-contact .form-slot button[type=submit]:hover,
#symfiny-contact .form-slot input[type=submit]:hover,
#symfiny-contact .form-slot .ff-btn-submit:hover {
  background: #102F2B;
  border-color: #102F2B;
  color: #F4F1E8;
}

#symfiny-contact .form-slot .ff-message-success {
  padding: 14px;
  border-radius: 6px;
  background: #e4eee7;
  color: #174C45;
  font-size: 12px;
}

#symfiny-contact .form-slot .error.text-danger,
#symfiny-contact .form-slot .ff-el-is-error .text-danger {
  font-size: 11px;
}

#symfiny-contact .form-slot .form-loading-note {
  font: 22px "Cormorant Garamond",serif;
  color: #5e7068;
  padding: 12px 0;
}

#symfiny-contact .location {
  padding: 0 0 100px;
}

#symfiny-contact .location-grid {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 42px;
  align-items: center;
}

#symfiny-contact .location h2 {
  font: clamp(45px,5vw,66px)/.96 "Cormorant Garamond",serif;
  margin: 20px 0;
}

#symfiny-contact .location h2 em {
  color: var(--aqua);
  font-weight: 400;
}

#symfiny-contact .map {
  border: 1px solid #b99a6375;
  border-radius: 14px;
  overflow: hidden;
  min-height: 380px;
  background: var(--green);
}

#symfiny-contact .map iframe {
  display: block;
  width: 100%;
  height: 380px;
  border: 0;
}

#symfiny-contact .community {
  padding: 0 0 90px;
}

#symfiny-contact .community-inner {
  padding: clamp(30px,6vw,65px);
  border: 1px solid #b99a6360;
  border-radius: 15px;
  background: radial-gradient(ellipse at 95% 0%,#b99a632b,transparent 45%),linear-gradient(120deg,#174c45,#102f2b);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 28px;
}

#symfiny-contact .community h2 {
  font: clamp(38px,5vw,60px)/.97 "Cormorant Garamond",serif;
  margin: 17px 0 13px;
}

#symfiny-contact .community h2 em {
  color: var(--aqua);
  font-weight: 400;
}

#symfiny-contact .community p {
  max-width: 530px;
  color: #f4f1e8b8;
  font-size: 12px;
  line-height: 1.9;
  margin: 0;
}

#symfiny-contact .footer {
  border-top: 1px solid #ffffff20;
  padding: 30px 0;
}

#symfiny-contact .footer-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}

#symfiny-contact .footer img {
  width: 125px;
  max-height: 55px;
  object-fit: contain;
}

#symfiny-contact .footer p {
  font-size: 10px;
  color: #f4f1e87a;
  line-height: 1.8;
  margin: 0;
}

#symfiny-contact .footer-links {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
}

#symfiny-contact .footer-links a {
  font-size: 9px;
  color: #f4f1e8b8;
}

#symfiny-contact .footer-links a:hover {
  color: var(--gold);
}

@media (max-width:980px) {
  #symfiny-contact .links {
    gap: 12px;
    font-size: 9px;
  }
  #symfiny-contact .hero-grid {
    gap: 32px;
  }
}

@media (max-width:760px) {
  #symfiny-contact .nav-inner {
    min-height: 70px;
  }
  #symfiny-contact .logo img {
    width: 125px;
  }
  #symfiny-contact .mobile-toggle {
    display: block;
  }
  #symfiny-contact .nav-cta {
    display: none;
  }
  #symfiny-contact .links {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    padding: 15px 5% 24px;
    background: #102f2b;
    border-bottom: 1px solid #b99a6340;
    flex-direction: column;
    align-items: stretch;
    gap: 3px;
  }
  #symfiny-contact .links.active {
    display: flex;
  }
  #symfiny-contact .links>a,
  #symfiny-contact .menu-trigger {
    display: block;
    padding: 12px 0;
    font-size: 12px;
    text-align: left;
  }
  #symfiny-contact .submenu {
    position: static;
    box-shadow: none;
    margin: 0 0 8px 10px;
    background: #ffffff08;
  }
  #symfiny-contact .hero {
    padding: 70px 0 60px;
  }
  #symfiny-contact .hero-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  #symfiny-contact .hero h1 {
    font-size: clamp(58px,15vw,84px);
  }
  #symfiny-contact .quick-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  #symfiny-contact .contact-section {
    padding: 72px 0;
  }
  #symfiny-contact .contact-grid {
    grid-template-columns: 1fr;
  }
  #symfiny-contact .location {
    padding-bottom: 72px;
  }
  #symfiny-contact .location-grid {
    grid-template-columns: 1fr;
    gap: 26px;
  }
  #symfiny-contact .map,
  #symfiny-contact .map iframe {
    height: 310px;
    min-height: 310px;
  }
  #symfiny-contact .community {
    padding-bottom: 65px;
  }
  #symfiny-contact .community-inner {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width:420px) {
  #symfiny-contact .shell {
    width: 90%;
  }
  #symfiny-contact .details {
    padding: 23px;
  }
  #symfiny-contact .form-card {
    padding: 22px 17px;
  }
  #symfiny-contact .form-card h3 {
    font-size: 36px;
  }
  #symfiny-contact .footer-inner {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* ---- Utilities (moved out of inline style="" attributes; the doubled id keeps inline-level priority) ---- */

#symfiny-contact#symfiny-contact .sc-u-note {
  font-size: 11px;
  margin-top: 16px;
}


/* ==========================================================
   LEARNING PAGE (learning-symfiny.php)
   Root: #sym-learning
   ========================================================== */

#sym-learning {
  --forest: #102F2B;
  --forest2: #174C45;
  --sage: #5F8F82;
  --aqua: #8DB9B4;
  --cream: #F4F1E8;
  --paper: #E8DDC8;
  --gold: #B99A63;
  --ink: #193A34;
  --muted: #63746E;
  font-family: "Inter",sans-serif;
  color: var(--ink);
  background: var(--cream);
  overflow: hidden;
  isolation: isolate;
}

#sym-learning * {
  box-sizing: border-box;
}

#sym-learning a {
  text-decoration: none;
}

#sym-learning h1,
#sym-learning h2,
#sym-learning h3,
#sym-learning h4,
#sym-learning p {
  margin-top: 0;
}

#sym-learning .sl-wrap {
  width: min(1160px,90%);
  margin: auto;
}

#sym-learning .sl-serif {
  font-family: "Cormorant Garamond",serif;
  font-weight: 500;
}

#sym-learning .sl-eyebrow {
  font-size: 10px;
  letter-spacing: 2.8px;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--gold);
  margin-bottom: 18px;
}

#sym-learning .sl-title {
  font-family: "Cormorant Garamond",serif;
  font-weight: 500;
  font-size: clamp(42px,6vw,78px);
  line-height: .98;
  letter-spacing: -1.5px;
  margin-bottom: 22px;
}

#sym-learning .sl-copy {
  font-size: 14px;
  line-height: 1.95;
  color: var(--muted);
}

#sym-learning .sl-light {
  color: var(--cream);
}

#sym-learning .sl-light-copy {
  color: rgba(244,241,232,.76);
}

#sym-learning .sl-section {
  padding: 100px 0;
  position: relative;
}

#sym-learning .sl-section-head {
  max-width: 720px;
  margin-bottom: 42px;
}

#sym-learning .sl-section-head .sl-title {
  font-size: clamp(38px,5vw,61px);
}

#sym-learning .sl-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  padding: 15px 22px;
  border-radius: 100px;
  font-size: 10px;
  letter-spacing: .7px;
  font-weight: 700;
  text-transform: uppercase;
  transition: transform .25s,background .25s,color .25s,border-color .25s;
}

#sym-learning .sl-btn:hover {
  transform: translateY(-3px);
}

#sym-learning .sl-btn-gold {
  background: var(--gold);
  color: white;
}

#sym-learning .sl-btn-glass {
  color: var(--cream);
  border: 1px solid rgba(244,241,232,.4);
  background: rgba(255,255,255,.06);
  backdrop-filter: blur(12px);
}

#sym-learning .sl-btn-dark {
  background: var(--forest);
  color: var(--cream);
}

#sym-learning .sl-arrow {
  font-size: 16px;
  line-height: 1;
}

#sym-learning .sl-hero {
  min-height: 680px;
  position: relative;
  display: flex;
  align-items: center;
  background: var(--forest);
  color: var(--cream);
  isolation: isolate;
}

#sym-learning .sl-hero-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -3;
}

#sym-learning .sl-hero-overlay {
  position: absolute;
  inset: 0;
  z-index: -2;
  background: linear-gradient(90deg,rgba(7,29,26,.94) 0%,rgba(10,38,34,.72) 52%,rgba(10,38,34,.28) 100%), linear-gradient(0deg,rgba(7,29,26,.65),transparent 55%);
}

#sym-learning .sl-hero:after {
  content: "";
  position: absolute;
  inset: 20px;
  border: 1px solid rgba(244,241,232,.16);
  pointer-events: none;
  z-index: -1;
}

#sym-learning .sl-hero-content {
  padding: 110px 0 120px;
  max-width: 850px;
}

#sym-learning .sl-hero .sl-eyebrow {
  color: var(--aqua);
}

#sym-learning .sl-hero h1 {
  font-family: "Cormorant Garamond",serif;
  font-size: clamp(55px,8vw,104px);
  line-height: .88;
  font-weight: 400;
  letter-spacing: -2px;
  margin-bottom: 30px;
  color: var(--cream);
}

#sym-learning .sl-hero h1 em {
  font-weight: 400;
  color: var(--aqua);
}

#sym-learning .sl-hero .sl-copy {
  max-width: 570px;
  color: rgba(244,241,232,.82);
}

#sym-learning .sl-hero-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 30px;
}

#sym-learning .sl-hero-note {
  position: absolute;
  right: 6%;
  bottom: 42px;
  color: rgba(244,241,232,.7);
  font-size: 9px;
  letter-spacing: 3px;
  text-transform: uppercase;
  writing-mode: vertical-rl;
}

#sym-learning .sl-orbit {
  position: absolute;
  width: 390px;
  height: 390px;
  border-radius: 50%;
  border: 1px solid rgba(141,185,180,.2);
  right: 9%;
  top: 18%;
  pointer-events: none;
}

#sym-learning .sl-orbit:before,
#sym-learning .sl-orbit:after {
  content: "";
  position: absolute;
  border: 1px solid rgba(185,154,99,.17);
  border-radius: 50%;
}

#sym-learning .sl-orbit:before {
  inset: 28px;
}

#sym-learning .sl-orbit:after {
  inset: 65px;
}

#sym-learning .sl-intro {
  background: var(--cream);
}

#sym-learning .sl-intro-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 70px;
  align-items: start;
}

#sym-learning .sl-intro-quote {
  font-family: "Cormorant Garamond",serif;
  font-size: clamp(29px,3.7vw,46px);
  line-height: 1.15;
  color: var(--forest);
  padding: 25px 0 25px 28px;
  border-left: 2px solid var(--gold);
}

#sym-learning .sl-intro-quote em {
  color: var(--sage);
}

#sym-learning .sl-wordline {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 28px;
}

#sym-learning .sl-wordline span {
  border: 1px solid rgba(23,76,69,.18);
  border-radius: 100px;
  padding: 10px 14px;
  font-size: 9px;
  letter-spacing: 1.3px;
  color: var(--forest);
  font-weight: 700;
}

#sym-learning .sl-pathways {
  background: linear-gradient(145deg,#102F2B,#174C45);
  color: var(--cream);
}

#sym-learning .sl-pathways .sl-title {
  color: var(--cream);
}

#sym-learning .sl-pathways .sl-copy {
  color: rgba(244,241,232,.7);
}

#sym-learning .sl-card-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 18px;
}

#sym-learning .sl-glass-card {
  position: relative;
  min-height: 340px;
  padding: 30px;
  border-radius: 24px;
  border: 1px solid rgba(244,241,232,.17);
  background: linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.025));
  backdrop-filter: blur(16px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  transition: transform .3s,border-color .3s,background .3s;
}

#sym-learning .sl-glass-card:hover {
  transform: translateY(-7px);
  border-color: rgba(185,154,99,.6);
  background: linear-gradient(145deg,rgba(141,185,180,.17),rgba(255,255,255,.04));
}

#sym-learning .sl-card-number {
  font-family: "Cormorant Garamond",serif;
  font-size: 44px;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 32px;
}

#sym-learning .sl-glass-card h3 {
  font-family: "Cormorant Garamond",serif;
  font-size: 34px;
  line-height: 1.02;
  font-weight: 500;
  color: var(--cream);
  margin-bottom: 12px;
}

#sym-learning .sl-card-tag {
  color: var(--aqua);
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 15px;
}

#sym-learning .sl-glass-card p {
  font-size: 12px;
  line-height: 1.8;
  color: rgba(244,241,232,.69);
  margin-bottom: 25px;
}

#sym-learning .sl-card-link {
  color: var(--gold);
  font-size: 10px;
  letter-spacing: .7px;
  text-transform: uppercase;
  font-weight: 700;
  margin-top: auto;
}

#sym-learning .sl-card-art {
  position: absolute;
  right: -40px;
  top: 65px;
  width: 145px;
  height: 145px;
  border-radius: 50%;
  border: 1px solid rgba(141,185,180,.15);
  pointer-events: none;
}

#sym-learning .sl-card-art:before,
#sym-learning .sl-card-art:after {
  content: "";
  position: absolute;
  border: 1px solid rgba(185,154,99,.17);
  border-radius: 50%;
  inset: 15px;
}

#sym-learning .sl-card-art:after {
  inset: 35px;
}

#sym-learning .sl-studio {
  background: #EAE5D8;
}

#sym-learning .sl-studio-intro {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 70px;
  align-items: start;
  margin-bottom: 50px;
}

#sym-learning .sl-studio-intro .sl-title {
  color: var(--forest);
}

#sym-learning .sl-studio-quote {
  padding: 28px 30px;
  border-radius: 22px;
  background: rgba(255,255,255,.48);
  border: 1px solid rgba(23,76,69,.12);
}

#sym-learning .sl-studio-quote p {
  font-family: "Cormorant Garamond",serif;
  font-size: 30px;
  line-height: 1.25;
  color: var(--forest);
  margin: 0;
}

#sym-learning .sl-feature-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

#sym-learning .sl-feature {
  position: relative;
  min-height: 265px;
  border-radius: 22px;
  padding: 30px;
  overflow: hidden;
  border: 1px solid rgba(23,76,69,.12);
  background: rgba(255,255,255,.52);
}

#sym-learning .sl-feature-dark {
  color: var(--cream);
  background: var(--forest);
}

#sym-learning .sl-feature .sl-eyebrow {
  margin-bottom: 15px;
}

#sym-learning .sl-feature h3 {
  font-family: "Cormorant Garamond",serif;
  font-weight: 500;
  font-size: 35px;
  line-height: 1.02;
  color: var(--forest);
  margin-bottom: 12px;
}

#sym-learning .sl-feature-dark h3 {
  color: var(--cream);
}

#sym-learning .sl-feature p {
  font-size: 12px;
  line-height: 1.85;
  color: var(--muted);
}

#sym-learning .sl-feature-dark p {
  color: rgba(244,241,232,.7);
}

#sym-learning .sl-feature .sl-feature-link {
  display: inline-block;
  margin-top: 10px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: var(--sage);
}

#sym-learning .sl-feature-dark .sl-feature-link {
  color: var(--gold);
}

#sym-learning .sl-feature-symbol {
  position: absolute;
  right: 20px;
  bottom: -26px;
  font-family: "Cormorant Garamond",serif;
  font-size: 150px;
  line-height: 1;
  color: rgba(95,143,130,.12);
  pointer-events: none;
}

#sym-learning .sl-feature-dark .sl-feature-symbol {
  color: rgba(141,185,180,.12);
}

#sym-learning .sl-topics {
  background: var(--cream);
}

#sym-learning .sl-topics-grid {
  display: grid;
  grid-template-columns: repeat(5,minmax(0,1fr));
  gap: 12px;
}

#sym-learning .sl-topic {
  border-top: 1px solid rgba(23,76,69,.22);
  padding: 18px 12px 10px 0;
}

#sym-learning .sl-topic h4 {
  font-family: "Cormorant Garamond",serif;
  font-size: 22px;
  font-weight: 500;
  color: var(--forest);
  margin-bottom: 9px;
}

#sym-learning .sl-topic p {
  font-size: 11px;
  line-height: 1.8;
  color: var(--muted);
}

#sym-learning .sl-matsyatra {
  background: linear-gradient(145deg,#123D37,#0C2A27);
  color: var(--cream);
}

#sym-learning .sl-matsyatra .sl-title {
  color: var(--cream);
}

#sym-learning .sl-matsyatra .sl-copy {
  color: rgba(244,241,232,.73);
}

#sym-learning .sl-matsyatra-hero {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 55px;
  align-items: center;
  margin-bottom: 70px;
}

#sym-learning .sl-matsyatra-visual {
  min-height: 410px;
  border-radius: 28px;
  position: relative;
  overflow: hidden;
  background: radial-gradient(ellipse at 50% 20%,rgba(141,185,180,.30),transparent 36%), radial-gradient(ellipse at 80% 80%,rgba(185,154,99,.17),transparent 40%), linear-gradient(155deg,#255F55,#102F2B);
  border: 1px solid rgba(141,185,180,.2);
  display: flex;
  align-items: center;
  justify-content: center;
}

#sym-learning .sl-matsyatra-visual:before {
  content: "";
  position: absolute;
  width: 310px;
  height: 310px;
  border-radius: 50%;
  border: 1px solid rgba(244,241,232,.19);
}

#sym-learning .sl-matsyatra-visual:after {
  content: "";
  position: absolute;
  width: 245px;
  height: 245px;
  border-radius: 50%;
  border: 1px solid rgba(185,154,99,.36);
}

#sym-learning .sl-visual-label {
  z-index: 1;
  text-align: center;
  max-width: 260px;
  padding: 20px;
}

#sym-learning .sl-visual-label span {
  display: block;
  color: var(--aqua);
  font-size: 9px;
  letter-spacing: 3px;
  text-transform: uppercase;
  margin-bottom: 15px;
}

#sym-learning .sl-visual-label strong {
  display: block;
  font-family: "Cormorant Garamond",serif;
  font-size: 46px;
  font-weight: 500;
  line-height: .98;
  color: var(--cream);
}

#sym-learning .sl-visual-label small {
  display: block;
  color: rgba(244,241,232,.68);
  font-size: 10px;
  line-height: 1.8;
  margin-top: 17px;
}

#sym-learning .sl-value-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 13px;
  margin-top: 28px;
}

#sym-learning .sl-value {
  padding: 22px;
  border-radius: 17px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(141,185,180,.15);
}

#sym-learning .sl-value b {
  display: block;
  font-family: "Cormorant Garamond",serif;
  font-size: 23px;
  color: var(--gold);
  font-weight: 500;
  margin-bottom: 4px;
}

#sym-learning .sl-value strong {
  display: block;
  color: var(--cream);
  font-size: 10px;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 9px;
}

#sym-learning .sl-value p {
  font-size: 10px;
  line-height: 1.8;
  color: rgba(244,241,232,.65);
  margin: 0;
}

#sym-learning .sl-worlds-head {
  margin: 65px 0 25px;
}

#sym-learning .sl-worlds-grid {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 13px;
}

#sym-learning .sl-world {
  min-height: 235px;
  padding: 25px 22px;
  border-radius: 20px;
  border: 1px solid rgba(244,241,232,.15);
  background: linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.025));
}

#sym-learning .sl-world-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 1px solid rgba(185,154,99,.55);
  color: var(--gold);
  font-family: "Cormorant Garamond",serif;
  font-size: 25px;
  margin-bottom: 25px;
}

#sym-learning .sl-world h3 {
  font-family: "Cormorant Garamond",serif;
  font-size: 27px;
  font-weight: 500;
  color: var(--cream);
  margin-bottom: 9px;
}

#sym-learning .sl-world p {
  color: rgba(244,241,232,.68);
  font-size: 11px;
  line-height: 1.8;
  margin: 0;
}

#sym-learning .sl-matsyatra-bottom {
  margin-top: 35px;
  padding: 28px;
  border-radius: 20px;
  background: rgba(141,185,180,.08);
  border: 1px solid rgba(141,185,180,.18);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 25px;
}

#sym-learning .sl-matsyatra-bottom h3 {
  font-family: "Cormorant Garamond",serif;
  font-size: 31px;
  font-weight: 500;
  color: var(--cream);
  margin-bottom: 5px;
}

#sym-learning .sl-matsyatra-bottom p {
  margin: 0;
  font-size: 11px;
  color: rgba(244,241,232,.65);
}

#sym-learning .sl-programmes {
  background: #E8DDC8;
}

#sym-learning .sl-programmes-intro {
  display: grid;
  grid-template-columns: 1fr .7fr;
  gap: 60px;
  align-items: end;
  margin-bottom: 40px;
}

#sym-learning .sl-programme-list {
  display: grid;
  gap: 12px;
}

#sym-learning .sl-programme {
  display: grid;
  grid-template-columns: 70px 1fr auto;
  gap: 25px;
  align-items: start;
  padding: 30px;
  border-radius: 20px;
  background: rgba(255,255,255,.48);
  border: 1px solid rgba(23,76,69,.12);
  transition: transform .25s;
}

#sym-learning .sl-programme:hover {
  transform: translateX(4px);
}

#sym-learning .sl-programme-no {
  font-family: "Cormorant Garamond",serif;
  font-size: 39px;
  line-height: 1;
  color: var(--gold);
}

#sym-learning .sl-programme h3 {
  font-family: "Cormorant Garamond",serif;
  font-size: 32px;
  line-height: 1.05;
  font-weight: 500;
  color: var(--forest);
  margin-bottom: 7px;
}

#sym-learning .sl-programme .sl-programme-tag {
  font-size: 9px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--sage);
  font-weight: 700;
  margin-bottom: 12px;
}

#sym-learning .sl-programme p {
  max-width: 650px;
  font-size: 12px;
  line-height: 1.85;
  color: var(--muted);
  margin-bottom: 0;
}

#sym-learning .sl-badge {
  display: inline-block;
  border: 1px solid rgba(23,76,69,.2);
  padding: 8px 11px;
  border-radius: 100px;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .7px;
  text-transform: uppercase;
  color: var(--forest);
  white-space: nowrap;
}

#sym-learning .sl-programme-closer {
  margin-top: 30px;
  padding: 35px;
  border-radius: 22px;
  background: var(--forest);
  color: var(--cream);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 25px;
}

#sym-learning .sl-programme-closer h3 {
  font-family: "Cormorant Garamond",serif;
  font-size: 35px;
  font-weight: 500;
  color: var(--cream);
  margin-bottom: 8px;
}

#sym-learning .sl-programme-closer p {
  font-size: 12px;
  color: rgba(244,241,232,.68);
  margin: 0;
  line-height: 1.8;
}

#sym-learning .sl-everyone {
  background: var(--cream);
}

#sym-learning .sl-everyone-grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 65px;
  align-items: start;
}

#sym-learning .sl-audience-list {
  display: grid;
  gap: 0;
}

#sym-learning .sl-audience {
  display: grid;
  grid-template-columns: 45px 1fr;
  gap: 16px;
  padding: 20px 0;
  border-bottom: 1px solid rgba(23,76,69,.14);
}

#sym-learning .sl-audience-num {
  font-family: "Cormorant Garamond",serif;
  font-size: 26px;
  color: var(--gold);
}

#sym-learning .sl-audience h4 {
  font-family: "Cormorant Garamond",serif;
  font-size: 24px;
  font-weight: 500;
  color: var(--forest);
  margin-bottom: 4px;
}

#sym-learning .sl-audience p {
  font-size: 11px;
  line-height: 1.8;
  color: var(--muted);
  margin: 0;
}

#sym-learning .sl-closing {
  position: relative;
  background: var(--forest);
  color: var(--cream);
  padding: 100px 0;
  text-align: center;
  overflow: hidden;
}

#sym-learning .sl-closing:before,
#sym-learning .sl-closing:after {
  content: "";
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(141,185,180,.14);
  width: 460px;
  height: 460px;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  pointer-events: none;
}

#sym-learning .sl-closing:after {
  width: 350px;
  height: 350px;
  border-color: rgba(185,154,99,.15);
}

#sym-learning .sl-closing-inner {
  position: relative;
  z-index: 1;
}

#sym-learning .sl-closing h2 {
  font-family: "Cormorant Garamond",serif;
  font-size: clamp(48px,7vw,85px);
  font-weight: 400;
  line-height: .98;
  color: var(--cream);
  margin-bottom: 24px;
}

#sym-learning .sl-closing h2 em {
  color: var(--aqua);
}

#sym-learning .sl-closing p {
  max-width: 600px;
  margin: 0 auto 28px;
  color: rgba(244,241,232,.7);
  font-size: 13px;
  line-height: 1.9;
}

#sym-learning .sl-signoff {
  margin-top: 42px;
  color: var(--gold);
  font-size: 9px;
  letter-spacing: 3px;
  text-transform: uppercase;
}

#sym-learning .sl-reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .7s ease,transform .7s ease;
}

#sym-learning .sl-reveal.sl-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width:900px) {
  #sym-learning .sl-section {
    padding: 75px 0;
  }
  #sym-learning .sl-card-grid {
    grid-template-columns: 1fr 1fr;
  }
  #sym-learning .sl-glass-card:last-child {
    grid-column: 1/-1;
    min-height: 280px;
  }
  #sym-learning .sl-intro-grid,
  #sym-learning .sl-studio-intro,
  #sym-learning .sl-matsyatra-hero,
  #sym-learning .sl-everyone-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  #sym-learning .sl-topics-grid {
    grid-template-columns: repeat(3,1fr);
  }
  #sym-learning .sl-worlds-grid {
    grid-template-columns: 1fr 1fr;
  }
  #sym-learning .sl-programmes-intro {
    grid-template-columns: 1fr;
    gap: 15px;
  }
  #sym-learning .sl-orbit {
    right: -100px;
    opacity: .5;
  }
}

@media (max-width:600px) {
  #sym-learning .sl-wrap {
    width: 88%;
  }
  #sym-learning .sl-section {
    padding: 58px 0;
  }
  #sym-learning .sl-hero {
    min-height: 620px;
  }
  #sym-learning .sl-hero-content {
    padding: 85px 0;
  }
  #sym-learning .sl-hero h1 {
    font-size: clamp(52px,14vw,74px);
  }
  #sym-learning .sl-hero:after {
    inset: 10px;
  }
  #sym-learning .sl-hero-note {
    right: 7%;
    bottom: 25px;
    font-size: 8px;
  }
  #sym-learning .sl-orbit {
    width: 240px;
    height: 240px;
    right: -90px;
    top: 14%;
  }
  #sym-learning .sl-card-grid,
  #sym-learning .sl-feature-grid {
    grid-template-columns: 1fr;
  }
  #sym-learning .sl-glass-card:last-child {
    grid-column: auto;
  }
  #sym-learning .sl-glass-card {
    min-height: 280px;
  }
  #sym-learning .sl-topics-grid {
    grid-template-columns: 1fr 1fr;
  }
  #sym-learning .sl-value-grid {
    grid-template-columns: 1fr 1fr;
  }
  #sym-learning .sl-worlds-grid {
    grid-template-columns: 1fr 1fr;
  }
  #sym-learning .sl-world {
    padding: 19px;
    min-height: 220px;
  }
  #sym-learning .sl-world h3 {
    font-size: 24px;
  }
  #sym-learning .sl-matsyatra-visual {
    min-height: 320px;
  }
  #sym-learning .sl-matsyatra-bottom,
  #sym-learning .sl-programme-closer {
    align-items: flex-start;
    flex-direction: column;
  }
  #sym-learning .sl-programme {
    grid-template-columns: 35px 1fr;
    gap: 14px;
    padding: 22px;
  }
  #sym-learning .sl-programme .sl-badge {
    grid-column: 2;
    justify-self: start;
  }
  #sym-learning .sl-programme-no {
    font-size: 29px;
  }
  #sym-learning .sl-programme h3 {
    font-size: 28px;
  }
  #sym-learning .sl-studio-quote p {
    font-size: 25px;
  }
  #sym-learning .sl-closing {
    padding: 75px 0;
  }
}

@media (prefers-reduced-motion:reduce) {
  #sym-learning *,
  #sym-learning *:before,
  #sym-learning *:after {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}


/* ---- Utilities (moved out of inline style="" attributes; the doubled id keeps inline-level priority) ---- */

#sym-learning#sym-learning .sl-u-sage {
  color: #5F8F82;
}

#sym-learning#sym-learning .sl-u-aqua {
  color: #8DB9B4;
}

#sym-learning#sym-learning .sl-u-mt-20 {
  margin: 20px 0 0;
}

#sym-learning#sym-learning .sl-u-eyebrow-aqua {
  color: #8DB9B4;
  font-size: 10px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

#sym-learning#sym-learning .sl-u-cream {
  color: #F4F1E8;
}

#sym-learning#sym-learning .sl-u-title-md {
  font-size: clamp(36px,5vw,57px);
}

#sym-learning#sym-learning .sl-u-card-title {
  font-family: 'Cormorant Garamond',serif;
  font-size: 23px;
  color: #174C45;
  margin-bottom: 12px;
}

/* ==========================================================
   NAV: main menu link clickable + hover submenu + click submenu
   ========================================================== */
.sf-nav-dropdown-toggle { text-decoration: none; }

.sf-nav-chevron-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: -2px;
  padding: 8px 4px;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
}
#symfiny-site .sf-nav-chevron-btn,
#symfiny-about .sf-nav-chevron-btn { color: #fcfbf6; }

/* hover se panel tak mouse le jaate waqt gap me band na ho */
.sf-nav-dropdown-panel::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: -14px;
  height: 14px;
}

/* desktop: hover pe chevron ghume */
@media (min-width: 761px) {
  .sf-nav-dropdown:hover .sf-nav-chevron { transform: rotate(225deg) !important; }
}

/* mobile: link + chevron ek row me, panel neeche full width */
@media (max-width: 760px) {
  #symfiny-site .sf-nav-dropdown,
  #symfiny-about .sf-nav-dropdown {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
  }
  #symfiny-site .sf-nav-dropdown-toggle,
  #symfiny-about .sf-nav-dropdown-toggle {
    flex: 1 1 0;
    width: auto !important;
    min-width: 0;
  }
  .sf-nav-chevron-btn {
    flex: 0 0 48px;
    min-height: 44px;
    margin-left: 0;
  }
  /* "More" me sirf button hai, wo poori row le */
  .sf-nav-dropdown-toggle:is(button) { flex: 1 1 100%; }
  #symfiny-site .sf-nav-dropdown-panel,
  #symfiny-about .sf-nav-dropdown-panel { flex: 0 0 100%; }
  .sf-nav-dropdown-panel::before { display: none; }
}

/* ==========================================================
   NAV FIX: chevron button ka default box hatao + arrow seedha karo
   ========================================================== */
.sf-nav-dropdown .sf-nav-chevron-btn,
#symfiny-site .sf-nav-dropdown .sf-nav-chevron-btn,
#symfiny-about .sf-nav-dropdown .sf-nav-chevron-btn {
  -webkit-appearance: none !important;
  appearance: none !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none;
  min-height: 40px;
  margin-left: -1px !important;
  padding: 8px 6px !important;
  color: #fcfbf6 !important;
}
.sf-nav-dropdown .sf-nav-chevron-btn:focus-visible {
  outline: 1px solid rgba(252,251,246,.5);
  outline-offset: 2px;
}

/* text-glyph (ÃƒÂ¢Ã…â€™Ã¢â‚¬Å¾) ki jagah CSS arrow: hamesha center me, neeche nahi girta */
#symfiny-site .sf-nav-dropdown .sf-nav-chevron,
#symfiny-about .sf-nav-dropdown .sf-nav-chevron {
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  font-size: 0 !important;
  line-height: 0 !important;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-2px) rotate(45deg) !important;
  transition: transform .2s ease !important;
}
#symfiny-site .sf-nav-dropdown.is-open .sf-nav-chevron,
#symfiny-about .sf-nav-dropdown.is-open .sf-nav-chevron {
  transform: translateY(1px) rotate(225deg) !important;
}
@media (min-width: 761px) {
  #symfiny-site .sf-nav-dropdown:hover .sf-nav-chevron,
  #symfiny-about .sf-nav-dropdown:hover .sf-nav-chevron {
    transform: translateY(1px) rotate(225deg) !important;
  }
}

/* Symfiny sitewide interaction and responsive safety patch */
html,body{max-width:100%;overflow-x:clip}
button,[role="button"],a{touch-action:manipulation}
a.symfiny-anchor-missing{outline:1px dashed rgba(185,154,99,.65)}
#sym-learning{width:100vw;max-width:none;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
#sym-learning .sl-link-unavailable{opacity:.6;cursor:not-allowed}


/* ==========================================================
   LEARNING @ SYMFINY Ã¢â‚¬â€ FULL BLEED + VISUAL REFINEMENTS
   Scoped to #sym-learning so other pages remain unchanged.
   ========================================================== */
html:has(#sym-learning),
body:has(#sym-learning){width:100%;max-width:100%;margin:0!important;padding:0!important;overflow-x:clip;background:#102F2B!important}
body:has(#sym-learning) #page,
body:has(#sym-learning) #content,
body:has(#sym-learning) .site,
body:has(#sym-learning) .site-content,
body:has(#sym-learning) .content-area,
body:has(#sym-learning) .site-main,
body:has(#sym-learning) .entry-content,
body:has(#sym-learning) .wp-site-blocks,
body:has(#sym-learning) .elementor,
body:has(#sym-learning) .elementor-section-wrap,
body:has(#sym-learning) .elementor-widget-wrap,
body:has(#sym-learning) .container,
body:has(#sym-learning) .ast-container{width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important;padding-left:0!important;padding-right:0!important}
#sym-learning{display:block;width:100%!important;max-width:none!important;margin:0!important;padding:0!important;position:relative;left:auto;right:auto;overflow:hidden;background:#102F2B!important;color:#F4F1E8}
#sym-learning .sl-hero{width:100%;min-height:clamp(600px,90vh,960px);margin:0;border-radius:0}
#sym-learning .sl-hero-video{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center}
#sym-learning .sl-section,#sym-learning .sl-closing{width:100%;max-width:none;margin:0}
#sym-learning .sl-wrap{width:min(1240px,calc(100% - 56px));max-width:1240px;margin-left:auto;margin-right:auto}
#sym-learning .sl-topics-photo-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
#sym-learning .sl-topic{min-width:0;overflow:hidden;border:1px solid rgba(244,241,232,.13);border-radius:16px;background:linear-gradient(145deg,rgba(244,241,232,.075),rgba(244,241,232,.025));}
#sym-learning .sl-topic img,#sym-learning .sl-topic-blue-art{display:block;width:100%;height:170px;object-fit:cover}
#sym-learning .sl-topic>div:not(.sl-topic-blue-art){padding:18px 18px 20px}
#sym-learning .sl-topic h4{color:#F4F1E8}
#sym-learning .sl-studio-gallery{height:clamp(300px,45vw,560px);position:relative;overflow:hidden;border-radius:20px;margin:46px 0 36px;background:#174C45;border:1px solid rgba(244,241,232,.16);box-shadow:0 25px 70px rgba(0,0,0,.24)}
#sym-learning .sl-studio-shot{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;opacity:0;transform:scale(1.025);transition:opacity 1.4s ease,transform 6.5s ease}
#sym-learning .sl-studio-shot.is-active{opacity:1;transform:scale(1)}
#sym-learning .sl-studio-gallery:after{content:"";position:absolute;inset:30% 0 0;background:linear-gradient(transparent,rgba(8,28,25,.8));pointer-events:none}
#sym-learning .sl-studio-gallery-caption{position:absolute;z-index:2;left:clamp(20px,4vw,48px);bottom:clamp(20px,4vw,42px);display:flex;flex-direction:column;gap:8px;color:#F4F1E8}
#sym-learning .sl-studio-gallery-caption span{font-size:10px;letter-spacing:.2em;color:#D7C18D}
#sym-learning .sl-studio-gallery-caption strong{font:500 clamp(24px,4vw,42px)/1.1 "Cormorant Garamond",Georgia,serif;max-width:620px}
#sym-learning .sl-feature-photo{display:block;width:100%;max-height:260px;object-fit:cover;border-radius:14px;margin:16px 0 18px}
#sym-learning .sl-matsyatra-logo-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px;overflow:hidden}
#sym-learning .sl-matsyatra-logo{width:min(230px,60%);height:auto;object-fit:contain;transform-origin:center;animation:slLogoFloat 8s ease-in-out infinite,slLogoTurn 22s ease-in-out infinite;filter:drop-shadow(0 12px 28px rgba(0,0,0,.22))}
#sym-learning .sl-matsyatra-logo-panel .sl-visual-label{position:relative;inset:auto;text-align:center}
@keyframes slLogoFloat{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-7px) rotate(1.5deg)}}
@keyframes slLogoTurn{0%,88%,100%{filter:drop-shadow(0 12px 28px rgba(0,0,0,.22))}92%{filter:drop-shadow(0 0 22px rgba(185,154,99,.55))}}
#sym-learning .sl-value{position:relative;padding-left:88px!important;min-height:100px}
#sym-learning .sl-value-icon{position:absolute;left:18px;top:20px;width:50px;height:50px;object-fit:contain;filter:drop-shadow(0 5px 10px rgba(0,0,0,.12))}
#sym-learning .sl-worlds-photo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
#sym-learning .sl-worlds-photo-grid .sl-world{min-width:0;padding:0!important;overflow:hidden;border:1px solid rgba(244,241,232,.13);border-radius:18px;background:rgba(244,241,232,.045)}
#sym-learning .sl-worlds-photo-grid .sl-world>img{width:100%;height:220px;object-fit:cover;display:block;transition:transform .6s}
#sym-learning .sl-worlds-photo-grid .sl-world:hover>img{transform:scale(1.04)}
#sym-learning .sl-world-copy{padding:18px}
#sym-learning .sl-world-copy>span{font-size:11px;letter-spacing:.08em;color:#B99A63}
#sym-learning .sl-world-copy h3{margin:8px 0;color:#F4F1E8}
#sym-learning .sl-world-copy p{margin:0;color:rgba(244,241,232,.76)}
#sym-learning a:focus-visible,#sym-learning button:focus-visible{outline:2px solid #B99A63;outline-offset:4px}
@media(max-width:1000px){#sym-learning .sl-topics-photo-grid{grid-template-columns:repeat(3,minmax(0,1fr))}#sym-learning .sl-worlds-photo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){#sym-learning .sl-wrap{width:calc(100% - 32px)}#sym-learning .sl-hero{min-height:720px;min-height:88svh}#sym-learning .sl-topics-photo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#sym-learning .sl-topic img,#sym-learning .sl-topic-blue-art{height:150px}#sym-learning .sl-value{padding-left:74px!important}#sym-learning .sl-value-icon{left:12px;width:44px;height:44px}#sym-learning .sl-studio-gallery{height:clamp(250px,72vw,420px);margin:28px 0}#sym-learning .sl-worlds-photo-grid .sl-world>img{height:175px}}
@media(max-width:430px){#sym-learning .sl-topics-photo-grid,#sym-learning .sl-worlds-photo-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){#sym-learning .sl-matsyatra-logo,#sym-learning .sl-studio-shot{animation:none!important;transition:none!important}#sym-learning *{scroll-behavior:auto!important}}


/* ==========================================================
   LEARNING PAGE ALIGNMENT + CONTRAST REPAIR (scoped to #sym-learning)
   Appended to the shared site stylesheet; does not affect other pages.
   ========================================================== */

/* Symfiny Learning page repair Ã¢â‚¬â€ scoped to #sym-learning only */
#sym-learning { --sl-forest:#102F2B; --sl-forest-2:#174C45; --sl-sage:#5F8F82; --sl-aqua:#8DB9B4; --sl-cream:#F4F1E8; --sl-gold:#B99A63; background:var(--sl-forest); color:var(--sl-cream); overflow:clip; }
#sym-learning *, #sym-learning *::before, #sym-learning *::after { box-sizing:border-box; }
#sym-learning img { max-width:100%; }
#sym-learning .sl-wrap { width:min(1180px, calc(100% - 64px)); margin-inline:auto; }
#sym-learning .sl-hero { min-height: min(760px, calc(100svh - 100px)); min-height:clamp(620px,78vh,820px); position:relative; display:flex; align-items:center; isolation:isolate; overflow:hidden; background:#102F2B; color:#F4F1E8; }
#sym-learning .sl-hero-image { position:absolute; inset:0; z-index:-3; display:block; width:100%; height:100%; object-fit:cover; object-position:center 45%; }
#sym-learning .sl-hero-overlay { position:absolute; inset:0; z-index:-2; background:linear-gradient(90deg,rgba(8,29,26,.05) 0%,rgba(8,29,26,.24) 36%,rgba(8,29,26,.88) 63%,#102F2B 100%),linear-gradient(0deg,rgba(8,29,26,.58),transparent 42%); }
#sym-learning .sl-hero .sl-wrap { display:flex; justify-content:flex-end; position:relative; z-index:1; }
#sym-learning .sl-hero-content { width:min(100%,570px); max-width:570px; margin-left:auto; padding:100px 0 120px; }
#sym-learning .sl-hero .sl-eyebrow { color:#B99A63; }
#sym-learning .sl-hero h1 { font-family:"Cormorant Garamond",Georgia,serif; font-size:clamp(48px,5.7vw,82px); line-height:.98; letter-spacing:-1.5px; font-weight:400; margin:0 0 24px; color:#F4F1E8; overflow-wrap:normal; }
#sym-learning .sl-hero h1 em { color:#8DB9B4; }
#sym-learning .sl-hero .sl-copy { max-width:490px; color:#F4F1E8; font-size:15px; line-height:1.8; }
#sym-learning .sl-hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:26px; }
#sym-learning .sl-hero-note { right:24px; bottom:28px; z-index:2; color:#F4F1E8; }
#sym-learning .sl-orbit { z-index:-1; right:7%; }
#sym-learning .sl-section { padding:100px 0; }
#sym-learning .sl-section-head { max-width:760px; margin:0 auto 48px; }
#sym-learning .sl-title { color:#F4F1E8; font-size:clamp(38px,4.5vw,64px); line-height:1.05; overflow-wrap:normal; }
#sym-learning .sl-copy, #sym-learning .sl-section p { line-height:1.8; }
#sym-learning .sl-intro { background:#F4F1E8; color:#102F2B; }
#sym-learning .sl-intro .sl-title, #sym-learning .sl-intro .sl-copy { color:#102F2B; }
#sym-learning .sl-pathways, #sym-learning .sl-studio, #sym-learning .sl-matsyatra, #sym-learning .sl-programmes, #sym-learning .sl-everyone { background:#102F2B; color:#F4F1E8; }
#sym-learning .sl-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
#sym-learning .sl-glass-card { display:flex; flex-direction:column; min-width:0; padding:30px; border:1px solid rgba(244,241,232,.18); border-radius:22px; background:linear-gradient(145deg,rgba(244,241,232,.09),rgba(244,241,232,.025)); color:#F4F1E8; text-decoration:none; }
#sym-learning .sl-glass-card h3, #sym-learning .sl-feature h3, #sym-learning .sl-world h3, #sym-learning .sl-programme h3 { color:#F4F1E8; }
#sym-learning .sl-glass-card p, #sym-learning .sl-feature p, #sym-learning .sl-topic p, #sym-learning .sl-world p, #sym-learning .sl-programme p, #sym-learning .sl-audience p { color:rgba(244,241,232,.84); }
#sym-learning .sl-studio-gallery { height:clamp(260px,42vw,510px); position:relative; overflow:hidden; border-radius:22px; margin:45px 0 28px; background:#174C45; }
#sym-learning .sl-studio-gallery-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity 1.2s ease; }
#sym-learning .sl-studio-gallery-image.is-active { opacity:1; }
#sym-learning .sl-gallery-caption { position:absolute; left:24px; bottom:22px; padding:10px 15px; border-radius:30px; color:#F4F1E8; background:rgba(16,47,43,.78); font-size:13px; }
#sym-learning .sl-feature-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
#sym-learning .sl-feature { position:relative; min-width:0; overflow:hidden; padding:26px; border:1px solid rgba(244,241,232,.17); border-radius:20px; background:rgba(244,241,232,.045); }
#sym-learning .sl-feature-image { display:block; width:100%; height:clamp(190px,24vw,300px); object-fit:cover; border-radius:13px; margin:0 0 22px; }
#sym-learning .sl-topics-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
#sym-learning .sl-topic { min-width:0; padding:0 0 22px; overflow:hidden; border:1px solid rgba(244,241,232,.16); border-radius:18px; background:rgba(244,241,232,.04); }
#sym-learning .sl-topic h4, #sym-learning .sl-topic p { margin-inline:20px; }
#sym-learning .sl-topic h4 { color:#F4F1E8; }
#sym-learning .sl-topic-image { display:block; width:100%; height:180px; object-fit:cover; margin-bottom:18px; }
#sym-learning .sl-matsyatra-visual { min-height:320px; display:flex; align-items:center; justify-content:center; background:radial-gradient(circle at center,rgba(95,143,130,.3),rgba(16,47,43,.96) 70%); border:1px solid rgba(244,241,232,.16); border-radius:24px; overflow:hidden; }
#sym-learning .sl-matsyatra-logo-wrap { display:flex; align-items:center; justify-content:center; width:100%; min-height:300px; }
#sym-learning .sl-matsyatra-logo { width:min(240px,55%); height:auto; object-fit:contain; animation:sl-logo-turn 18s ease-in-out infinite; }
@keyframes sl-logo-turn { 0%,80%,100% { transform:rotate(0deg) scale(1); } 88% { transform:rotate(7deg) scale(1.035); } 94% { transform:rotate(-5deg) scale(1.015); } }
#sym-learning .sl-value-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
#sym-learning .sl-value { min-width:0; padding:24px; border:1px solid rgba(244,241,232,.15); border-radius:18px; background:rgba(244,241,232,.04); }
#sym-learning .sl-value-icon { display:block; width:58px; height:58px; object-fit:contain; margin-bottom:14px; }
#sym-learning .sl-value strong { display:block; color:#F4F1E8; margin:8px 0; }
#sym-learning .sl-worlds-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
#sym-learning .sl-world { min-width:0; overflow:hidden; padding:0 0 22px; border:1px solid rgba(244,241,232,.16); border-radius:18px; background:rgba(244,241,232,.04); }
#sym-learning .sl-world-image { display:block; width:100%; height:200px; object-fit:cover; }
#sym-learning .sl-world h3, #sym-learning .sl-world p { margin-inline:18px; }
#sym-learning .sl-world-tagline { color:#B99A63!important; font-weight:600; margin-top:18px; margin-bottom:6px; }
#sym-learning .sl-programme-list { display:grid; gap:18px; }
#sym-learning .sl-programme { display:grid; grid-template-columns:48px minmax(0,1fr) minmax(120px,auto); gap:20px; align-items:start; padding:24px; border:1px solid rgba(244,241,232,.16); border-radius:18px; background:rgba(244,241,232,.04); }
#sym-learning .sl-programme-no { grid-column:1; grid-row:1; color:#B99A63; }
#sym-learning .sl-programme-image { grid-column:1; grid-row:2; width:88px; height:88px; object-fit:cover; border-radius:12px; }
#sym-learning .sl-programme > div:nth-of-type(2) { grid-column:2; grid-row:1 / span 2; min-width:0; }
#sym-learning .sl-programme h3 { margin-top:5px; }
#sym-learning .sl-programme .sl-badge { grid-column:3; grid-row:1; color:#F4F1E8; align-self:start; }
#sym-learning .sl-everyone-grid { display:grid; grid-template-columns: .9fr 1.1fr; gap:60px; }
#sym-learning .sl-closing { background:#174C45; color:#F4F1E8; text-align:center; padding:100px 0; }
#sym-learning .sl-closing-inner { max-width:850px; }
#sym-learning .sl-closing h2 { color:#F4F1E8; font-size:clamp(44px,6vw,78px); line-height:1; }
#sym-learning .sl-closing p { color:rgba(244,241,232,.9); max-width:650px; margin:24px auto; }
#sym-learning .sl-btn { min-height:44px; display:inline-flex; align-items:center; justify-content:center; gap:12px; padding:12px 20px; border-radius:99px; font-size:12px; font-weight:700; text-decoration:none; }
#sym-learning .sl-btn-gold { color:#102F2B!important; background:#B99A63; }
#sym-learning .sl-btn-glass { color:#F4F1E8!important; border:1px solid rgba(244,241,232,.4); background:rgba(16,47,43,.55); }
#sym-learning .sl-eyebrow { color:#8DB9B4; letter-spacing:2px; font-size:11px; font-weight:700; text-transform:uppercase; }
#sym-learning .sl-card-link, #sym-learning .sl-feature-link { color:#B99A63; }
#sym-learning .sl-u-cream { color:#F4F1E8!important; }
#sym-learning .sl-u-sage { color:#8DB9B4!important; }
#sym-learning .sl-u-aqua { color:#8DB9B4!important; }
#sym-learning .sl-programme-tag { color:#8DB9B4; }
@media(max-width:900px) {
 #sym-learning .sl-wrap { width:min(100% - 40px,720px); }
 #sym-learning .sl-hero { min-height:760px; align-items:flex-end; }
 #sym-learning .sl-hero-image { object-position:38% center; }
 #sym-learning .sl-hero-overlay { background:linear-gradient(0deg,rgba(8,29,26,.98) 0%,rgba(8,29,26,.82) 44%,rgba(8,29,26,.12) 100%); }
 #sym-learning .sl-hero .sl-wrap { justify-content:flex-start; }
 #sym-learning .sl-hero-content { padding:300px 0 95px; max-width:620px; margin:0; }
 #sym-learning .sl-hero h1 { font-size:clamp(45px,9vw,70px); }
 #sym-learning .sl-card-grid, #sym-learning .sl-topics-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 #sym-learning .sl-worlds-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 #sym-learning .sl-value-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 #sym-learning .sl-programme { grid-template-columns:42px minmax(0,1fr); }
 #sym-learning .sl-programme > div:nth-of-type(2) { grid-column:2; grid-row:1 / span 2; }
 #sym-learning .sl-programme .sl-badge { grid-column:2; grid-row:3; }
 #sym-learning .sl-programme-image { width:42px; height:42px; }
}
@media(max-width:600px) {
 #sym-learning .sl-wrap { width:calc(100% - 36px); }
 #sym-learning .sl-section { padding:68px 0; }
 #sym-learning .sl-hero { min-height:730px; }
 #sym-learning .sl-hero-content { padding:290px 0 90px; }
 #sym-learning .sl-hero h1 { font-size:clamp(42px,12vw,58px); letter-spacing:-.8px; }
 #sym-learning .sl-hero .sl-copy { font-size:14px; }
 #sym-learning .sl-hero-note { display:none; }
 #sym-learning .sl-card-grid, #sym-learning .sl-feature-grid, #sym-learning .sl-topics-grid, #sym-learning .sl-value-grid, #sym-learning .sl-worlds-grid, #sym-learning .sl-everyone-grid { grid-template-columns:1fr; gap:16px; }
 #sym-learning .sl-programme { padding:18px; gap:12px; }
 #sym-learning .sl-programme-image { width:38px; height:38px; }
 #sym-learning .sl-programme h3 { font-size:25px; }
 #sym-learning .sl-studio-gallery { height:300px; }
 #sym-learning .sl-feature-image { height:220px; }
}
@media(prefers-reduced-motion:reduce) { #sym-learning .sl-matsyatra-logo { animation:none; } #sym-learning .sl-studio-gallery-image { transition:none; } }

/* ======================================================================
   LEARNING @ SYMFINY â€” CONSOLIDATED LAYOUT / CONTRAST FIX
   Shared stylesheet only. Scoped to #sym-learning; other pages untouched.
   This final block intentionally supersedes older Learning-page declarations.
   ====================================================================== */
#sym-learning,
#sym-learning * ,
#sym-learning *::before,
#sym-learning *::after { box-sizing: border-box; }
#sym-learning {
  --sl-forest:#102F2B;
  --sl-green:#174C45;
  --sl-sage:#5F8F82;
  --sl-aqua:#8DB9B4;
  --sl-cream:#F4F1E8;
  --sl-gold:#B99A63;
  position:relative;
  width:100%; max-width:100%; min-width:0;
  margin:0; padding:0;
  overflow:hidden;
  background:var(--sl-forest);
  color:var(--sl-cream);
  font-family:Inter,"Plus Jakarta Sans",Arial,sans-serif;
  font-size:16px; line-height:1.7;
  isolation:isolate;
}
#sym-learning img { display:block; max-width:100%; }
#sym-learning a { color:inherit; }
#sym-learning p { margin-top:0; }
#sym-learning h1,#sym-learning h2,#sym-learning h3,#sym-learning h4 {
  font-family:"Cormorant Garamond",Georgia,serif;
  font-weight:500; line-height:1.05; letter-spacing:-.025em;
  overflow-wrap:break-word;
}
#sym-learning .sl-wrap {
  position:relative; z-index:3;
  width:min(1180px,calc(100% - 56px)); max-width:1180px;
  min-width:0; margin:0 auto;
}
#sym-learning .sl-section { position:relative; width:100%; min-width:0; padding:clamp(68px,8vw,112px) 0; }
#sym-learning .sl-title { margin:0; font-size:clamp(38px,5.2vw,68px); color:var(--sl-cream); }
#sym-learning .sl-title em { font-style:italic; }
#sym-learning .sl-copy { max-width:660px; margin:20px 0 0; font-size:clamp(15px,1.25vw,17px); line-height:1.8; overflow-wrap:break-word; }
#sym-learning .sl-eyebrow { display:block; margin:0 0 16px; color:var(--sl-aqua); font-size:10px; line-height:1.6; font-weight:700; letter-spacing:.2em; text-transform:uppercase; }
#sym-learning .sl-u-sage { color:var(--sl-aqua)!important; }
#sym-learning .sl-u-aqua { color:var(--sl-aqua)!important; }
#sym-learning .sl-u-cream { color:var(--sl-cream)!important; }
#sym-learning .sl-u-mt-20 { margin-top:20px!important; }

/* Hero: keep image, overlay and content in a predictable positive stacking order. */
#sym-learning .sl-hero {
  position:relative; isolation:isolate; display:flex; align-items:center;
  width:100%; min-height:clamp(650px,88svh,900px); margin:0; padding:100px 0 92px;
  overflow:hidden; background:var(--sl-forest); color:var(--sl-cream);
}
#sym-learning .sl-hero-image { position:absolute; inset:0; z-index:0; width:100%; height:100%; max-width:none; object-fit:cover; object-position:center 48%; }
#sym-learning .sl-hero-overlay { position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(90deg,rgba(7,27,24,.88) 0%,rgba(7,27,24,.72) 42%,rgba(7,27,24,.20) 100%),linear-gradient(0deg,rgba(7,27,24,.48),transparent 58%); }
#sym-learning .sl-orbit { position:absolute; z-index:2; right:-7%; top:12%; width:clamp(240px,36vw,540px); aspect-ratio:1; border:1px solid rgba(244,241,232,.14); border-radius:50%; pointer-events:none; }
#sym-learning .sl-orbit::before,#sym-learning .sl-orbit::after { content:""; position:absolute; inset:9%; border:1px solid rgba(141,185,180,.13); border-radius:50%; }
#sym-learning .sl-orbit::after { inset:20%; }
#sym-learning .sl-hero .sl-wrap { width:min(1180px,calc(100% - 56px)); }
#sym-learning .sl-hero-content { position:relative; z-index:3; width:100%; max-width:700px; min-width:0; padding:0; margin:0; }
#sym-learning .sl-hero h1 { margin:0; max-width:780px; color:var(--sl-cream)!important; font-size:clamp(48px,7.1vw,88px); line-height:.98; letter-spacing:-.04em; }
#sym-learning .sl-hero h1 em { color:var(--sl-aqua); font-style:italic; }
#sym-learning .sl-hero .sl-eyebrow { color:#D4C49D!important; }
#sym-learning .sl-hero .sl-copy { max-width:620px; color:rgba(244,241,232,.88)!important; margin-top:24px; }
#sym-learning .sl-hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:30px; }
#sym-learning .sl-btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:46px; max-width:100%; padding:12px 21px; border-radius:999px; text-decoration:none; font-size:11px; line-height:1.35; font-weight:700; letter-spacing:.07em; transition:transform .25s ease,background .25s ease,border-color .25s ease; }
#sym-learning .sl-btn:hover { transform:translateY(-2px); }
#sym-learning .sl-btn-gold { color:var(--sl-forest)!important; background:var(--sl-gold); border:1px solid var(--sl-gold); }
#sym-learning .sl-btn-glass { color:var(--sl-cream)!important; background:rgba(16,47,43,.52); border:1px solid rgba(244,241,232,.5); backdrop-filter:blur(12px); }
#sym-learning .sl-hero-note { position:absolute; z-index:3; right:max(28px,calc((100% - 1180px)/2)); bottom:28px; color:rgba(244,241,232,.76); font-size:9px; font-weight:600; letter-spacing:.2em; }

/* Light and dark sections: explicitly readable text colours. */
#sym-learning .sl-intro,#sym-learning .sl-topics,#sym-learning .sl-everyone { background:var(--sl-cream); color:#343B37; }
#sym-learning .sl-intro .sl-title,#sym-learning .sl-topics .sl-title,#sym-learning .sl-everyone .sl-title,
#sym-learning .sl-intro h3,#sym-learning .sl-topics h3,#sym-learning .sl-everyone h3,
#sym-learning .sl-intro h4,#sym-learning .sl-topics h4,#sym-learning .sl-everyone h4 { color:var(--sl-green)!important; }
#sym-learning .sl-intro .sl-copy,#sym-learning .sl-topics .sl-copy,#sym-learning .sl-everyone .sl-copy,
#sym-learning .sl-intro p:not(.sl-eyebrow),#sym-learning .sl-topics p:not(.sl-eyebrow),#sym-learning .sl-everyone p:not(.sl-eyebrow) { color:#4D5852; }
#sym-learning .sl-intro .sl-eyebrow,#sym-learning .sl-topics .sl-eyebrow,#sym-learning .sl-everyone .sl-eyebrow { color:#557D70; }
#sym-learning .sl-intro-quote { padding:clamp(22px,3vw,38px); border-left:2px solid var(--sl-gold); background:rgba(23,76,69,.055); color:var(--sl-green); font-family:"Cormorant Garamond",Georgia,serif; font-size:clamp(24px,3vw,34px); line-height:1.25; }
#sym-learning .sl-wordline { display:flex; flex-wrap:wrap; gap:10px 18px; margin-top:24px; color:#59766D; font-size:9px; font-weight:700; letter-spacing:.14em; }
#sym-learning .sl-pathways,#sym-learning .sl-studio,#sym-learning .sl-matsyatra,#sym-learning .sl-programmes { background:var(--sl-forest); color:var(--sl-cream); }
#sym-learning .sl-pathways h2,#sym-learning .sl-studio h2,#sym-learning .sl-matsyatra h2,#sym-learning .sl-programmes h2,
#sym-learning .sl-pathways h3,#sym-learning .sl-studio h3,#sym-learning .sl-matsyatra h3,#sym-learning .sl-programmes h3 { color:var(--sl-cream); }
#sym-learning .sl-pathways .sl-copy,#sym-learning .sl-studio .sl-copy,#sym-learning .sl-matsyatra .sl-copy,#sym-learning .sl-programmes .sl-copy { color:rgba(244,241,232,.78); }
#sym-learning .sl-section-head { max-width:760px; margin:0 0 42px; }
#sym-learning .sl-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; align-items:stretch; }
#sym-learning .sl-glass-card { position:relative; display:flex; flex-direction:column; align-items:flex-start; min-width:0; min-height:350px; padding:28px; overflow:hidden; border:1px solid rgba(244,241,232,.17); border-radius:20px 5px 20px 5px; background:linear-gradient(145deg,rgba(244,241,232,.085),rgba(244,241,232,.025)); color:var(--sl-cream); text-decoration:none; backdrop-filter:blur(12px); }
#sym-learning .sl-card-art { position:absolute; width:170px; height:170px; right:-65px; top:-65px; border:1px solid rgba(141,185,180,.23); border-radius:50%; pointer-events:none; }
#sym-learning .sl-card-art::after { content:""; position:absolute; inset:18px; border:1px solid rgba(185,154,99,.18); border-radius:50%; }
#sym-learning .sl-card-number { color:var(--sl-gold); font-size:11px; letter-spacing:.14em; }
#sym-learning .sl-card-tag { margin-top:18px; color:var(--sl-aqua); font-size:9px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
#sym-learning .sl-glass-card h3 { margin:10px 0 12px; font-size:clamp(29px,3vw,39px); line-height:.98; }
#sym-learning .sl-glass-card p { margin:0 0 20px; color:rgba(244,241,232,.78); font-size:14px; line-height:1.75; }
#sym-learning .sl-card-link,#sym-learning .sl-feature-link { margin-top:auto; color:var(--sl-gold)!important; font-size:10px; font-weight:700; letter-spacing:.08em; text-decoration:none; }
#sym-learning .sl-studio-intro { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.85fr); gap:clamp(28px,6vw,76px); align-items:end; margin-bottom:42px; }
#sym-learning .sl-studio-quote { min-width:0; padding:28px; border:1px solid rgba(244,241,232,.14); border-radius:18px; background:rgba(244,241,232,.045); }
#sym-learning .sl-studio-quote > p:first-child { margin:0; color:var(--sl-cream); font-family:"Cormorant Garamond",Georgia,serif; font-size:clamp(25px,3vw,34px); line-height:1.18; }
#sym-learning .sl-studio-gallery { position:relative; width:100%; height:clamp(300px,48vw,560px); margin:35px 0 48px; overflow:hidden; border:1px solid rgba(244,241,232,.13); border-radius:20px 5px 20px 5px; background:#0b2622; }
#sym-learning .sl-studio-shot { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; opacity:0; transform:scale(1.025); transition:opacity 1s ease,transform 6s ease; }
#sym-learning .sl-studio-shot.is-active { opacity:1; transform:scale(1); }
#sym-learning .sl-studio-gallery::after { content:""; position:absolute; inset:40% 0 0; pointer-events:none; background:linear-gradient(transparent,rgba(8,29,26,.75)); }
#sym-learning .sl-studio-gallery-caption { position:absolute; z-index:2; left:clamp(18px,4vw,38px); right:18px; bottom:25px; display:flex; flex-direction:column; gap:5px; color:var(--sl-cream); }
#sym-learning .sl-studio-gallery-caption span { color:#D4C49D; font-size:9px; letter-spacing:.18em; }
#sym-learning .sl-studio-gallery-caption strong { font-family:"Cormorant Garamond",Georgia,serif; font-size:clamp(24px,3vw,36px); font-weight:500; }
#sym-learning .sl-feature-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; align-items:stretch; }
#sym-learning .sl-feature { position:relative; display:flex; flex-direction:column; min-width:0; padding:clamp(22px,3vw,34px); overflow:hidden; border:1px solid rgba(23,76,69,.13); border-radius:18px 5px 18px 5px; background:var(--sl-cream); color:#343B37; }
#sym-learning .sl-feature-dark { background:#174C45; border-color:rgba(244,241,232,.14); color:var(--sl-cream); }
#sym-learning .sl-feature h3 { margin:0 0 12px; color:var(--sl-green)!important; font-size:clamp(31px,3.4vw,43px); }
#sym-learning .sl-feature-dark h3 { color:var(--sl-cream)!important; }
#sym-learning .sl-feature .sl-eyebrow { margin-bottom:10px; }
#sym-learning .sl-feature p:not(.sl-eyebrow) { color:#4D5852; font-size:14px; line-height:1.75; }
#sym-learning .sl-feature-dark p:not(.sl-eyebrow) { color:rgba(244,241,232,.82); }
#sym-learning .sl-feature-photo { width:100%; height:clamp(190px,23vw,290px); margin:8px 0 20px; object-fit:cover; object-position:center; border-radius:12px; }
#sym-learning .sl-feature-symbol { align-self:flex-end; color:rgba(185,154,99,.7); font-family:"Cormorant Garamond",Georgia,serif; font-size:30px; }
#sym-learning .sl-matsyatra-hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,.8fr); gap:clamp(30px,6vw,80px); align-items:center; }
#sym-learning .sl-matsyatra-visual { min-width:0; min-height:320px; display:flex; align-items:center; justify-content:center; padding:24px; overflow:hidden; border:1px solid rgba(244,241,232,.15); border-radius:22px; background:radial-gradient(circle at center,rgba(95,143,130,.3),rgba(16,47,43,.96) 70%); }
#sym-learning .sl-matsyatra-logo-panel { width:100%; min-height:320px; display:flex; align-items:center; justify-content:center; }
#sym-learning .sl-matsyatra-logo { display:block; width:min(270px,78%); max-height:280px; height:auto; object-fit:contain; transform-origin:center; animation:sl-learning-logo-turn 22s ease-in-out infinite; }
@keyframes sl-learning-logo-turn { 0%,80%,100%{transform:rotate(0) scale(1)} 88%{transform:rotate(5deg) scale(1.025)} 94%{transform:rotate(-3deg) scale(1.01)} }
#sym-learning .sl-matsyatra-bottom { margin-top:40px; padding-top:32px; border-top:1px solid rgba(244,241,232,.13); }
#sym-learning .sl-value-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
#sym-learning .sl-value { position:relative; min-width:0; min-height:120px; padding:22px 20px 20px 82px!important; border:1px solid rgba(244,241,232,.15); border-radius:16px; background:rgba(244,241,232,.045); }
#sym-learning .sl-value-icon { position:absolute; left:18px; top:22px; width:46px; height:46px; object-fit:contain; }
#sym-learning .sl-value strong { display:block; margin:4px 0 7px; color:var(--sl-cream)!important; line-height:1.3; }
#sym-learning .sl-value p { margin:0; color:rgba(244,241,232,.75); font-size:13px; line-height:1.65; }
#sym-learning .sl-topics-photo-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; align-items:stretch; }
#sym-learning .sl-topic { min-width:0; min-height:100%; padding:0!important; overflow:hidden; border:1px solid rgba(23,76,69,.13); border-radius:16px; background:#fffdf7; color:#343B37; }
#sym-learning .sl-topic img { display:block; width:100%; height:clamp(130px,14vw,185px); object-fit:cover; }
#sym-learning .sl-topic > div { padding:16px 16px 19px; }
#sym-learning .sl-topic h4 { margin:0 0 8px; color:var(--sl-green)!important; font-size:23px; }
#sym-learning .sl-topic p { margin:0; color:#4D5852!important; font-size:12px; line-height:1.65; }
#sym-learning .sl-worlds-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; align-items:stretch; }
#sym-learning .sl-world { min-width:0; overflow:hidden; padding:0 0 20px; border:1px solid rgba(244,241,232,.15); border-radius:16px; background:rgba(244,241,232,.045); }
#sym-learning .sl-world-image { width:100%; height:clamp(155px,17vw,210px); object-fit:cover; }
#sym-learning .sl-world h3,#sym-learning .sl-world p { margin-left:17px; margin-right:17px; }
#sym-learning .sl-world h3 { margin-top:17px; margin-bottom:8px; font-size:27px; }
#sym-learning .sl-world p { color:rgba(244,241,232,.76); font-size:12px; line-height:1.65; }
#sym-learning .sl-world-tagline { color:var(--sl-gold)!important; font-weight:700; margin-top:16px; margin-bottom:5px; }
#sym-learning .sl-world-copy { margin-top:0; }
#sym-learning .sl-programmes-intro { max-width:760px; margin-bottom:38px; }
#sym-learning .sl-programme-list { display:grid; gap:16px; }
#sym-learning .sl-programme { display:grid; grid-template-columns:38px minmax(0,1fr) minmax(150px,230px); gap:18px; align-items:start; min-width:0; padding:22px; border:1px solid rgba(244,241,232,.15); border-radius:16px; background:rgba(244,241,232,.045); }
#sym-learning .sl-programme-no { grid-column:1; grid-row:1; color:var(--sl-gold); font-size:12px; }
#sym-learning .sl-programme > div:nth-of-type(2) { grid-column:2; grid-row:1; min-width:0; }
#sym-learning .sl-programme h3 { margin:0 0 8px; font-size:clamp(25px,3vw,34px); color:var(--sl-cream); }
#sym-learning .sl-programme p { margin:0 0 10px; color:rgba(244,241,232,.8); font-size:13px; line-height:1.7; }
#sym-learning .sl-programme-image,#sym-learning .sl-programme-photo { grid-column:3; grid-row:1 / span 2; display:block; width:100%; height:150px; margin:0; object-fit:cover; border-radius:12px; }
#sym-learning .sl-programme .sl-badge { grid-column:2; grid-row:2; justify-self:start; align-self:start; padding:5px 10px; border:1px solid rgba(141,185,180,.3); border-radius:999px; color:var(--sl-aqua); font-size:9px; }
#sym-learning .sl-programme-tag { color:var(--sl-aqua); font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
#sym-learning .sl-everyone-grid { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(28px,6vw,70px); align-items:start; }
#sym-learning .sl-audience-list { display:grid; gap:12px; }
#sym-learning .sl-audience { display:grid; grid-template-columns:38px minmax(0,1fr); gap:12px; align-items:start; padding:16px; border:1px solid rgba(23,76,69,.12); border-radius:12px; background:rgba(23,76,69,.035); }
#sym-learning .sl-audience-num { color:#947744; font-size:11px; }
#sym-learning .sl-audience p { margin:0; color:#4D5852; font-size:13px; }
#sym-learning .sl-closing { padding:clamp(75px,9vw,115px) 0; background:var(--sl-green); color:var(--sl-cream); text-align:center; }
#sym-learning .sl-closing-inner { max-width:850px; }
#sym-learning .sl-closing h2 { margin:0; color:var(--sl-cream)!important; font-size:clamp(43px,6.5vw,78px); line-height:.98; }
#sym-learning .sl-closing h2 em { color:var(--sl-aqua); }
#sym-learning .sl-closing p:not(.sl-eyebrow) { max-width:650px; margin:24px auto; color:rgba(244,241,232,.86); }
#sym-learning .sl-closing .sl-eyebrow { color:#D4C49D; }
#sym-learning .sl-reveal { opacity:1; transform:none; }
#sym-learning a:focus-visible,#sym-learning button:focus-visible { outline:2px solid var(--sl-gold); outline-offset:4px; }
#sym-learning .sl-link-unavailable { opacity:.55; cursor:not-allowed; }

@media (max-width:1000px) {
  #sym-learning .sl-wrap,#sym-learning .sl-hero .sl-wrap { width:min(100% - 44px,800px); }
  #sym-learning .sl-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #sym-learning .sl-card-grid > :last-child { grid-column:1 / -1; }
  #sym-learning .sl-topics-photo-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  #sym-learning .sl-worlds-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #sym-learning .sl-value-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #sym-learning .sl-hero { min-height:780px; min-height:86svh; }
  #sym-learning .sl-hero-image { object-position:58% center; }
  #sym-learning .sl-hero-overlay { background:linear-gradient(90deg,rgba(7,27,24,.9),rgba(7,27,24,.63) 64%,rgba(7,27,24,.34)),linear-gradient(0deg,rgba(7,27,24,.4),transparent 58%); }
  #sym-learning .sl-programme { grid-template-columns:30px minmax(0,1fr) 170px; }
}
@media (max-width:700px) {
  #sym-learning .sl-wrap,#sym-learning .sl-hero .sl-wrap { width:calc(100% - 36px); }
  #sym-learning .sl-section { padding:68px 0; }
  #sym-learning .sl-hero { min-height:760px; min-height:90svh; align-items:flex-end; padding:110px 0 78px; }
  #sym-learning .sl-hero-image { object-position:60% center; }
  #sym-learning .sl-hero-overlay { background:linear-gradient(0deg,rgba(7,27,24,.98) 0%,rgba(7,27,24,.84) 48%,rgba(7,27,24,.2) 100%); }
  #sym-learning .sl-orbit { top:5%; right:-24%; width:75vw; }
  #sym-learning .sl-hero-content { max-width:600px; }
  #sym-learning .sl-hero h1 { font-size:clamp(44px,11.5vw,64px); }
  #sym-learning .sl-hero .sl-copy { font-size:14px; line-height:1.7; }
  #sym-learning .sl-hero-note { display:none; }
  #sym-learning .sl-studio-intro,#sym-learning .sl-matsyatra-hero,#sym-learning .sl-everyone-grid { grid-template-columns:minmax(0,1fr); gap:28px; }
  #sym-learning .sl-feature-grid { grid-template-columns:minmax(0,1fr); }
  #sym-learning .sl-card-grid { grid-template-columns:minmax(0,1fr); }
  #sym-learning .sl-card-grid > :last-child { grid-column:auto; }
  #sym-learning .sl-glass-card { min-height:300px; }
  #sym-learning .sl-topics-photo-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #sym-learning .sl-value-grid { grid-template-columns:minmax(0,1fr); }
  #sym-learning .sl-worlds-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #sym-learning .sl-programme { grid-template-columns:26px minmax(0,1fr); gap:12px; padding:17px; }
  #sym-learning .sl-programme > div:nth-of-type(2) { grid-column:2; grid-row:1; }
  #sym-learning .sl-programme-image,#sym-learning .sl-programme-photo { grid-column:2; grid-row:2; width:100%; height:190px; margin-top:5px; }
  #sym-learning .sl-programme .sl-badge { grid-column:2; grid-row:3; }
  #sym-learning .sl-value { padding:20px 16px 20px 70px!important; }
  #sym-learning .sl-value-icon { left:14px; top:21px; width:40px; height:40px; }
  #sym-learning .sl-studio-gallery { height:clamp(260px,70vw,400px); margin:28px 0 35px; }
  #sym-learning .sl-feature-photo { height:220px; }
}
@media (max-width:420px) {
  #sym-learning .sl-topics-photo-grid,#sym-learning .sl-worlds-grid { grid-template-columns:minmax(0,1fr); }
  #sym-learning .sl-topic img { height:190px; }
  #sym-learning .sl-world-image { height:210px; }
  #sym-learning .sl-hero-actions { align-items:stretch; flex-direction:column; max-width:280px; }
  #sym-learning .sl-btn { width:100%; }
}
@media (prefers-reduced-motion:reduce) {
  #sym-learning .sl-matsyatra-logo { animation:none!important; }
  #sym-learning .sl-studio-shot { transition:none; }
  #sym-learning .sl-btn { transition:none; }
}

/* FINAL LEARNING HERO OVERLAP FIX â€” 22 OCT 2026
   Scoped only to #sym-learning. This deliberately overrides older duplicated rules. */
#sym-learning { width:100% !important; max-width:100% !important; min-width:0 !important; overflow:hidden !important; }
#sym-learning .sl-hero {
  position:relative !important; display:flex !important; align-items:center !important;
  justify-content:flex-end !important; isolation:isolate !important; overflow:hidden !important;
  width:100% !important; min-width:0 !important; min-height:clamp(650px,82vh,850px) !important;
  padding:76px 0 82px !important; background:#102F2B !important; color:#F4F1E8 !important;
}
#sym-learning .sl-hero-image {
  position:absolute !important; inset:0 !important; z-index:0 !important;
  display:block !important; width:100% !important; height:100% !important;
  max-width:none !important; margin:0 !important; object-fit:cover !important;
  object-position:center 48% !important; opacity:1 !important;
}
#sym-learning .sl-hero-overlay {
  position:absolute !important; inset:0 !important; z-index:1 !important; pointer-events:none !important;
  background:linear-gradient(90deg,rgba(8,29,26,.04) 0%,rgba(8,29,26,.10) 34%,rgba(8,29,26,.74) 57%,rgba(8,29,26,.97) 100%) !important;
}
#sym-learning .sl-hero .sl-orbit { z-index:2 !important; pointer-events:none !important; }
#sym-learning .sl-hero .sl-wrap {
  position:relative !important; z-index:3 !important; display:flex !important;
  align-items:center !important; justify-content:flex-end !important;
  width:min(1180px,calc(100% - 64px)) !important; max-width:1180px !important;
  min-width:0 !important; margin:0 auto !important; padding:0 !important;
}
#sym-learning .sl-hero-content {
  position:relative !important; z-index:3 !important; display:block !important;
  flex:0 1 540px !important; width:min(540px,48%) !important; max-width:540px !important;
  min-width:0 !important; margin:0 !important; padding:24px 0 32px !important;
  overflow-wrap:normal !important;
}
#sym-learning .sl-hero h1 {
  display:block !important; width:100% !important; max-width:540px !important;
  margin:0 0 22px !important; color:#F4F1E8 !important;
  font-family:"Cormorant Garamond",Georgia,serif !important;
  font-size:clamp(48px,5.2vw,76px) !important; line-height:.98 !important;
  letter-spacing:-.035em !important; font-weight:400 !important;
  white-space:normal !important; overflow-wrap:normal !important; word-break:normal !important;
}
#sym-learning .sl-hero h1 em { color:#8DB9B4 !important; font-style:italic !important; }
#sym-learning .sl-hero .sl-eyebrow { color:#D4C49D !important; max-width:100% !important; }
#sym-learning .sl-hero .sl-copy {
  width:100% !important; max-width:510px !important; margin:0 !important;
  color:rgba(244,241,232,.9) !important; font-size:15px !important; line-height:1.75 !important;
  overflow-wrap:break-word !important;
}
#sym-learning .sl-hero-actions { display:flex !important; flex-wrap:wrap !important; gap:10px !important; margin-top:25px !important; }
#sym-learning .sl-hero-note { position:absolute !important; z-index:4 !important; right:24px !important; bottom:22px !important; max-width:calc(100% - 48px) !important; }
#sym-learning .sl-hero img:not(.sl-hero-image) { position:relative; z-index:3; }
@media(max-width:900px) {
  #sym-learning .sl-hero { min-height:760px !important; min-height:86svh !important; }
  #sym-learning .sl-hero .sl-wrap { width:calc(100% - 48px) !important; }
  #sym-learning .sl-hero-content { width:min(560px,62%) !important; flex-basis:560px !important; }
  #sym-learning .sl-hero-image { object-position:44% center !important; }
  #sym-learning .sl-hero-overlay { background:linear-gradient(90deg,rgba(8,29,26,.08),rgba(8,29,26,.52) 35%,rgba(8,29,26,.94) 100%) !important; }
  #sym-learning .sl-hero h1 { font-size:clamp(46px,6.5vw,66px) !important; }
}
@media(max-width:600px) {
  #sym-learning .sl-hero { min-height:780px !important; min-height:92svh !important; align-items:flex-end !important; padding:300px 0 72px !important; }
  #sym-learning .sl-hero .sl-wrap { width:calc(100% - 36px) !important; justify-content:flex-start !important; }
  #sym-learning .sl-hero-image { object-position:57% 30% !important; }
  #sym-learning .sl-hero-overlay { background:linear-gradient(0deg,rgba(8,29,26,.99) 0%,rgba(8,29,26,.94) 35%,rgba(8,29,26,.25) 78%,rgba(8,29,26,.10) 100%) !important; }
  #sym-learning .sl-hero-content { flex:1 1 100% !important; width:100% !important; max-width:100% !important; padding:0 !important; }
  #sym-learning .sl-hero h1 { max-width:100% !important; font-size:clamp(43px,11vw,58px) !important; line-height:.99 !important; letter-spacing:-.03em !important; }
  #sym-learning .sl-hero .sl-copy { max-width:100% !important; font-size:14px !important; }
  #sym-learning .sl-hero-actions { align-items:stretch !important; }
  #sym-learning .sl-hero-note { display:none !important; }
}


/* FINAL ALIGNMENT OVERRIDE â€” Learning page only */
#sym-learning { width:100% !important; max-width:none !important; min-width:0 !important; margin:0 !important; padding:0 !important; overflow:hidden !important; }
#sym-learning .sl-hero {
  position:relative !important; display:flex !important; align-items:center !important; justify-content:center !important;
  isolation:isolate !important; overflow:hidden !important; width:100vw !important; max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important; min-height:clamp(650px,84vh,880px) !important;
  padding:80px 0 88px !important; background:#102F2B !important; color:#F4F1E8 !important;
}
#sym-learning .sl-hero-image { position:absolute !important; inset:0 !important; z-index:0 !important; display:block !important; width:100% !important; height:100% !important; max-width:none !important; margin:0 !important; object-fit:cover !important; object-position:center 48% !important; }
#sym-learning .sl-hero-overlay { position:absolute !important; inset:0 !important; z-index:1 !important; pointer-events:none !important; background:linear-gradient(90deg,rgba(8,29,26,.10) 0%,rgba(8,29,26,.22) 38%,rgba(8,29,26,.78) 62%,rgba(8,29,26,.97) 100%),linear-gradient(0deg,rgba(8,29,26,.30),transparent 48%) !important; }
#sym-learning .sl-hero .sl-orbit { position:absolute !important; z-index:2 !important; pointer-events:none !important; }
#sym-learning .sl-hero .sl-wrap { position:relative !important; z-index:3 !important; display:flex !important; align-items:center !important; justify-content:flex-end !important; width:min(1180px,calc(100% - 64px)) !important; max-width:1180px !important; min-width:0 !important; margin:0 auto !important; padding:0 !important; }
#sym-learning .sl-hero-content { position:relative !important; z-index:3 !important; display:block !important; flex:0 1 520px !important; width:min(520px,44%) !important; max-width:520px !important; min-width:0 !important; margin:0 !important; padding:20px 0 !important; }
#sym-learning .sl-hero h1 { display:block !important; width:100% !important; max-width:520px !important; margin:0 0 22px !important; color:#F4F1E8 !important; font-family:"Cormorant Garamond",Georgia,serif !important; font-size:clamp(48px,5.3vw,76px) !important; line-height:.98 !important; letter-spacing:-.035em !important; font-weight:400 !important; white-space:normal !important; overflow-wrap:normal !important; word-break:normal !important; }
#sym-learning .sl-hero h1 em { color:#8DB9B4 !important; font-style:italic !important; }
#sym-learning .sl-hero .sl-eyebrow { color:#D4C49D !important; max-width:100% !important; }
#sym-learning .sl-hero .sl-copy { display:block !important; width:100% !important; max-width:500px !important; margin:0 !important; color:rgba(244,241,232,.92) !important; font-size:15px !important; line-height:1.75 !important; overflow-wrap:break-word !important; }
#sym-learning .sl-hero-actions { display:flex !important; flex-wrap:wrap !important; gap:10px !important; margin-top:25px !important; }
#sym-learning .sl-hero-note { position:absolute !important; z-index:4 !important; right:max(24px,calc((100vw - 1180px)/2)) !important; bottom:22px !important; max-width:calc(100% - 48px) !important; color:#F4F1E8 !important; }
@media(max-width:900px) {
 #sym-learning .sl-hero { min-height:780px !important; min-height:88svh !important; }
 #sym-learning .sl-hero .sl-wrap { width:calc(100% - 48px) !important; }
 #sym-learning .sl-hero-content { flex:0 1 500px !important; width:min(500px,58%) !important; }
 #sym-learning .sl-hero h1 { font-size:clamp(46px,6.5vw,66px) !important; }
 #sym-learning .sl-hero-overlay { background:linear-gradient(90deg,rgba(8,29,26,.18),rgba(8,29,26,.56) 42%,rgba(8,29,26,.96) 100%) !important; }
}
@media(max-width:600px) {
 #sym-learning .sl-hero { min-height:820px !important; min-height:94svh !important; align-items:flex-end !important; padding:300px 0 70px !important; }
 #sym-learning .sl-hero .sl-wrap { width:calc(100% - 36px) !important; justify-content:flex-start !important; }
 #sym-learning .sl-hero-image { object-position:57% 30% !important; }
 #sym-learning .sl-hero-overlay { background:linear-gradient(0deg,rgba(8,29,26,.99) 0%,rgba(8,29,26,.93) 40%,rgba(8,29,26,.25) 80%,rgba(8,29,26,.10) 100%) !important; }
 #sym-learning .sl-hero-content { flex:1 1 100% !important; width:100% !important; max-width:100% !important; padding:0 !important; }
 #sym-learning .sl-hero h1 { max-width:100% !important; font-size:clamp(43px,11vw,58px) !important; line-height:.99 !important; }
 #sym-learning .sl-hero .sl-copy { max-width:100% !important; font-size:14px !important; }
 #sym-learning .sl-hero-actions { align-items:stretch !important; flex-direction:column !important; max-width:300px !important; }
 #sym-learning .sl-hero-note { display:none !important; }
}


/* ================================================================
   LEARNING @ SYMFINY â€” VISUAL POLISH PASS (22 OCT 2026)
   Scoped exclusively to #sym-learning. Shared stylesheet only.
   ================================================================ */
#sym-learning .sl-hero-video {
  position:absolute!important; inset:0!important; z-index:0!important;
  display:block!important; width:100%!important; height:100%!important;
  max-width:none!important; margin:0!important; object-fit:cover!important;
  object-position:center 48%!important; background:#102F2B!important;
  opacity:.92!important; transform:scale(1.015); 
}
#sym-learning .sl-hero-overlay {
  background:linear-gradient(90deg,rgba(7,29,26,.12) 0%,rgba(7,29,26,.18) 34%,rgba(7,29,26,.72) 58%,rgba(7,29,26,.96) 100%),
             linear-gradient(0deg,rgba(7,29,26,.48),transparent 48%)!important;
}
#sym-learning .sl-hero-content { width:min(470px,42%)!important; max-width:470px!important; padding:34px 0!important; }
#sym-learning .sl-hero .sl-eyebrow { margin:0 0 22px!important; color:#D8C69B!important; font-size:10px!important; letter-spacing:.24em!important; line-height:1.7!important; }
#sym-learning .sl-hero h1 { max-width:470px!important; font-size:clamp(54px,6.1vw,84px)!important; line-height:.91!important; letter-spacing:-.045em!important; text-wrap:balance; margin-bottom:26px!important; text-shadow:0 2px 26px rgba(0,0,0,.12); }
#sym-learning .sl-hero h1 em { color:#9BC9C0!important; }
#sym-learning .sl-hero .sl-copy { max-width:420px!important; color:rgba(244,241,232,.86)!important; font-size:14px!important; line-height:1.85!important; }
#sym-learning .sl-hero-actions { gap:12px!important; margin-top:28px!important; }
#sym-learning .sl-matsyatra-logo-panel { min-height:260px!important; display:flex!important; align-items:center!important; justify-content:center!important; position:relative!important; overflow:hidden!important; border:1px solid rgba(244,241,232,.12)!important; border-radius:28px!important; background:radial-gradient(ellipse at 50% 45%,rgba(141,185,180,.17),rgba(16,47,43,.15) 48%,rgba(5,26,23,.28) 100%)!important; }
#sym-learning .sl-matsyatra-logo { width:min(230px,64%)!important; max-height:230px!important; object-fit:contain!important; transform-origin:center!important; animation:slMatsyatraFloat 7s ease-in-out infinite,slMatsyatraGlow 5.5s ease-in-out infinite!important; filter:drop-shadow(0 12px 25px rgba(0,0,0,.14)); }
@keyframes slMatsyatraFloat { 0%,100%{transform:translateY(0) rotate(-1deg)} 50%{transform:translateY(-8px) rotate(1deg)} }
@keyframes slMatsyatraGlow { 0%,100%{filter:drop-shadow(0 8px 18px rgba(141,185,180,.10))} 50%{filter:drop-shadow(0 12px 28px rgba(141,185,180,.24))} }
#sym-learning .sl-programme-photo { width:100%!important; height:112px!important; max-height:112px!important; object-fit:contain!important; object-position:left center!important; margin:10px 0 4px!important; border-radius:10px!important; background:linear-gradient(120deg,rgba(141,185,180,.08),rgba(244,241,232,.025))!important; }
#sym-learning .sl-programme { align-items:start!important; }
#sym-learning .sl-programme > div:nth-of-type(2) { min-width:0!important; }
#sym-learning .sl-programme h3 { margin:6px 0 8px!important; }
#sym-learning .sl-programme-tag { color:#8DB9B4!important; }
#sym-learning .sl-programme p { color:rgba(244,241,232,.78)!important; }
#sym-learning .sl-matsyatra-sound { display:grid!important; grid-template-columns:minmax(0,1fr) minmax(250px,.85fr)!important; align-items:center!important; gap:24px!important; margin:38px 0 64px!important; padding:24px 28px!important; border:1px solid rgba(244,241,232,.13)!important; border-radius:22px!important; background:linear-gradient(115deg,rgba(141,185,180,.13),rgba(244,241,232,.045) 55%,rgba(185,154,99,.07)),rgba(7,29,26,.28)!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.045)!important; }
#sym-learning .sl-matsyatra-sound .sl-eyebrow { margin-bottom:8px!important; }
#sym-learning .sl-matsyatra-sound h3 { margin:0!important; color:#F4F1E8!important; font-size:clamp(24px,3vw,34px)!important; }
#sym-learning .sl-matsyatra-sound p { margin:8px 0 0!important; color:rgba(244,241,232,.72)!important; font-size:13px!important; line-height:1.7!important; }
#sym-learning .sl-matsyatra-audio { display:block!important; width:100%!important; max-width:100%!important; min-width:0!important; accent-color:#8DB9B4; }
#sym-learning .sl-matsyatra-audio.sl-audio-needs-tap { outline:1px solid rgba(185,154,99,.5); outline-offset:4px; }
@media(max-width:900px) {
 #sym-learning .sl-hero-content { width:min(520px,58%)!important; max-width:520px!important; }
 #sym-learning .sl-hero h1 { font-size:clamp(48px,7vw,68px)!important; }
 #sym-learning .sl-programme-photo { height:100px!important; max-height:100px!important; }
}
@media(max-width:600px) {
 #sym-learning .sl-hero { align-items:flex-end!important; padding:290px 0 64px!important; }
 #sym-learning .sl-hero-content { width:100%!important; max-width:100%!important; padding:0!important; }
 #sym-learning .sl-hero h1 { font-size:clamp(46px,12vw,62px)!important; max-width:100%!important; }
 #sym-learning .sl-hero-overlay { background:linear-gradient(0deg,rgba(7,29,26,.99) 0%,rgba(7,29,26,.91) 39%,rgba(7,29,26,.18) 100%)!important; }
 #sym-learning .sl-programme-photo { height:130px!important; max-height:130px!important; object-position:center!important; }
 #sym-learning .sl-matsyatra-logo-panel { min-height:220px!important; }
 #sym-learning .sl-matsyatra-logo { width:min(190px,60%)!important; }
 #sym-learning .sl-matsyatra-sound { grid-template-columns:minmax(0,1fr)!important; gap:16px!important; padding:20px!important; margin:28px 0 48px!important; }
}
@media(prefers-reduced-motion:reduce) { #sym-learning .sl-matsyatra-logo { animation:none!important; } #sym-learning .sl-hero-video { transform:none!important; } }


/* OCT 2026 CTA + STUDIO REFINEMENTS â€” scoped to Learning page */
#sym-learning .sl-studio-intro { align-items:stretch; gap:clamp(24px,4vw,64px); }
#sym-learning .sl-studio-intro > *, #sym-learning .sl-studio-quote { min-width:0; }
#sym-learning .sl-studio-quote { align-self:stretch; display:flex; flex-direction:column; justify-content:center; padding:clamp(22px,3vw,38px); border:1px solid rgba(244,241,232,.14); border-radius:22px; background:linear-gradient(135deg,rgba(141,185,180,.13),rgba(16,47,43,.18) 62%,rgba(185,154,99,.08)); box-shadow:inset 0 1px 0 rgba(255,255,255,.05); }
#sym-learning .sl-studio-mantra { margin:0; color:#F4F1E8; font-family:"Cormorant Garamond",Georgia,serif; font-size:clamp(27px,3.1vw,43px); line-height:1.08; letter-spacing:-.025em; }
#sym-learning .sl-studio-mantra em { color:#8DB9B4; font-style:italic; }
#sym-learning .sl-studio-gallery { margin-top:clamp(22px,3vw,38px); }
#sym-learning .sl-programme-photo { display:block; width:min(100%,260px); height:115px; object-fit:contain; object-position:left center; margin:12px 0 18px; border-radius:10px; background:linear-gradient(135deg,rgba(141,185,180,.08),rgba(16,47,43,.08)); }
#sym-learning .sl-programme { align-items:start; }
@media(max-width:700px){
 #sym-learning .sl-studio-intro { grid-template-columns:minmax(0,1fr); }
 #sym-learning .sl-studio-quote { padding:22px; }
 #sym-learning .sl-programme-photo { width:min(100%,230px); height:100px; }
}


/* HERO FINAL TWEAK â€” new 15-second video and improved header clearance */
#sym-learning .sl-hero { position:relative!important; overflow:hidden!important; }
#sym-learning .sl-hero-video { position:absolute!important; inset:0!important; width:100%!important; height:100%!important; object-fit:cover!important; z-index:0!important; }
#sym-learning .sl-hero-overlay { z-index:1!important; }
#sym-learning .sl-hero .sl-wrap { position:relative!important; z-index:2!important; justify-content:flex-start!important; padding-top:clamp(46px,6vh,82px)!important; }
#sym-learning .sl-hero-content { width:min(500px,48%)!important; max-width:500px!important; margin:clamp(18px,3vh,38px) 0 0!important; padding:28px 0 34px!important; }
#sym-learning .sl-hero h1 { max-width:500px!important; font-size:clamp(48px,5.7vw,78px)!important; line-height:.98!important; }
@media(max-width:900px) {
 #sym-learning .sl-hero .sl-wrap { padding-top:70px!important; }
 #sym-learning .sl-hero-content { width:min(520px,66%)!important; max-width:520px!important; }
}
@media(max-width:600px) {
 #sym-learning .sl-hero { align-items:flex-end!important; padding:0 0 58px!important; }
 #sym-learning .sl-hero .sl-wrap { width:calc(100% - 36px)!important; padding-top:280px!important; justify-content:flex-start!important; }
 #sym-learning .sl-hero-content { width:100%!important; max-width:100%!important; margin:0!important; padding:0!important; }
 #sym-learning .sl-hero h1 { font-size:clamp(43px,11vw,58px)!important; }
}