/* ============================================================
   Luzan Dental Center — visual system
   Palette keyed to brand logo (teal gradient tooth + coral wink)
   Sources: CLAUDE-DESIGN.md, design-brief.md
   ============================================================ */
:root{
  --bg:        #F4FBFB;
  --surface:   #FFFFFF;
  --surface-2: #ECF7F6;
  --text:      #15323A;
  --muted:     #5C7A82;
  --primary:   #1395A1;
  --primary-d: #0F7882;
  --secondary: #3FBFB4;
  --accent:    #FF8A5B;
  --accent-d:  #F2683A;
  --border:    #DCEDED;
  --focus:     #1395A1;
  --wa:        #25D366;
  --wa-d:      #1FB457;
  --ink-grad:  linear-gradient(135deg, #0F7882 0%, #3FBFB4 100%);

  --shadow-sm: 0 1px 2px rgba(21,50,58,.06), 0 1px 3px rgba(21,50,58,.05);
  --shadow:    0 6px 18px -6px rgba(21,50,58,.14), 0 2px 6px rgba(21,50,58,.05);
  --shadow-lg: 0 24px 60px -22px rgba(15,120,130,.34), 0 8px 24px -12px rgba(21,50,58,.14);

  --r-sm: 12px;
  --r:    18px;
  --r-lg: 26px;
  --r-xl: 34px;

  --maxw: 1180px;
  --gut: clamp(20px, 5vw, 56px);
  --sp-section: clamp(64px, 9vw, 128px);

  --ff-head: 'Poppins', system-ui, sans-serif;
  --ff-body: 'Inter', system-ui, sans-serif;
}
[dir="rtl"]{
  --ff-head: 'IBM Plex Sans Arabic', 'Poppins', sans-serif;
  --ff-body: 'IBM Plex Sans Arabic', 'Inter', sans-serif;
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body{
  font-family:var(--ff-body);
  color:var(--text);
  background:var(--bg);
  line-height:1.6;
  font-size:17px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; }
:focus-visible{ outline:3px solid var(--focus); outline-offset:2px; border-radius:6px; }

h1,h2,h3,h4{ font-family:var(--ff-head); font-weight:600; line-height:1.1; letter-spacing:-.02em; color:var(--text); text-wrap:balance; }
h1{ font-size:clamp(2.4rem, 5.4vw, 4rem); font-weight:700; }
h2{ font-size:clamp(1.9rem, 3.6vw, 2.9rem); }
h3{ font-size:clamp(1.15rem, 2vw, 1.4rem); }
p{ text-wrap:pretty; }

.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gut); }
.section{ padding-block:var(--sp-section); }
.eyebrow{
  font-family:var(--ff-head); font-weight:600; font-size:.82rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--primary); display:inline-flex; align-items:center; gap:.55rem;
}
.eyebrow::before{ content:""; width:26px; height:2px; background:var(--secondary); border-radius:2px; }
[dir="rtl"] .eyebrow{ letter-spacing:0; }
.lede{ color:var(--muted); font-size:clamp(1.02rem,1.4vw,1.18rem); max-width:60ch; }
.section-head{ max-width:62ch; }
.section-head h2{ margin:.5rem 0 .7rem; }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  font-family:var(--ff-head); font-weight:600; font-size:1rem;
  padding:.92rem 1.5rem; border-radius:999px; min-height:52px;
  transition:transform .18s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  white-space:nowrap;
}
.btn svg{ width:19px; height:19px; flex:none; }
.btn--primary{ background:var(--primary); color:#fff; box-shadow:0 10px 22px -10px rgba(15,120,130,.7); }
.btn--primary:hover{ background:var(--primary-d); transform:translateY(-2px); box-shadow:0 16px 30px -12px rgba(15,120,130,.8); }
.btn--wa{ background:var(--wa); color:#fff; box-shadow:0 10px 22px -10px rgba(31,180,87,.6); }
.btn--wa:hover{ background:var(--wa-d); transform:translateY(-2px); }
.btn--ghost{ background:var(--surface); color:var(--primary); box-shadow:inset 0 0 0 1.5px var(--border); }
.btn--ghost:hover{ box-shadow:inset 0 0 0 1.5px var(--primary); transform:translateY(-2px); }
.btn--lg{ padding:1.05rem 1.9rem; min-height:58px; font-size:1.05rem; }
.btn--block{ width:100%; }

.link-arrow{ font-family:var(--ff-head); font-weight:600; color:var(--primary); display:inline-flex; align-items:center; gap:.4rem; }
.link-arrow svg{ width:16px; height:16px; transition:transform .2s ease; }
.link-arrow:hover svg{ transform:translateX(4px); }
[dir="rtl"] .link-arrow svg{ transform:scaleX(-1); }
[dir="rtl"] .link-arrow:hover svg{ transform:scaleX(-1) translateX(4px); }

/* ---------- top utility bar ---------- */
.topbar{ background:var(--text); color:#cfe6e8; font-size:.84rem; }
.topbar .wrap{ display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:42px; }
.topbar a{ color:#e7f4f4; }
.topbar .topbar__l{ display:flex; gap:1.4rem; align-items:center; flex-wrap:wrap; }
.topbar .topbar__l span{ display:inline-flex; align-items:center; gap:.45rem; }
.topbar .topbar__l svg{ width:14px; height:14px; color:var(--secondary); }
.topbar .dot{ width:5px;height:5px;border-radius:50%;background:var(--secondary); }
.topbar__hide-sm{ display:flex; }
.lang-toggle{
  display:inline-flex; align-items:center; gap:.35rem; font-family:var(--ff-head); font-weight:600;
  background:rgba(255,255,255,.1); padding:.3rem .7rem; border-radius:999px; font-size:.8rem; color:#fff;
}
.lang-toggle:hover{ background:rgba(255,255,255,.2); }

/* ---------- nav ---------- */
.nav{ position:sticky; top:0; z-index:60; background:rgba(255,255,255,.86); backdrop-filter:blur(14px); border-bottom:1px solid var(--border); }
.nav .wrap{ display:flex; align-items:center; gap:1.2rem; min-height:96px; }
.brand{ display:flex; align-items:center; gap:.6rem; flex:none; }
.brand img{ height:80px; width:auto; }
.brand b{ display:none; }
.nav__links{ display:flex; gap:.3rem; margin-inline-start:auto; align-items:center; }
.nav__links a{ font-family:var(--ff-head); font-weight:500; font-size:.96rem; color:var(--text); padding:.5rem .8rem; border-radius:10px; transition:color .15s, background .15s; }
.nav__links a:hover{ color:var(--primary); background:var(--surface-2); }
.nav__cta{ display:flex; align-items:center; gap:.6rem; margin-inline-start:.4rem; }
.nav__burger{ display:none; width:46px; height:46px; border-radius:12px; align-items:center; justify-content:center; color:var(--text); margin-inline-start:auto; }
.nav__burger svg{ width:26px; height:26px; }

/* mobile drawer */
.drawer{ position:fixed; inset:0; z-index:80; visibility:hidden; }
.drawer.open{ visibility:visible; }
.drawer__bg{ position:absolute; inset:0; background:rgba(15,50,58,.45); opacity:0; transition:opacity .25s; }
.drawer.open .drawer__bg{ opacity:1; }
.drawer__panel{
  position:absolute; inset-block:0; inset-inline-end:0; width:min(86vw,360px); background:var(--surface);
  padding:1.4rem; display:flex; flex-direction:column; gap:.3rem; transform:translateX(110%);
  transition:transform .3s cubic-bezier(.4,0,.2,1); box-shadow:var(--shadow-lg); overflow-y:auto;
}
[dir="rtl"] .drawer__panel{ transform:translateX(-110%); }
.drawer.open .drawer__panel{ transform:translateX(0); }
.drawer__top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:1rem; }
.drawer__top img{ height:40px; }
.drawer__close{ width:44px; height:44px; border-radius:12px; background:var(--surface-2); color:var(--text); display:flex; align-items:center; justify-content:center; }
.drawer__close svg{ width:22px; height:22px; }
.drawer__panel a.dlink{ font-family:var(--ff-head); font-weight:500; font-size:1.1rem; padding:.85rem .4rem; border-bottom:1px solid var(--border); color:var(--text); }
.drawer__panel .btn{ margin-top:.5rem; }

/* ---------- hero ---------- */
.hero{ position:relative; }
.hero::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(60% 70% at 88% 8%, rgba(63,191,180,.18), transparent 60%),
    radial-gradient(50% 60% at 0% 100%, rgba(19,149,161,.1), transparent 60%);
}
.hero .wrap{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,4vw,4.5rem); align-items:center; padding-block:clamp(2.5rem,6vw,5rem); }
.hero__copy h1{ margin:.9rem 0 1.1rem; }
.hero__copy h1 .grad{ background:var(--ink-grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero__cta{ display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.6rem; }
.hero__chips{ display:flex; flex-wrap:wrap; gap:.5rem 1.4rem; margin-top:1.8rem; }
.hero__chips span{ display:inline-flex; align-items:center; gap:.5rem; font-size:.92rem; color:var(--text); font-weight:500; }
.hero__chips svg{ width:18px; height:18px; color:var(--primary); flex:none; }

.hero__media{ position:relative; }
.hero__media .photo{ position:relative; border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--shadow-lg); aspect-ratio:4/5; }
.hero__media .photo img{ width:100%; height:100%; object-fit:cover; }
.hero__blob{ position:absolute; inset:-6% -8% -6% -8%; z-index:-1; background:var(--ink-grad); border-radius:46% 54% 58% 42%/52% 44% 56% 48%; opacity:.12; }
.float-badge{
  position:absolute; background:var(--surface); border-radius:var(--r); box-shadow:var(--shadow-lg);
  padding:.9rem 1.1rem; display:flex; align-items:center; gap:.75rem;
}
.float-badge .n{ font-family:var(--ff-head); font-weight:700; font-size:1.5rem; line-height:1; color:var(--primary); }
.float-badge small{ display:block; color:var(--muted); font-size:.78rem; font-weight:500; line-height:1.25; }
.float-badge--tl{ inset-block-start:8%; inset-inline-start:-7%; }
.float-badge--br{ inset-block-end:7%; inset-inline-end:-6%; }
.float-badge .ico{ width:40px; height:40px; border-radius:12px; background:var(--surface-2); display:flex; align-items:center; justify-content:center; color:var(--primary); flex:none; }
.float-badge .ico svg{ width:22px; height:22px; }

/* ---------- trust band ---------- */
.trust{
  position:relative; overflow:hidden; color:#fff;
  background:
    radial-gradient(120% 150% at 88% -25%, rgba(63,191,180,.34), transparent 55%),
    radial-gradient(95% 130% at 4% 125%, rgba(255,138,91,.16), transparent 55%),
    linear-gradient(135deg, #0F7882 0%, #124C56 54%, #11343C 100%);
  padding-block:clamp(58px,8vw,104px);
}
/* fine engineered grid texture, faded toward edges */
.trust::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.55;
  background:
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:48px 48px;
  -webkit-mask-image:radial-gradient(82% 78% at 50% 32%, #000, transparent 82%);
          mask-image:radial-gradient(82% 78% at 50% 32%, #000, transparent 82%);
}
.trust .wrap{ position:relative; display:flex; flex-direction:column; align-items:center; gap:clamp(1.5rem,3vw,2.4rem); }

.trust-card{
  width:100%;
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:clamp(.7rem,1.4vw,1.1rem);
  background:transparent; border:0; border-radius:0; box-shadow:none; overflow:visible;
}
.t-cell{
  position:relative; isolation:isolate;
  display:flex; flex-direction:column; align-items:flex-start; text-align:start;
  gap:.7rem; padding:clamp(1.4rem,1.9vw,1.9rem) clamp(1.25rem,1.7vw,1.6rem);
  border-radius:var(--r);
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.035));
  border:1px solid rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10), 0 20px 44px -30px rgba(0,0,0,.7);
  transition:transform .45s cubic-bezier(.2,.8,.2,1), border-color .45s, background .45s;
}
/* top accent hairline, lit on hover */
.t-cell::after{
  content:""; position:absolute; inset-inline:14px; top:0; height:2px; border-radius:2px;
  background:linear-gradient(90deg, transparent, rgba(63,191,180,.95), transparent);
  opacity:0; transition:opacity .45s;
}
@media (hover:hover){
  .t-cell:hover{ transform:translateY(-5px); border-color:rgba(255,255,255,.26); }
  .t-cell:hover::after{ opacity:1; }
}
.t-cell--feature{
  background:linear-gradient(180deg, rgba(255,138,91,.20), rgba(255,138,91,.05));
  border-color:rgba(255,138,91,.42);
}
.t-cell--feature::after{ background:linear-gradient(90deg, transparent, var(--accent), transparent); opacity:1; }

.t-ico{
  width:52px; height:52px; border-radius:15px;
  display:flex; align-items:center; justify-content:center;
  color:#EAFBFA;
  background:linear-gradient(180deg, rgba(63,191,180,.32), rgba(63,191,180,.10));
  border:1px solid rgba(255,255,255,.18);
}
.t-cell--feature .t-ico{
  color:#fff;
  background:linear-gradient(180deg, var(--accent), var(--accent-d));
  border-color:rgba(255,255,255,.32);
  box-shadow:0 12px 24px -12px rgba(242,104,58,.75);
}
.t-ico svg{ width:25px; height:25px; }
.t-big{
  font-family:var(--ff-head); font-weight:700; letter-spacing:-.025em; line-height:1.0;
  font-size:clamp(1.55rem,2.7vw,2.3rem);
  color:#fff; -webkit-text-fill-color:#fff;
}
.t-cell--feature .t-big{ color:#fff; -webkit-text-fill-color:#fff; }
.t-sm{ color:rgba(224,242,242,.76); font-size:.92rem; line-height:1.45; }
.claim-note{ text-align:center; color:rgba(224,242,242,.5); font-size:.82rem; letter-spacing:.01em; }

/* ---------- services ---------- */
.svc-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.1rem; margin-top:2.6rem; }
.svc-card{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r); overflow:hidden;
  display:flex; flex-direction:column; transition:transform .22s ease, box-shadow .22s ease, border-color .22s;
}
.svc-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:transparent; }
.svc-card__img{ aspect-ratio:5/4; overflow:hidden; position:relative; }
.svc-card__img img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.svc-card:hover .svc-card__img img{ transform:scale(1.06); }
.svc-card__body{ padding:1.1rem 1.15rem 1.25rem; display:flex; flex-direction:column; gap:.35rem; flex:1; }
.svc-card__body h3{ font-size:1.12rem; }
.svc-card__body p{ color:var(--muted); font-size:.92rem; flex:1; }
.svc-card__body .more{ font-family:var(--ff-head); font-weight:600; font-size:.9rem; color:var(--primary); display:inline-flex; align-items:center; gap:.35rem; margin-top:.4rem; }
.svc-card__body .more svg{ width:15px;height:15px; transition:transform .2s; }
.svc-card:hover .more svg{ transform:translateX(3px); }
[dir="rtl"] .svc-card .more svg, [dir="rtl"] .float-badge svg{ transform:scaleX(-1); }

