/* ===================================
   LOQOS — Qadın Uzunömürlülük Rezidensiyası
   Main stylesheet
   =================================== */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Inter:wght@300;400;500;600;700&display=swap');

:root {
  /* LOQOS palette (teal-led, warm sand accent) */
  --primary:        #3DAAB0;
  --primary-dark:   #268A90;
  --primary-light:  #A8DCE0;
  --primary-pale:   #EAF4F5;
  --secondary:      #5E8A93;
  --accent-warm:    #E5DDC9;
  --accent-sand:    #DDCEBD;
  --accent-sage:    #B2D4CE;
  --bg:             #F7FBFC;
  --warm-white:     #FDFEFE;
  --cream:          #EAF4F5;
  --text:           #1F3B44;
  --text-body:      #4A6670;
  --text-light:     #7A949D;
  --border:         #D5E8EA;
  --dark-bg:        #153036;
  --shadow:         0 2px 15px rgba(21,48,54,.06);
  --shadow-lg:      0 10px 32px rgba(21,48,54,.10);
  --font-heading:   'Playfair Display', Georgia, serif;
  --font-body:      'Inter', 'Segoe UI', sans-serif;
  --transition:     .35s cubic-bezier(.4,0,.2,1);
}

/* Reset */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-body);
  color: var(--text-body);
  background: var(--bg);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { max-width:100%; display:block; }
a { text-decoration:none; color:inherit; transition: color var(--transition); }
ul, ol { list-style:none; }
button { cursor:pointer; border:none; background:none; font-family:inherit; }
h1,h2,h3,h4,h5 { font-family: var(--font-heading); font-weight:600; line-height:1.25; color: var(--text); }
h1 { font-size: clamp(2.2rem, 4.5vw, 3.6rem); }
h2 { font-size: clamp(1.6rem, 3vw, 2.5rem); }
h3 { font-size: clamp(1.1rem, 2vw, 1.5rem); }
p { color: var(--text-body); font-size: .95rem; }