/* ---------- cosmetic feature ---------- */
.feature{ background:var(--surface-2); }
.feature .wrap{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,4vw,4.5rem); align-items:center; }
.feature__media{ position:relative; border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-lg); aspect-ratio:1/1; }
.feature__media img{ width:100%; height:100%; object-fit:cover; }
.feature__list{ display:grid; gap:.7rem; margin:1.4rem 0 1.8rem; }
.feature__list li{ list-style:none; display:flex; align-items:flex-start; gap:.7rem; color:var(--text); }
.feature__list .tick{ width:24px;height:24px;border-radius:50%;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;flex:none;margin-top:1px; }
.feature__list .tick svg{ width:14px;height:14px; }
.feature__list b{ font-family:var(--ff-head); font-weight:600; }
.feature__list span{ color:var(--muted); font-size:.95rem; }

/* ---------- branches ---------- */
.branch-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.4rem; margin-top:2.4rem; }
.branch{ background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden; display:flex; flex-direction:column; }
.branch__img{ aspect-ratio:16/9; overflow:hidden; position:relative; }
.branch__img img{ width:100%; height:100%; object-fit:cover; }
.branch__map{ aspect-ratio:16/9; border:0; width:100%; display:block; }
.branch__placeholder{
  aspect-ratio:16/9; background:
    repeating-linear-gradient(135deg, #e4f1f1 0 14px, #edf7f6 14px 28px);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5rem; text-align:center; padding:1.5rem; color:var(--muted);
}
.branch__placeholder .pin{ width:46px;height:46px;border-radius:50%;background:var(--surface);color:var(--primary);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow); }
.branch__placeholder .pin svg{ width:24px;height:24px; }
.branch__placeholder code{ font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:.82rem; max-width:34ch; color:var(--muted); }
.branch__body{ padding:1.5rem 1.5rem 1.6rem; display:flex; flex-direction:column; gap:.7rem; flex:1; }
.branch__tag{ font-family:var(--ff-head); font-weight:600; font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--accent-d); }
.branch__body h3{ font-size:1.35rem; }
.branch__row{ display:flex; gap:.6rem; color:var(--muted); font-size:.95rem; align-items:flex-start; }
.branch__row svg{ width:18px;height:18px;color:var(--primary);flex:none;margin-top:3px; }
.branch__actions{ display:flex; gap:.6rem; flex-wrap:wrap; margin-top:auto; padding-top:.5rem; }
.branch__actions .btn{ flex:1; min-width:130px; padding:.7rem 1rem; min-height:48px; font-size:.92rem; }