/* Utilities */
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.section { padding: 80px 0; }
.section-alt { background: var(--primary-pale); }
.section-sand {
  background:
    radial-gradient(ellipse at 20% 0%, rgba(168,220,224,.25) 0%, transparent 55%),
    linear-gradient(180deg, #F5EEE0 0%, var(--accent-sand) 100%);
}
.section-header { text-align:center; margin-bottom: 3.5rem; }
.section-header h2 { margin-bottom: .6rem; }
.section-header p { max-width: 620px; margin: 0 auto; font-size: 1rem; }
.accent-line {
  width: 0; height: 3px; background: linear-gradient(90deg, var(--primary), var(--primary-dark));
  margin: 1rem auto; border-radius: 2px;
  transition: width .9s cubic-bezier(.2,.6,.2,1) .15s;
}
.section-header.in .accent-line,
.in .accent-line,
section.fade-in.in .accent-line,
.fade-in.in .accent-line { width: 56px; }
/* Fallback: if IO never fires (e.g., IO unsupported), show at full */
.no-io .accent-line { width: 56px; }

.eyebrow {
  display:inline-block; font-family: var(--font-body);
  font-size: .78rem; font-weight: 600; letter-spacing: .14em;
  color: var(--primary-dark); text-transform: uppercase;
  margin-bottom: .6rem;
}

/* Image fills */
.hero-img-placeholder img,
.about-img-placeholder img,
.room-img-placeholder img,
.gallery-item img,
.news-img img,
.transp-media img,
.event-card .event-visual img { width:100%; height:100%; object-fit:cover; border-radius:inherit; display:block; }

/* ===================================
   MOTION SYSTEM
   =================================== */
/* Respect users who prefer no motion */
@media (prefers-reduced-motion: reduce) {
  .fade-in, .fade-in.in { opacity: 1 !important; transform: none !important; transition: none !important; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}

/* Scroll-reveal base (JS adds .in when intersecting) */
.fade-in {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity .8s cubic-bezier(.2,.6,.2,1), transform .8s cubic-bezier(.2,.6,.2,1);
  will-change: opacity, transform;
}
.fade-in.in { opacity: 1; transform: translateY(0); }

/* Variants */
.fade-in.from-left  { transform: translateX(-40px); }
.fade-in.from-right { transform: translateX(40px); }
.fade-in.zoom-in    { transform: scale(.94); }
.fade-in.from-left.in, .fade-in.from-right.in, .fade-in.zoom-in.in { transform: none; }

/* Stagger within common grids (children delay) */
.trust-grid > .fade-in,
.promise-grid > .fade-in,
.features-grid > .fade-in,
.services-grid > .fade-in,
.pillar-grid > .fade-in,
.signature-grid > .fade-in,
.events-grid > .fade-in,
.family-grid > .fade-in,
.mission-grid > .fade-in,
.rooms-grid > .fade-in,
.gallery-grid > .fade-in,
.protocol-grid > .fade-in,
.schedule-list > .fade-in {
  transition-delay: 0s;
}
.trust-grid > .fade-in:nth-child(2),
.promise-grid > .fade-in:nth-child(2),
.features-grid > .fade-in:nth-child(2),
.services-grid > .fade-in:nth-child(2),
.pillar-grid > .fade-in:nth-child(2),
.signature-grid > .fade-in:nth-child(2),
.events-grid > .fade-in:nth-child(2),
.family-grid > .fade-in:nth-child(2),
.mission-grid > .fade-in:nth-child(2),
.rooms-grid > .fade-in:nth-child(2),
.gallery-grid > .fade-in:nth-child(2),
.protocol-grid > .fade-in:nth-child(2),
.schedule-list > .fade-in:nth-child(2) { transition-delay: .08s; }
.trust-grid > .fade-in:nth-child(3),
.promise-grid > .fade-in:nth-child(3),
.features-grid > .fade-in:nth-child(3),
.services-grid > .fade-in:nth-child(3),
.pillar-grid > .fade-in:nth-child(3),
.signature-grid > .fade-in:nth-child(3),
.events-grid > .fade-in:nth-child(3),
.family-grid > .fade-in:nth-child(3),
.mission-grid > .fade-in:nth-child(3),
.rooms-grid > .fade-in:nth-child(3),
.gallery-grid > .fade-in:nth-child(3),
.protocol-grid > .fade-in:nth-child(3),
.schedule-list > .fade-in:nth-child(3) { transition-delay: .16s; }
.trust-grid > .fade-in:nth-child(4),
.promise-grid > .fade-in:nth-child(4),
.features-grid > .fade-in:nth-child(4),
.services-grid > .fade-in:nth-child(4),
.pillar-grid > .fade-in:nth-child(4),
.signature-grid > .fade-in:nth-child(4),
.events-grid > .fade-in:nth-child(4),
.family-grid > .fade-in:nth-child(4),
.mission-grid > .fade-in:nth-child(4),
.gallery-grid > .fade-in:nth-child(4),
.protocol-grid > .fade-in:nth-child(4),
.schedule-list > .fade-in:nth-child(4) { transition-delay: .24s; }
.features-grid > .fade-in:nth-child(5),
.services-grid > .fade-in:nth-child(5),
.pillar-grid > .fade-in:nth-child(5),
.events-grid > .fade-in:nth-child(5),
.family-grid > .fade-in:nth-child(5),
.protocol-grid > .fade-in:nth-child(5),
.schedule-list > .fade-in:nth-child(5) { transition-delay: .32s; }
.features-grid > .fade-in:nth-child(6),
.services-grid > .fade-in:nth-child(6),
.pillar-grid > .fade-in:nth-child(6),
.events-grid > .fade-in:nth-child(6),
.family-grid > .fade-in:nth-child(6),
.schedule-list > .fade-in:nth-child(6) { transition-delay: .40s; }
.features-grid > .fade-in:nth-child(7),
.schedule-list > .fade-in:nth-child(7) { transition-delay: .48s; }
.schedule-list > .fade-in:nth-child(8) { transition-delay: .56s; }
.schedule-list > .fade-in:nth-child(9) { transition-delay: .64s; }

/* Ambient motion keyframes */
@keyframes floatY {
  0%,100% { transform: translateY(0); }
  50%     { transform: translateY(-10px); }
}
@keyframes breathe {
  0%,100% { transform: scale(1); filter: brightness(1); }
  50%     { transform: scale(1.03); filter: brightness(1.04); }
}
@keyframes driftA {
  0%   { transform: translate(0,0) scale(1); }
  50%  { transform: translate(30px,-20px) scale(1.06); }
  100% { transform: translate(0,0) scale(1); }
}
@keyframes driftB {
  0%   { transform: translate(0,0) scale(1); }
  50%  { transform: translate(-22px,18px) scale(1.05); }
  100% { transform: translate(0,0) scale(1); }
}
@keyframes shimmerSheen {
  0%   { transform: translateX(-120%); }
  60%  { transform: translateX(120%); }
  100% { transform: translateX(120%); }
}
@keyframes accentGrow {
  from { width: 0; }
  to   { width: 56px; }
}
@keyframes pulseRing {
  0%   { box-shadow: 0 0 0 0 rgba(61,170,176,.5); }
  80%  { box-shadow: 0 0 0 14px rgba(61,170,176,0); }
  100% { box-shadow: 0 0 0 0 rgba(61,170,176,0); }
}
@keyframes rotateSlow {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
@keyframes gradientShift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* Page-load veil: body fades in after first paint */
body { opacity: 0; animation: pageIn .55s ease-out .05s forwards; }
@keyframes pageIn { to { opacity: 1; } }

/* Buttons */
.btn {
  display: inline-flex; align-items:center; gap:.5rem;
  padding: .9rem 2rem; border-radius: 50px;
  font-weight: 600; font-size: .9rem; letter-spacing:.02em;
  transition: all var(--transition);
}
.btn { position: relative; overflow: hidden; }
.btn::before {
  content:''; position:absolute; top:50%; left:50%;
  width:0; height:0; border-radius:50%;
  background: rgba(255,255,255,.2);
  transform: translate(-50%,-50%);
  transition: width .5s ease, height .5s ease;
  z-index: 0;
}
.btn > * { position: relative; z-index: 1; }
.btn:hover::before { width: 300px; height: 300px; }

.btn-primary { background: var(--primary); color:#fff; }
.btn-primary:hover { background: var(--primary-dark); transform:translateY(-3px); box-shadow: 0 10px 28px rgba(61,170,176,.45); }
.btn-outline { border: 2px solid var(--primary); color: var(--primary); padding: calc(.9rem - 2px) calc(2rem - 2px); }
.btn-outline:hover { background: var(--primary); color:#fff; transform:translateY(-3px); box-shadow: 0 8px 22px rgba(61,170,176,.3); }
.btn-secondary { background: var(--accent-sand); color: var(--text); }
.btn-secondary:hover { background: #CFBEA7; transform:translateY(-2px); box-shadow: 0 8px 22px rgba(221,206,189,.5); }
.btn-white { background:#fff; color: var(--primary-dark); font-weight:700; }
.btn-white:hover { background: var(--primary-pale); transform:translateY(-2px); }

/* ===================================
   NAVIGATION
   =================================== */
.navbar {
  position: fixed; top:0; left:0; right:0;
  height: 78px; z-index:1000;
  background: rgba(253,254,254,.78);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid transparent;
  box-shadow: 0 0 0 rgba(21,48,54,0);
  transition: background .35s ease, box-shadow .35s ease, border-color .35s ease, height .35s ease;
}
.navbar.scrolled {
  background: rgba(253,254,254,.98);
  border-bottom-color: var(--border);
  box-shadow: 0 6px 22px rgba(21,48,54,.08);
  height: 66px;
}
.nav-logo-mark {
  transition: transform .4s cubic-bezier(.4,0,.2,1), box-shadow .4s;
}
.nav-logo a:hover .nav-logo-mark {
  transform: rotate(-6deg) scale(1.06);
  box-shadow: 0 8px 22px rgba(61,170,176,.35);
}
.nav-container {
  max-width: 1280px; margin:0 auto; padding: 0 24px;
  display:flex; align-items:center; justify-content:space-between; height:100%;
}

/* Wordmark logo */
.nav-logo a {
  display:inline-flex; align-items:center; gap:.65rem;
}
.nav-logo-mark {
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--primary-pale);
  display:flex; align-items:center; justify-content:center;
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(61,170,176,.22);
  flex-shrink: 0;
}
.nav-logo-mark img {
  width: 150%; height: 150%; object-fit: cover; object-position: 50% 38%;
  display: block;
}
.nav-logo-text {
  display:flex; flex-direction:column; line-height:1;
}
.nav-logo-text .brand {
  font-family: var(--font-heading); font-size: 1.45rem; font-weight: 700;
  color: var(--primary-dark); letter-spacing: .02em;
}
.nav-logo-text .sub {
  font-family: var(--font-body); font-size: .62rem; font-weight: 500;
  color: var(--text-light); letter-spacing: .08em; text-transform: uppercase;
  margin-top: 2px;
}

.nav-menu {
  display:flex; list-style:none; gap:0; align-items:center;
}
.nav-menu > li { position:relative; }
.nav-menu > li > a,
.nav-menu > li > .dropdown-toggle {
  display:inline-flex; align-items:center; gap:.3rem;
  font-size:.88rem; font-weight:500; color: var(--text-body);
  padding:.6rem .9rem; position:relative; letter-spacing:.01em;
  cursor:pointer; white-space:nowrap; transition: color var(--transition);
}
.nav-menu > li > a::after {
  content:''; position:absolute; bottom:0; left:.9rem; right:.9rem;
  height:2px; background: var(--primary);
  transform:scaleX(0); transition: transform var(--transition);
}
.nav-menu > li > a:hover::after,
.nav-menu > li > a.active::after { transform:scaleX(1); }
.nav-menu > li > a:hover,
.nav-menu > li > a.active,
.nav-menu > li > .dropdown-toggle:hover { color: var(--primary-dark); }
.dropdown-toggle .arrow { font-size:.6rem; transition: transform .3s; margin-top:1px; }
.nav-menu > li:hover > .dropdown-toggle .arrow,
.nav-menu > li.open > .dropdown-toggle .arrow { transform:rotate(180deg); }

/* Dropdown */
.dropdown {
  position:absolute; top:100%; left:0;
  min-width:max-content; background:#fff;
  border-radius:14px; padding:.55rem 0;
  box-shadow: 0 14px 44px rgba(21,48,54,.12);
  border:1px solid var(--border);
  opacity:0; visibility:hidden;
  transform:translateY(8px);
  transition: opacity .25s ease, visibility .25s ease, transform .25s ease;
  z-index:100;
}
.nav-menu > li:hover > .dropdown,
.nav-menu > li.open > .dropdown {
  opacity:1; visibility:visible; transform:translateY(0);
}
.dropdown a {
  display:flex; align-items:center; gap:.7rem;
  padding:.65rem 1.2rem; font-size:.87rem; font-weight:500;
  color: var(--text-body);
  white-space: nowrap;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
.dropdown a:hover {
  background: var(--primary-pale); color: var(--primary-dark);
  transform: translateX(4px);
}
.dropdown a .dd-icon {
  font-size:1rem; width:22px; text-align:center;
  transition: transform .25s ease;
}
.dropdown a:hover .dd-icon { transform: translateX(2px); }

.nav-language {
  display:flex; gap:.3rem; margin-left:.8rem;
  background: var(--primary-pale); border-radius:50px; padding:.22rem;
}
.lang-btn {
  padding:.32rem .7rem; font-size:.72rem; font-weight:700; border-radius:50px;
  color: var(--text-light); transition: all var(--transition);
}
.lang-btn.active { background: var(--primary); color:#fff; box-shadow: 0 2px 8px rgba(61,170,176,.3); }
.lang-btn:hover:not(.active) { color: var(--primary-dark); }

.hamburger { display:none; flex-direction:column; gap:5px; width:26px; padding:3px 0; cursor:pointer; }
.hamburger span { height:2px; background: var(--text); border-radius:2px; transition: all .3s; }

@media (max-width:1100px) {
  .hamburger { display:flex; }
  .nav-logo-text .sub { display:none; }
  .nav-menu {
    position:fixed; top:78px; left:0; right:0; bottom:0;
    background: var(--warm-white); flex-direction:column;
    padding:1.5rem 24px; gap:0; overflow-y:auto;
    border-bottom: 1px solid var(--border);
    box-shadow: 0 10px 30px var(--shadow);
    transform:translateX(100%); transition: transform .4s ease;
  }
  .nav-menu.active { transform:translateX(0); }
  .nav-menu > li { width:100%; border-bottom:1px solid var(--border); }
  .nav-menu > li > a,
  .nav-menu > li > .dropdown-toggle { display:flex; padding:.9rem 0; font-size:.95rem; width:100%; }
  .nav-menu > li > a::after { display:none; }

  .dropdown {
    position:static; opacity:1; visibility:visible; transform:none;
    box-shadow:none; border:none; border-radius:0;
    max-height:0; overflow:hidden; padding:0;
    transition: max-height .35s ease;
    background: var(--primary-pale);
  }
  .nav-menu > li.open > .dropdown { max-height:400px; padding:.3rem 0; }
  .dropdown a { padding:.65rem 1rem .65rem 1.5rem; white-space: normal; }
  .nav-language { margin-left:0; margin-top:1rem; align-self:flex-start; }
}

/* ===================================
   HERO (home)
   =================================== */
.hero {
  position:relative; min-height:92vh; display:flex; align-items:center;
  background:
    radial-gradient(ellipse at 80% 0%, rgba(168,220,224,.5) 0%, transparent 55%),
    radial-gradient(ellipse at 20% 100%, rgba(229,221,201,.35) 0%, transparent 55%),
    linear-gradient(135deg, var(--primary-pale) 0%, var(--bg) 100%);
  overflow:hidden; padding-top:78px;
}
.hero::before {
  content:''; position:absolute; top:-20%; right:-15%;
  width:700px; height:700px;
  background: radial-gradient(circle, rgba(61,170,176,.10) 0%, transparent 70%);
  border-radius:50%;
  animation: driftA 18s ease-in-out infinite;
}
.hero::after {
  content:''; position:absolute; bottom:-25%; left:-10%;
  width:520px; height:520px;
  background: radial-gradient(circle, rgba(221,206,189,.55) 0%, transparent 70%);
  border-radius:50%;
  animation: driftB 22s ease-in-out infinite;
  z-index: 0;
}
.hero-logo-embed { animation: floatY 6s ease-in-out infinite; }
.hero-badge { animation: floatY 7s ease-in-out infinite 1.2s; }
.hero-badge .badge-icon { animation: pulseRing 2.4s ease-out infinite; }
.hero .container {
  position:relative; z-index:2;
  display:grid; grid-template-columns: 1.1fr 1fr; gap:3rem; align-items:center;
}
.hero-content h1 { margin-bottom:1.2rem; }
.hero-content h1 em { font-style:italic; color: var(--primary-dark); font-family: var(--font-heading); }
.hero-content > p { font-size:1.1rem; margin-bottom:2rem; max-width:520px; color: var(--text-body); }
.hero-buttons { display:flex; gap:1rem; flex-wrap:wrap; }
.hero-visual {
  position:relative;
  display:flex; align-items:center; justify-content:center;
}
.hero-img-placeholder {
  width:100%; height:460px;
  background:
    linear-gradient(135deg, var(--primary-light) 0%, var(--accent-sage) 100%);
  border-radius: 20px; display:flex; align-items:center; justify-content:center;
  box-shadow: var(--shadow-lg);
  overflow:hidden; position:relative;
}
.hero-img-placeholder::after {
  content:''; position:absolute; inset:0;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.25), transparent 60%);
}
.hero-logo-embed {
  max-width: 70%; max-height: 70%;
  filter: drop-shadow(0 4px 14px rgba(21,48,54,.12));
  position:relative; z-index:2;
}
.hero-badge {
  position:absolute; bottom:-18px; right:-16px;
  background:#fff; padding:1rem 1.4rem; border-radius:14px;
  box-shadow: var(--shadow-lg); display:flex; align-items:center; gap:.8rem;
  z-index:3;
}
.hero-badge .badge-icon {
  width:44px; height:44px; background: var(--primary); border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:1.2rem; color:#fff;
  flex-shrink:0;
}
.hero-badge strong { display:block; font-size:.9rem; color: var(--text); font-family: var(--font-heading); }
.hero-badge span { font-size:.75rem; color: var(--text-light); }

@media (max-width:768px) {
  .hero { min-height:auto; padding: 110px 0 60px; }
  .hero .container { grid-template-columns:1fr; text-align:center; }
  .hero-content > p { margin: 0 auto 2rem; }
  .hero-buttons { justify-content:center; }
  .hero-img-placeholder { height:280px; }
  .hero-badge { position:static; margin-top:1rem; justify-content:center; }
}

/* Page Hero (sub-pages) */
.page-hero {
  padding: 140px 0 60px; text-align:center;
  background:
    radial-gradient(ellipse at 70% 20%, rgba(168,220,224,.4) 0%, transparent 50%),
    linear-gradient(135deg, var(--primary-pale) 0%, var(--bg) 100%);
  position:relative; overflow:hidden;
}
.page-hero::after {
  content:''; position:absolute; left:50%; bottom:-1px;
  width:140px; height:3px; background: var(--primary);
  transform: translateX(-50%); border-radius: 2px;
}
.page-hero h1 { margin-bottom:.7rem; }
.page-hero > .container > p { font-size:1.05rem; max-width:620px; margin:0 auto; color: var(--text-body); }
.breadcrumbs { margin-top:1.2rem; font-size:.82rem; color: var(--text-light); }
.breadcrumbs a { color: var(--primary-dark); }
.breadcrumbs a:hover { color: var(--primary); }

/* ===================================
   TRUST STRIP
   =================================== */
.trust-grid {
  display:grid; grid-template-columns: repeat(4,1fr); gap:1.5rem;
}
.trust-card {
  background:#fff; padding:2.2rem 1.8rem; border-radius:18px; text-align:center;
  box-shadow: var(--shadow); transition: transform .35s cubic-bezier(.2,.6,.2,1), box-shadow .35s, border-color .35s;
  border: 1px solid transparent; position:relative; overflow:hidden;
}
.trust-card::before {
  content:''; position:absolute; inset:0;
  background: linear-gradient(135deg, rgba(168,220,224,.3), transparent 60%);
  opacity: 0; transition: opacity .35s;
  pointer-events: none;
}
.trust-card:hover { transform:translateY(-8px) scale(1.02); box-shadow: var(--shadow-lg); border-color: var(--primary-light); }
.trust-card:hover::before { opacity: 1; }
.trust-icon {
  width:60px; height:60px;
  background: linear-gradient(135deg, var(--primary-light), var(--primary));
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  margin:0 auto 1rem; font-size:1.5rem;
  box-shadow: 0 6px 18px rgba(61,170,176,.25);
  transition: transform .5s cubic-bezier(.2,.6,.2,1), box-shadow .35s;
  position:relative; z-index:1;
}
.trust-card:hover .trust-icon {
  transform: rotate(-8deg) scale(1.12);
  box-shadow: 0 10px 26px rgba(61,170,176,.45);
}
.trust-card h4 { margin-bottom:.4rem; font-size:1.05rem; }

@media (max-width:960px) { .trust-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width:480px) { .trust-grid { grid-template-columns: 1fr; } }

/* ===================================
   PROMISE (3-pillar)
   =================================== */
.promise-grid {
  display:grid; grid-template-columns: repeat(3,1fr); gap: 2rem; margin-top: 2rem;
}
.promise-card {
  background:#fff; padding:2.6rem 2rem; border-radius:20px;
  box-shadow: var(--shadow); text-align:center;
  transition: transform .4s cubic-bezier(.2,.6,.2,1), box-shadow .4s, border-top-width .35s;
  border-top: 3px solid var(--primary);
  position:relative; overflow:hidden;
}
.promise-card::after {
  content:''; position:absolute; top:0; left:-60%;
  width: 50%; height: 100%;
  background: linear-gradient(100deg, transparent 0%, rgba(61,170,176,.08) 50%, transparent 100%);
  transform: skewX(-20deg);
  transition: left .8s cubic-bezier(.2,.6,.2,1);
  pointer-events: none;
}
.promise-card:hover { transform: translateY(-8px) scale(1.015); box-shadow: var(--shadow-lg); border-top-width: 5px; }
.promise-card:hover::after { left: 140%; }
.promise-num { transition: transform .35s cubic-bezier(.2,.6,.2,1), color .35s; }
.promise-card:hover .promise-num { transform: scale(1.1); color: var(--primary-dark); }
.promise-num {
  display:inline-block; font-family: var(--font-heading);
  font-size: 2.2rem; color: var(--primary); font-weight: 700; line-height:1;
  margin-bottom: .6rem;
}
.promise-card h3 { margin-bottom: .5rem; }

@media (max-width:768px) { .promise-grid { grid-template-columns: 1fr; } }

/* ===================================
   ABOUT BLOCK
   =================================== */
.about-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:3.5rem; align-items:center;
}
.about-img-placeholder {
  height:420px;
  background: linear-gradient(135deg, var(--primary-light), var(--accent-sage));
  border-radius:18px; box-shadow: var(--shadow-lg);
  display:flex; align-items:center; justify-content:center;
  font-family: var(--font-heading); font-size:1.2rem; color: var(--primary-dark);
  overflow:hidden; position:relative;
}
.about-img-placeholder::after {
  content:''; position:absolute; inset:0;
  background: radial-gradient(circle at 70% 30%, rgba(255,255,255,.25), transparent 65%);
}
.about-text .eyebrow { margin-bottom: .4rem; }
.about-text h2 { margin-bottom:.8rem; }
.about-text > p { margin-bottom: 1rem; }
.about-features { display:flex; flex-direction:column; gap:.7rem; margin-top:1.4rem; }
.about-feature { display:flex; align-items:center; gap:.8rem; font-weight:500; font-size:.95rem; color: var(--text); }
.about-feature .check {
  width:28px; height:28px; background: var(--primary); border-radius:50%;
  display:flex; align-items:center; justify-content:center; color:#fff; font-size:.78rem; flex-shrink:0;
  box-shadow: 0 4px 10px rgba(61,170,176,.3);
}

@media (max-width:768px) {
  .about-grid { grid-template-columns:1fr; }
  .about-img-placeholder { height:280px; }
}

/* ===================================
   SERVICES
   =================================== */
.services-grid {
  display:grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap:1.6rem;
}
.service-card {
  background:#fff; padding:2.2rem 1.8rem; border-radius:18px;
  box-shadow: var(--shadow); transition: transform .35s cubic-bezier(.2,.6,.2,1), box-shadow .35s, border-color .35s;
  border-bottom: 3px solid transparent;
}
.service-card:hover { transform:translateY(-6px); border-bottom-color: var(--primary); box-shadow: var(--shadow-lg); }
.service-icon {
  width:54px; height:54px;
  background: linear-gradient(135deg, var(--primary-light), var(--primary));
  border-radius:14px; display:flex; align-items:center; justify-content:center;
  font-size:1.5rem; margin-bottom:1rem;
  box-shadow: 0 6px 16px rgba(61,170,176,.25);
  transition: transform .45s cubic-bezier(.2,.6,.2,1), border-radius .4s;
}
.service-card:hover .service-icon { transform: rotate(-6deg) scale(1.08); border-radius:50%; }
.service-card h3 { margin-bottom:.5rem; }
.service-list { margin-top:.7rem; }
.service-list li {
  padding:.28rem 0 .28rem 1.2rem; color: var(--text-body); font-size:.9rem;
  position:relative;
}
.service-list li::before {
  content:''; position:absolute; left:0; top:.75rem;
  width:6px; height:6px; background: var(--primary); border-radius:50%;
}

/* ===================================
   DAILY TIMELINE
   =================================== */
.timeline-grid {
  display:grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap:1.4rem; align-items:center;
}
.timeline-card {
  text-align:center; background:#fff; padding:2.4rem 1.8rem; border-radius:18px;
  box-shadow: var(--shadow); transition: transform .4s cubic-bezier(.2,.6,.2,1), box-shadow .4s;
}
.timeline-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.timeline-icon {
  width:68px; height:68px;
  background: linear-gradient(135deg, var(--primary-light), var(--primary));
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:1.8rem; margin:0 auto 1rem; color:#fff;
  box-shadow: 0 8px 22px rgba(61,170,176,.3);
  transition: transform .6s cubic-bezier(.2,.6,.2,1);
}
.timeline-card:hover .timeline-icon { transform: rotate(-15deg) scale(1.08); }
.timeline-arrow { font-size:1.8rem; color: var(--primary); text-align:center; }
.timeline-arrow {
  animation: floatY 3.5s ease-in-out infinite;
}
.timeline-card h3 { margin-bottom:.4rem; }
.timeline-arrow { font-size:1.8rem; color: var(--primary); text-align:center; }

@media (max-width:768px) {
  .timeline-grid { grid-template-columns:1fr; }
  .timeline-arrow { transform:rotate(90deg); }
}

/* Detailed daily schedule list */
.schedule-list {
  max-width: 780px; margin: 0 auto; display:flex; flex-direction:column; gap:.8rem;
}
.schedule-row {
  display:grid; grid-template-columns: 100px 1fr; gap: 1.5rem;
  padding: 1.2rem 1.5rem; background:#fff; border-radius: 14px;
  box-shadow: var(--shadow);
  border-left: 3px solid var(--primary);
  transition: transform .35s cubic-bezier(.2,.6,.2,1), box-shadow .35s, border-left-width .3s;
}
.schedule-row:hover {
  transform: translateX(6px);
  box-shadow: var(--shadow-lg);
  border-left-width: 6px;
}
.schedule-row .time {
  font-family: var(--font-heading); font-size: 1.15rem; color: var(--primary-dark); font-weight: 600;
}
.schedule-row .what h4 { font-size: 1rem; margin-bottom:.2rem; }
.schedule-row .what p { font-size:.88rem; color: var(--text-body); }
@media (max-width:540px) {
  .schedule-row { grid-template-columns: 1fr; }
}

/* ===================================
   ROOMS
   =================================== */
.rooms-grid { display:grid; grid-template-columns: repeat(2,1fr); gap:2rem; }
.room-card {
  background:#fff; border-radius:18px; overflow:hidden;
  box-shadow: var(--shadow); transition: transform .4s cubic-bezier(.2,.6,.2,1), box-shadow .4s;
}
.room-card:hover { transform:translateY(-8px); box-shadow: var(--shadow-lg); }
.room-card .room-img-placeholder { transition: transform .7s cubic-bezier(.2,.6,.2,1); }
.room-card:hover .room-img-placeholder { transform: scale(1.05); }
.room-img-placeholder {
  height:240px; background: linear-gradient(135deg, var(--primary-light), var(--accent-sage));
  display:flex; align-items:center; justify-content:center;
  font-family: var(--font-heading); font-size:1.2rem; color: var(--primary-dark);
  position:relative; overflow:hidden;
}
.room-img-placeholder::after {
  content:''; position:absolute; inset:0;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.25), transparent 65%);
}
.room-body { padding:1.8rem; }
.room-tag {
  display:inline-block; background: var(--primary); color:#fff;
  padding:.3rem .95rem; border-radius:50px; font-size:.75rem; font-weight:700; margin-bottom:.8rem;
  letter-spacing: .04em; text-transform: uppercase;
}
.room-tag.tag-vip { background: linear-gradient(135deg, var(--primary-dark), #1F6B70); }
.room-body h3 { margin-bottom:.5rem; }
.room-features { display:flex; flex-wrap:wrap; gap:.45rem; margin-top:1rem; }
.room-feat {
  background: var(--primary-pale); padding:.35rem .9rem; border-radius:50px;
  font-size:.78rem; color: var(--primary-dark); font-weight:500;
  border: 1px solid var(--border);
}

@media (max-width:768px) { .rooms-grid { grid-template-columns:1fr; } }

/* ===================================
   FEATURES / ACTIVITIES / EVENTS (reusable card grid)
   =================================== */
.features-grid {
  display:grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); gap:1.5rem;
}
.feature-card {
  background:#fff; padding:2.1rem 1.8rem; border-radius:18px; text-align:center;
  box-shadow: var(--shadow); transition: transform .4s cubic-bezier(.2,.6,.2,1), box-shadow .4s, border-top-color .35s;
  border-top: 3px solid transparent;
}
.feature-card:hover { border-top-color: var(--primary); transform:translateY(-6px) scale(1.01); box-shadow: var(--shadow-lg); }
.feature-emoji {
  font-size:2.3rem; margin-bottom:.8rem; display:inline-block;
  transition: transform .5s cubic-bezier(.2,.6,.2,1);
}
.feature-card:hover .feature-emoji { transform: scale(1.2) rotate(-6deg); }
.feature-card h4 { margin-bottom:.4rem; }
.feature-card p { font-size: .88rem; }

/* Activity chips (for subpages that list many small items) */
.chip-list { display:flex; flex-wrap:wrap; gap:.6rem; margin-top: 1rem; }
.chip {
  background: var(--primary-pale); color: var(--primary-dark);
  padding:.4rem 1rem; border-radius: 50px;
  font-size:.85rem; font-weight:500; border:1px solid var(--border);
}

/* ===================================
   GALLERY
   =================================== */
.gallery-grid {
  display:grid; grid-template-columns: repeat(auto-fill, minmax(260px,1fr)); gap:1rem;
}
.gallery-item {
  height:220px; background: linear-gradient(135deg, var(--primary-light), var(--accent-sage));
  border-radius:14px; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  font-family: var(--font-heading); color: var(--primary-dark); font-size:1rem;
  transition: all var(--transition); cursor:pointer; position:relative;
}
.gallery-item::after {
  content:''; position:absolute; inset:0;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.22), transparent 65%);
}
.gallery-item { transition: transform .5s cubic-bezier(.2,.6,.2,1), box-shadow .5s; }
.gallery-item:hover { transform:scale(1.06) rotate(-.5deg); box-shadow: var(--shadow-lg); z-index: 2; }
.gallery-item.featured { grid-row:span 2; height:100%; min-height:456px; }

/* ===================================
   FAMILIES
   =================================== */
.family-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:1.6rem; }
.family-card {
  background:#fff; padding:2.4rem 1.8rem; border-radius:18px; text-align:center;
  box-shadow: var(--shadow); transition: all var(--transition);
}
.family-card:hover { transform:translateY(-4px); box-shadow: var(--shadow-lg); }
.family-icon { font-size:2.6rem; margin-bottom:.9rem; }
.family-card h3 { margin-bottom:.5rem; }

@media (max-width:768px) { .family-grid { grid-template-columns:1fr; } }

/* ===================================
   TRANSPARENCY (new page)
   =================================== */
.transp-split {
  display:grid; grid-template-columns: 1fr 1fr; gap:3rem; align-items:center;
  margin-bottom: 4rem;
}
.transp-split.reverse { direction: rtl; }
.transp-split.reverse > * { direction: ltr; }
.transp-media {
  height: 360px; border-radius: 18px;
  background: linear-gradient(135deg, var(--primary-light), var(--accent-sage));
  box-shadow: var(--shadow-lg);
  display:flex; align-items:center; justify-content:center;
  font-family: var(--font-heading); color: var(--primary-dark); font-size: 3rem;
  position:relative; overflow:hidden;
}
.transp-media::after {
  content:''; position:absolute; inset:0;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.2), transparent 65%);
}
.transp-text h3 { margin-bottom: .6rem; }
.transp-text p { margin-bottom: .8rem; }
.transp-text ul { list-style: none; margin-top: .8rem; }
.transp-text ul li {
  padding: .35rem 0 .35rem 1.6rem; position:relative; font-size: .92rem;
}
.transp-text ul li::before {
  content: '✓'; position:absolute; left: 0; top: .4rem;
  width: 22px; height: 22px; background: var(--primary-light); color: var(--primary-dark);
  border-radius: 50%; font-size:.72rem; font-weight:700;
  display:flex; align-items:center; justify-content:center;
}
@media (max-width: 860px) {
  .transp-split { grid-template-columns: 1fr; gap: 2rem; }
  .transp-split.reverse { direction: ltr; }
}

/* ===================================
   DEMENTIA CARE
   =================================== */
.dementia-hero {
  padding: 3rem; border-radius: 20px;
  background: linear-gradient(135deg, var(--primary-dark) 0%, #1F6B70 50%, var(--primary-dark) 100%);
  background-size: 200% 200%;
  animation: gradientShift 14s ease-in-out infinite;
  color: #fff; text-align:center; margin-bottom: 3rem;
  position:relative; overflow:hidden;
}
.dementia-hero::before {
  content:''; position:absolute; top:-50%; right:-20%;
  width:500px; height:500px; background: rgba(255,255,255,.06); border-radius:50%;
  animation: driftA 20s ease-in-out infinite;
}
.dementia-hero::after {
  content:''; position:absolute; bottom:-40%; left:-10%;
  width:360px; height:360px; background: rgba(168,220,224,.12); border-radius:50%;
  animation: driftB 26s ease-in-out infinite;
}
.dementia-hero h2 { color:#fff; margin-bottom: 1rem; position:relative; }
.dementia-hero p { color: rgba(255,255,255,.9); max-width: 720px; margin: 0 auto; position:relative; }

.pillar-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:1.6rem; }
.pillar-card {
  background:#fff; padding: 2.2rem; border-radius: 18px;
  box-shadow: var(--shadow); transition: transform .4s cubic-bezier(.2,.6,.2,1), box-shadow .4s;
  position:relative; overflow:hidden;
}
.pillar-card::before {
  content:''; position:absolute; bottom:0; left:0; right:0; height: 3px;
  background: linear-gradient(90deg, var(--primary), var(--primary-light));
  transform: scaleX(0); transform-origin: left;
  transition: transform .5s cubic-bezier(.2,.6,.2,1);
}
.pillar-card:hover { transform:translateY(-6px); box-shadow: var(--shadow-lg); }
.pillar-card:hover::before { transform: scaleX(1); }
.pillar-icon {
  width: 52px; height: 52px; border-radius: 14px;
  background: linear-gradient(135deg, var(--primary-light), var(--primary));
  display:flex; align-items:center; justify-content:center;
  font-size: 1.4rem; margin-bottom: 1rem; color:#fff;
  transition: transform .45s cubic-bezier(.2,.6,.2,1), border-radius .4s;
}
.pillar-card:hover .pillar-icon { transform: rotate(-6deg) scale(1.08); border-radius: 50%; }
.pillar-card h3 { margin-bottom: .5rem; }
.pillar-card p { font-size: .92rem; }

@media (max-width: 860px) { .pillar-grid { grid-template-columns: 1fr; } }

/* ===================================
   EVENTS (calendar-style cards)
   =================================== */
.events-grid {
  display:grid; grid-template-columns: repeat(auto-fit, minmax(280px,1fr)); gap:1.5rem;
}
.event-card {
  background:#fff; border-radius: 18px; overflow:hidden;
  box-shadow: var(--shadow); transition: transform .4s cubic-bezier(.2,.6,.2,1), box-shadow .4s;
  display:flex; flex-direction:column;
}
.event-card:hover { transform:translateY(-7px); box-shadow: var(--shadow-lg); }
.event-card .event-visual {
  height: 140px; background: linear-gradient(135deg, var(--accent-sand), var(--primary-light));
  background-size: 200% 200%;
  display:flex; align-items:center; justify-content:center;
  font-size: 3rem;
  transition: transform .6s cubic-bezier(.2,.6,.2,1), background-position .8s ease;
}
.event-card:hover .event-visual {
  transform: scale(1.06);
  background-position: 100% 100%;
}
.event-body { padding: 1.5rem 1.6rem 1.8rem; }
.event-tag {
  display:inline-block; background: var(--accent-sand); color: var(--text);
  padding:.22rem .7rem; border-radius: 50px;
  font-size:.72rem; font-weight:700; letter-spacing:.05em;
  text-transform: uppercase; margin-bottom: .6rem;
}
.event-tag.seasonal { background: var(--primary-pale); color: var(--primary-dark); }
.event-body h3 { font-size: 1.15rem; margin-bottom: .4rem; }

/* ===================================
   NEWS (retained for possible reuse)
   =================================== */
.news-grid {
  display:grid; grid-template-columns: repeat(auto-fit, minmax(300px,1fr)); gap:1.5rem;
}
.news-card {
  background:#fff; border-radius:16px; overflow:hidden;
  box-shadow: var(--shadow); transition: all var(--transition);
}
.news-card:hover { transform:translateY(-4px); box-shadow: var(--shadow-lg); }
.news-img {
  height:180px; background: linear-gradient(135deg, var(--primary-light), var(--accent-sage));
  display:flex; align-items:center; justify-content:center;
  font-family: var(--font-heading); color: var(--primary-dark);
}
.news-body { padding:1.4rem; }
.news-date { font-size:.78rem; color: var(--primary-dark); font-weight:700; margin-bottom:.4rem; }
.news-body h3 { font-size:1.1rem; margin-bottom:.4rem; }
.news-body p { font-size:.88rem; }

/* ===================================
   FAQ
   =================================== */
.faq-list { max-width: 820px; margin:0 auto; }
.faq-item {
  background:#fff; border-radius:14px; margin-bottom:.8rem;
  box-shadow: var(--shadow); overflow:hidden;
}
.faq-question {
  width:100%; padding:1.25rem 1.7rem; display:flex; justify-content:space-between; align-items:center; gap:1rem;
  font-weight:600; font-size:.95rem; color: var(--text); text-align:left;
  transition: color var(--transition);
}
.faq-question:hover { color: var(--primary-dark); }
.faq-question .arrow { transition: transform .3s; font-size:1.1rem; color: var(--primary); flex-shrink:0; }
.faq-question.active .arrow { transform: rotate(180deg); }
.faq-answer { max-height:0; overflow:hidden; transition: max-height .4s ease, padding .3s ease; }
.faq-answer.show { max-height:500px; padding: 0 1.7rem 1.3rem; }
.faq-answer p { font-size:.92rem; line-height:1.7; }

/* ===================================
   DEDICATION (Ganira Pashayeva)
   =================================== */
.dedication-block {
  background:
    radial-gradient(ellipse at 50% 0%, rgba(221,206,189,.04), transparent 60%),
    linear-gradient(180deg, #000 0%, #050505 50%, #000 100%);
  color:#f3eee5; padding: 110px 24px 96px; text-align:center;
  position:relative; overflow:hidden;
}
.dedication-block::before {
  content:''; position:absolute; top:-30%; left:-10%;
  width:480px; height:480px; background: rgba(221,206,189,.018); border-radius:50%;
  animation: driftA 26s ease-in-out infinite;
}
.dedication-block::after {
  content:''; position:absolute; bottom:-20%; right:-12%;
  width:380px; height:380px; background: rgba(168,220,224,.02); border-radius:50%;
  animation: driftB 30s ease-in-out infinite;
}
.dedication-block .container { max-width: 720px; position:relative; z-index:2; }
.dedication-block .eyebrow {
  color: rgba(221,206,189,.85); letter-spacing: .22em; font-size:.78rem;
  margin-bottom: 1.6rem;
}
.dedication-block .ded-portrait {
  width: 168px; height: 168px; margin: 0 auto 1.4rem;
  border-radius: 50%; overflow: hidden;
  border: 1px solid rgba(221,206,189,.35);
  box-shadow:
    0 0 0 6px rgba(221,206,189,.04),
    0 18px 48px rgba(0,0,0,.55);
  position: relative;
}
.dedication-block .ded-portrait::after {
  content:''; position:absolute; inset:0; border-radius:50%;
  background: linear-gradient(180deg, rgba(0,0,0,0) 60%, rgba(0,0,0,.35) 100%);
  pointer-events:none;
}
.dedication-block .ded-portrait img {
  width:100%; height:100%; object-fit: cover; object-position: 50% 28%;
  display:block; filter: grayscale(.15) contrast(1.02);
}
.dedication-block h2 {
  color: #f6efe1; margin-bottom: .35rem; font-weight: 500;
  font-size: clamp(1.6rem, 2.4vw, 2.05rem); letter-spacing: .01em;
}
.dedication-block .ded-dates {
  color: rgba(221,206,189,.65); font-family: var(--font-heading); font-style: italic;
  letter-spacing: .15em; font-size: .92rem; margin-bottom: 1.6rem;
}
.dedication-block blockquote {
  position:relative; font-family: var(--font-heading); font-style: italic;
  font-size: 1.2rem; color: #f6efe1; margin: 1.4rem auto .8rem;
  padding: 0 2.2rem; line-height: 1.55; max-width: 580px;
}
.dedication-block blockquote::before,
.dedication-block blockquote::after {
  content:'"'; font-family: var(--font-heading); font-size: 3rem;
  color: rgba(221,206,189,.22); position:absolute; line-height: 1;
}
.dedication-block blockquote::before { top:-.6rem; left:.2rem; }
.dedication-block blockquote::after { bottom:-1.4rem; right:.2rem; }
.dedication-block p {
  color: rgba(243,238,229,.72); line-height:1.8; font-size: .98rem;
  max-width: 600px; margin: 1.4rem auto 0;
}
@media (max-width:768px) {
  .dedication-block { padding: 80px 24px 64px; }
  .dedication-block .ded-portrait { width: 134px; height: 134px; }
}

/* ===================================
   CONTACT
   =================================== */
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:3rem; }
.contact-info { display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; }
.contact-card {
  background:#fff; padding:1.8rem; border-radius:14px; text-align:center;
  box-shadow: var(--shadow); transition: all var(--transition);
}
.contact-card:hover { transform:translateY(-3px); box-shadow: var(--shadow-lg); }
.contact-card-icon { font-size:2rem; margin-bottom:.6rem; }
.contact-card h3 { font-size:1rem; margin-bottom:.3rem; color: var(--primary-dark); }
.contact-card p { font-size:.9rem; }
.phone-short { font-size:.78rem; color: var(--text-light); margin-top:.25rem; }

.contact-form-wrapper h2 { font-size:1.5rem; margin-bottom:1.5rem; }
.contact-form-wrapper > p { margin-bottom: 1.2rem; font-size:.92rem; }
.contact-form { display:flex; flex-direction:column; gap:1rem; }
.form-group { display:flex; flex-direction:column; }
.form-group label { font-size:.85rem; font-weight:600; margin-bottom:.35rem; color: var(--text); }
.form-group input, .form-group textarea, .form-group select {
  padding:.85rem 1rem; border:2px solid var(--border); border-radius:10px;
  font-family: var(--font-body); font-size:.92rem; background:#fff;
  color: var(--text); transition: border-color var(--transition);
}
.form-group input:focus, .form-group textarea:focus, .form-group select:focus {
  outline:none; border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(61,170,176,.12);
}
.form-group textarea { resize:vertical; min-height:120px; }
.submit-btn {
  padding:.95rem 2rem; background: var(--primary); color:#fff; border-radius:50px;
  font-weight:700; font-size:.92rem; transition: all var(--transition); align-self:flex-start;
}
.submit-btn:hover { background: var(--primary-dark); transform:translateY(-2px); box-shadow: 0 6px 20px rgba(61,170,176,.3); }

.trial-stay-callout {
  background: linear-gradient(135deg, var(--accent-sand) 0%, var(--accent-warm) 100%);
  padding: 1.4rem 1.7rem; border-radius: 14px;
  display:flex; align-items:center; gap: 1rem; margin-bottom: 1.5rem;
  border-left: 3px solid var(--primary);
  box-shadow: 0 4px 18px rgba(221,206,189,.4);
}
.trial-stay-callout .ts-icon {
  font-size: 2rem; flex-shrink: 0;
}
.trial-stay-callout strong {
  display:block; color: var(--text); font-family: var(--font-heading); font-size: 1.05rem;
}
.trial-stay-callout span { font-size:.85rem; color: var(--text-body); }

.map-section { padding: 0 0 80px; }
.map-container { border-radius:18px; overflow:hidden; box-shadow: var(--shadow); }
.map-container iframe { width:100%; height:380px; border:none; }

@media (max-width:768px) {
  .contact-grid { grid-template-columns:1fr; }
  .contact-info { grid-template-columns:1fr; }
}

/* ===================================
   CTA BLOCK
   =================================== */
.cta-section {
  background:
    radial-gradient(ellipse at 75% 15%, rgba(168,220,224,.35), transparent 55%),
    linear-gradient(135deg, var(--accent-warm) 0%, var(--accent-sand) 50%, var(--accent-warm) 100%);
  background-size: 100%, 200% 200%;
  animation: gradientShift 18s ease-in-out infinite;
  padding:6rem 24px; text-align:center; color: var(--text); position:relative; overflow:hidden;
}
.cta-section::before {
  content:''; position:absolute; top:-40%; right:-20%;
  width:500px; height:500px; background:rgba(255,255,255,.35); border-radius:50%;
  animation: driftA 20s ease-in-out infinite;
}
.cta-section::after {
  content:''; position:absolute; bottom:-30%; left:-15%;
  width:400px; height:400px; background:rgba(61,170,176,.10); border-radius:50%;
  animation: driftB 24s ease-in-out infinite;
}
.cta-section h2 { color: var(--text); margin-bottom:.8rem; }
.cta-section p { color: var(--text-body); font-size:1.1rem; margin-bottom:2rem; max-width:600px; margin-left:auto; margin-right:auto; }
.cta-section .hero-buttons { justify-content:center; }
/* CTA section button overrides: dark filled vs. dark outline on warm bg */
.cta-section .btn-white {
  background: var(--primary-dark); color:#fff; border-color: var(--primary-dark);
}
.cta-section .btn-white:hover {
  background: var(--primary); border-color: var(--primary);
}
.cta-section .btn-outline {
  border-color: var(--primary-dark) !important; color: var(--primary-dark) !important;
}
.cta-section .btn-outline:hover {
  background: var(--primary-dark) !important; color:#fff !important;
}

/* ===================================
   FOOTER
   =================================== */
.footer { background: var(--dark-bg); color:rgba(255,255,255,.7); padding: 60px 0 20px; }
.footer-container {
  max-width:1200px; margin:0 auto; padding:0 24px;
  display:grid; grid-template-columns: 2fr 1fr 1fr 1.5fr; gap:2.5rem; margin-bottom:2.5rem;
}
.footer-col h4 { color:#fff; font-family: var(--font-heading); font-size:1.15rem; margin-bottom:1rem; }
.footer-col p { font-size:.88rem; line-height:1.7; color:rgba(255,255,255,.55); }
.footer-col ul li { margin-bottom:.5rem; }
.footer-col ul li a { font-size:.88rem; color:rgba(255,255,255,.55); transition: color var(--transition); }
.footer-col ul li a:hover { color: var(--primary-light); }
.footer-brand { display:flex; align-items:center; gap: .8rem; margin-bottom: 1rem; }
.footer-brand-mark {
  width: 44px; height: 44px; border-radius: 50%;
  background: rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center;
  overflow:hidden;
}
.footer-brand-mark img { width:100%; height:100%; object-fit:cover; }
.footer-brand-text .brand { color:#fff; font-family: var(--font-heading); font-size: 1.3rem; font-weight: 700; letter-spacing:.02em; }
.footer-brand-text .sub { color:rgba(255,255,255,.5); font-size:.72rem; letter-spacing: .08em; text-transform: uppercase; }
.footer-contact-item { display:flex; align-items:flex-start; gap:.55rem; margin-bottom:.55rem; font-size:.88rem; color:rgba(255,255,255,.55); line-height: 1.5; }
.footer-contact-item .fc-icon { color: var(--primary-light); flex-shrink:0; }
.footer-bottom {
  max-width:1200px; margin:0 auto; padding: 1.4rem 24px 0;
  border-top: 1px solid rgba(255,255,255,.08); text-align:center;
}
.footer-bottom p { font-size:.8rem; color:rgba(255,255,255,.4); }

@media (max-width:860px) { .footer-container { grid-template-columns:1fr; gap:1.8rem; } }

/* ===================================
   SCROLL TO TOP
   =================================== */
.scroll-top-btn {
  position:fixed; bottom:24px; right:24px; width:48px; height:48px;
  background: var(--primary); color:#fff; border-radius:50%;
  display:none; justify-content:center; align-items:center;
  font-size:1.3rem; z-index:999; transition: all var(--transition);
  box-shadow: 0 4px 16px rgba(61,170,176,.4);
}
.scroll-top-btn.show { display:flex; }
.scroll-top-btn:hover { background: var(--primary-dark); transform:translateY(-3px); }

/* ===================================
   MISSION CARDS (About page)
   =================================== */
.mission-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; }
.mission-card {
  background:#fff; padding:2.2rem 1.8rem; border-radius:18px; text-align:center;
  box-shadow: var(--shadow); transition: all var(--transition);
}
.mission-card:hover { transform:translateY(-4px); box-shadow: var(--shadow-lg); }
.mission-icon { font-size:2.3rem; margin-bottom:.8rem; }
.mission-card h3 { margin-bottom:.5rem; }

@media (max-width:768px) { .mission-grid { grid-template-columns:1fr; } }

.approach-content { max-width:820px; margin:0 auto; text-align:center; }
.approach-content h2 { margin-bottom:1rem; }
.approach-content p { font-size:1rem; line-height:1.8; }

/* ===================================
   CRISIS PROTOCOL (linear numbered steps)
   =================================== */
.protocol-grid {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 1rem;
}
.protocol-step {
  background:#fff; padding: 1.8rem 1.4rem; border-radius: 16px;
  box-shadow: var(--shadow); position:relative;
  border-top: 3px solid var(--primary);
  transition: transform .35s cubic-bezier(.2,.6,.2,1), box-shadow .35s;
}
.protocol-step:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.protocol-step .step-num { transition: transform .4s cubic-bezier(.2,.6,.2,1); }
.protocol-step:hover .step-num { transform: scale(1.15) rotate(-8deg); }
.protocol-step .step-num {
  position:absolute; top:-14px; left:20px;
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--primary); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-family: var(--font-heading); font-weight: 700; font-size: .95rem;
  box-shadow: 0 4px 12px rgba(61,170,176,.35);
}
.protocol-step h4 { font-size: 1rem; margin-top: .6rem; margin-bottom:.3rem; }
.protocol-step p { font-size: .85rem; }
@media (max-width: 1024px) { .protocol-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px)  { .protocol-grid { grid-template-columns: 1fr; } }

/* ===================================
   REVIEWS PLACEHOLDER
   =================================== */
.review-empty {
  max-width: 720px; margin: 0 auto;
  background: var(--warm-white); border: 2px dashed var(--border);
  border-radius: 18px; padding: 2.5rem 2rem; text-align:center;
}
.review-empty .eyebrow { margin-bottom: .4rem; }
.review-empty h3 { margin-bottom: .5rem; font-size: 1.15rem; }
.review-empty p { font-size: .92rem; }

/* ===================================
   SIGNATURE TOUCHES (2x2 emphasis grid)
   =================================== */
.signature-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.6rem;
}
.signature-card {
  background:#fff; border-radius: 18px; padding: 2.2rem;
  box-shadow: var(--shadow); transition: all var(--transition);
  display:flex; gap: 1.3rem; align-items:flex-start;
  border-left: 3px solid var(--primary);
}
.signature-card { transition: transform .4s cubic-bezier(.2,.6,.2,1), box-shadow .4s, border-left-width .3s; }
.signature-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); border-left-width: 5px; }
.signature-card .sig-icon {
  width: 56px; height: 56px; border-radius: 14px; flex-shrink: 0;
  background: linear-gradient(135deg, var(--primary-light), var(--primary));
  display:flex; align-items:center; justify-content:center;
  font-size: 1.5rem; color:#fff;
  transition: transform .5s cubic-bezier(.2,.6,.2,1), border-radius .4s;
}
.signature-card:hover .sig-icon { transform: rotate(-8deg) scale(1.08); border-radius: 50%; }
.signature-card h4 { margin-bottom: .4rem; font-size: 1.1rem; }
.signature-card p { font-size: .92rem; }
@media (max-width: 860px) { .signature-grid { grid-template-columns: 1fr; } }

/* ===================================
   RESPONSIVE EXTRAS
   =================================== */
@media (max-width:480px) {
  .nav-logo-text .brand { font-size:1.2rem; }
  .nav-logo-mark { width:36px; height:36px; }
  .nav-language { gap:.25rem; }
  .lang-btn { padding:.25rem .5rem; font-size:.65rem; }
  .section { padding:60px 0; }
  .cta-section { padding:4rem 24px; }
}