/* ---------- insurance ---------- */
.insurance{ background:var(--surface); }
.ins-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:1rem; margin-top:2.2rem; }
.ins-cell{ background:var(--bg); border:1px solid var(--border); border-radius:var(--r-sm); aspect-ratio:5/3; display:flex; align-items:center; justify-content:center; padding:1rem 1.2rem; transition:border-color .2s, transform .2s; }
.ins-cell:hover{ border-color:var(--secondary); transform:translateY(-3px); }
.ins-cell img{ max-height:46px; width:auto; object-fit:contain; filter:saturate(1); }

/* ---------- team ---------- */
.team{ background:var(--bg); }
.team-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:1rem; margin-top:2.4rem; }
.team-card{ position:relative; border-radius:var(--r); overflow:hidden; aspect-ratio:3/4; box-shadow:var(--shadow); }
.team-card img{ width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.team-card:hover img{ transform:scale(1.05); }
.team-card::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%, rgba(15,50,58,.55)); }

/* ---------- book / contact ---------- */
.book{ background:var(--ink-grad); color:#fff; position:relative; overflow:hidden; }
.book::before{ content:""; position:absolute; inset:0; background:radial-gradient(50% 80% at 100% 0%, rgba(255,255,255,.12), transparent 60%); }
.book .wrap{ display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(2rem,5vw,5rem); align-items:center; position:relative; }
.book__copy .eyebrow{ color:#bff0ec; }
.book__copy .eyebrow::before{ background:var(--accent); }
.book__copy h2{ color:#fff; margin:.6rem 0 1rem; }
.book__copy p{ color:#d4eeef; max-width:46ch; }
.book__alt{ display:flex; flex-direction:column; gap:.7rem; margin-top:1.8rem; }
.book__alt a{ display:inline-flex; align-items:center; gap:.7rem; font-weight:500; color:#eafafa; }
.book__alt .ico{ width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;flex:none; }
.book__alt .ico svg{ width:20px;height:20px;color:#fff; }
.book__alt b{ display:block; font-family:var(--ff-head); font-weight:600; }
.book__alt small{ color:#bfe4e5; }

.form-card{ background:var(--surface); border-radius:var(--r-lg); padding:clamp(1.4rem,3vw,2.2rem); box-shadow:var(--shadow-lg); color:var(--text); }
.form-card h3{ font-size:1.3rem; margin-bottom:.3rem; }
.form-card .sub{ color:var(--muted); font-size:.92rem; margin-bottom:1.3rem; }
.field{ margin-bottom:1rem; }
.field label{ display:block; font-family:var(--ff-head); font-weight:500; font-size:.86rem; margin-bottom:.35rem; color:var(--text); }
.field input, .field select, .field textarea{
  width:100%; font-family:inherit; font-size:1rem; color:var(--text); background:var(--bg);
  border:1.5px solid var(--border); border-radius:12px; padding:.8rem .95rem; transition:border-color .15s, box-shadow .15s;
}
.field input:focus, .field select:focus, .field textarea:focus{ outline:none; border-color:var(--primary); box-shadow:0 0 0 3px rgba(19,149,161,.14); }
.field textarea{ resize:vertical; min-height:90px; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-note{ font-size:.8rem; color:var(--muted); margin-top:.4rem; display:flex; gap:.4rem; align-items:flex-start; }
.form-note svg{ width:15px;height:15px;color:var(--secondary);flex:none;margin-top:2px; }
.form-ok{ display:none; background:#e8f8ef; color:#1a6b40; border:1px solid #b8e6cb; border-radius:12px; padding:.9rem 1rem; font-size:.92rem; margin-bottom:1rem; align-items:center; gap:.5rem; }
.form-ok.show{ display:flex; }

/* ---------- footer ---------- */
.footer{ background:var(--text); color:#bdd7da; font-size:.92rem; }
.footer .wrap{ padding-block:clamp(3rem,6vw,4.5rem) 1.5rem; }
.footer__grid{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1.3fr; gap:2.2rem; }
.footer h4{ color:#fff; font-size:.95rem; letter-spacing:.04em; text-transform:uppercase; margin-bottom:1.1rem; font-weight:600; }
.footer a{ color:#bdd7da; display:inline-block; padding:.22rem 0; transition:color .15s; }
.footer a:hover{ color:var(--secondary); }
.footer__brand img{ height:96px; margin-bottom:1rem; filter:brightness(0) invert(1); opacity:.96; }
.footer__brand p{ color:#9bbabd; max-width:34ch; font-size:.9rem; }
.footer__col ul{ list-style:none; display:flex; flex-direction:column; }
.footer__social{ display:flex; gap:.6rem; margin-top:1rem; }
.footer__social a{ width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center; }
.footer__social a:hover{ background:var(--primary); }
.footer__social svg{ width:20px;height:20px;color:#fff; }
.footer__contact div{ display:flex; gap:.6rem; margin-bottom:.7rem; align-items:flex-start; }
.footer__contact svg{ width:17px;height:17px;color:var(--secondary);flex:none;margin-top:3px; }
.footer__bottom{ border-top:1px solid rgba(255,255,255,.1); margin-top:2.5rem; padding-top:1.5rem; display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-size:.82rem; color:#8fb0b3; }

/* ---------- whatsapp FAB ---------- */
.wa-fab{ position:fixed; inset-block-end:24px; inset-inline-end:24px; z-index:55; width:58px; height:58px; border-radius:50%; background:var(--wa); color:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 12px 28px -8px rgba(31,180,87,.6); transition:transform .2s; }
.wa-fab:hover{ transform:scale(1.08); }
.wa-fab svg{ width:30px;height:30px; }

/* ---------- sticky mobile action bar ---------- */
.mbar{ position:fixed; inset-inline:0; inset-block-end:0; z-index:70; display:none; background:var(--surface); border-top:1px solid var(--border); box-shadow:0 -8px 24px -12px rgba(21,50,58,.18); padding:.55rem .7rem calc(.55rem + env(safe-area-inset-bottom)); }
.mbar__inner{ display:grid; grid-template-columns:1fr 1fr 1.3fr; gap:.5rem; }
.mbar a{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.18rem; min-height:52px; border-radius:13px; font-family:var(--ff-head); font-weight:600; font-size:.78rem; }
.mbar svg{ width:21px;height:21px; }
.mbar .m-call{ background:var(--surface-2); color:var(--primary); }
.mbar .m-wa{ background:var(--surface-2); color:var(--wa-d); }
.mbar .m-book{ background:var(--primary); color:#fff; flex-direction:row; gap:.45rem; }

/* ---------- reveal animation ---------- */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .6s ease, transform .6s cubic-bezier(.2,.7,.3,1); }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1080px){
  .svc-grid{ grid-template-columns:repeat(3,1fr); }
  .team-grid{ grid-template-columns:repeat(6,1fr); }
}
@media (max-width:920px){
  .nav__links{ display:none; }
  .nav__cta .btn--ghost{ display:none; }
  .nav__burger{ display:flex; }
  .hero .wrap{ grid-template-columns:1fr; }
  .hero__media{ max-width:460px; margin-inline:auto; width:100%; }
  .feature .wrap, .book .wrap{ grid-template-columns:1fr; }
  .feature__media{ order:-1; }
  .ins-grid{ grid-template-columns:repeat(4,1fr); }
  .footer__grid{ grid-template-columns:1fr 1fr; gap:2rem; }
}
@media (max-width:760px){
  body{ padding-bottom:74px; }       /* room for sticky mobile bar */
  .mbar{ display:block; }
  .topbar__hide-sm{ display:none; }
  .wa-fab{ display:none; }
  .trust-card{ grid-template-columns:1fr 1fr; gap:.7rem; }
  .svc-grid{ grid-template-columns:1fr 1fr; gap:.85rem; }
  .branch-grid{ grid-template-columns:1fr; }
  .team-grid{ grid-template-columns:repeat(3,1fr); }
  .float-badge--tl{ inset-inline-start:-2%; }
  .float-badge--br{ inset-inline-end:-2%; }
}
@media (max-width:430px){
  body{ font-size:16px; }
  .ins-grid{ grid-template-columns:repeat(2,1fr); }
  .team-grid{ grid-template-columns:repeat(3,1fr); gap:.6rem; }
  .field-row{ grid-template-columns:1fr; }
  .hero__cta .btn{ flex:1; }
  .float-badge{ padding:.7rem .8rem; }
  .float-badge .n{ font-size:1.2rem; }
  .footer__grid{ grid-template-columns:1fr; gap:1.8rem; }
  .footer__bottom{ flex-direction:column; }
}
