/* Main menu: the editorial mega-menu (markup tools/nav.mjs, behaviour nav.js). Every rule is
   scoped under .idn (the header) and written to win over the theme's global button / link /
   list styles. Fonts and colours are the site's own: DidotDisplay, FreightNeo Pro, palette
   #FF82C8 #96F0FC #FFFF6E #F2B4FF #B4FFA8. Desktop from 1024px; below it the phone layout:
   logo-only bar at the top, Book Now · Call · Menu fixed at the bottom. */
:root {
  --idn-h: 72px;            /* desktop bar */
  --idn-mh: 60px;           /* phone top bar */
  --idn-thumb: 60px;        /* phone bottom bar, before the home-indicator inset */
  --idn-safe: env(safe-area-inset-bottom, 0px);
  --idn-ink: #000; --idn-mute: #5a5a5a; --idn-line: #e4e4e4;
  --idn-display: DidotDisplay, "Didot", "Bodoni 72", Georgia, serif;
  --idn-body: "FreightNeo Pro", "Helvetica Neue", Arial, sans-serif;
  --idn-ease: cubic-bezier(.2, .7, .2, 1);
}

/* resets against the theme */
.idn, .idn *, .idn *::before, .idn *::after { box-sizing: border-box; }
.idn button { all: unset; box-sizing: border-box; cursor: pointer; font-family: var(--idn-body); }
.idn a { color: inherit; text-decoration: none; }
.idn ul { list-style: none; margin: 0; padding: 0; }
.idn li { margin: 0; padding: 0; }
.idn li::before { content: none; }
.idn p { margin: 0; }
.idn img { max-width: none; }
.idn b { font-weight: 400; }
.idn .idn-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.idn svg { display: block; }
.idn [hidden] { display: none !important; }

.idn { position: fixed; top: 0; left: 0; right: 0; z-index: 9990; color: #000; background: #fff; font-family: var(--idn-body); font-size: 16px; line-height: 1.4; -webkit-font-smoothing: antialiased; transition: background-color .25s var(--idn-ease), color .25s var(--idn-ease); }
.idn.idn-overlay:not(.idn-solid) { background: transparent; color: #fff; }
/* the logo and labels on the hero photo: a soft shade at the top keeps white text legible */
.idn.idn-overlay:not(.idn-solid)::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 120%; pointer-events: none; background: linear-gradient(rgba(0,0,0,.28), rgba(0,0,0,0)); z-index: -1; }
/* on a white page (no hero) the content starts below the fixed bar */
/* (no top padding needed: the WordPress header also overlaid the page, so every page already
   leaves room for a bar at the top), except single posts (testimonials, press items), whose
   title sat under it */
body.idn-page.single .fl-page-content { padding-top: var(--idn-h); }
html { scroll-padding-top: calc(var(--idn-h) + 8px); }

.idn .idn-logo { display: flex; align-items: center; justify-content: center; width: 104px; min-height: 44px; color: inherit; }
.idn .idn-logo svg { width: 100%; height: 26px; }

/* ---------- desktop bar ---------- */
.idn .idn-bar { height: var(--idn-h); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 28px; border-bottom: 1px solid rgba(255,255,255,.4); }
.idn.idn-solid .idn-bar, .idn:not(.idn-overlay) .idn-bar { border-bottom-color: #000; }
.idn .idn-tops { display: flex; align-items: center; gap: 2px; }
.idn .idn-tops.idn-r { justify-content: flex-end; }
.idn .idn-tops > li { position: relative; }
.idn .idn-tops > li.idn-static { position: static; } /* its mega panel spans the header */
.idn .idn-tl { --idn-pad: 14px; display: inline-flex; align-items: center; height: 44px; padding: 0 var(--idn-pad); font-size: 16px; letter-spacing: .01em; white-space: nowrap; position: relative; color: inherit; }
/* One line for both links and disclosures; immune to WordPress's a{text-decoration:none!important}. */
.idn .idn-tl::after { content: ""; position: absolute; left: var(--idn-pad); right: var(--idn-pad); bottom: 6px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .25s var(--idn-ease); }
/* Current-page semantics stay in the markup, without a persistent visual marker. */
.idn .idn-tl:is(:focus-visible, [aria-expanded="true"])::after { transform: scaleX(1); }
.idn .idn-chevron { margin-left: 8px; width: 11px; height: 11px; display: inline-flex; flex: none; transition: transform .25s var(--idn-ease); }
.idn .idn-chevron svg { width: 100%; height: 100%; }
.idn .idn-tl[aria-expanded="true"] .idn-chevron { transform: rotate(180deg); }
.idn .idn-book { display: inline-flex; align-items: center; height: 44px; padding: 0 22px; margin-left: 10px; background: #000; color: #fff; font-size: 16px; border: 1px solid #000; white-space: nowrap; }
.idn.idn-overlay:not(.idn-solid) .idn-book { background: #fff; color: #000; border-color: #fff; }

/* mega panel: full width under the bar */
/* Keep the extra top-level Lab link clear of the logo at compact desktop widths. */
@media (min-width: 1024px) and (max-width: 1399px) {
  .idn .idn-bar { grid-template-columns: minmax(0, 1fr) auto auto; gap: 16px; padding: 0 16px; }
  .idn .idn-tl { --idn-pad: 8px; font-size: 15px; }
  .idn .idn-book { padding: 0 14px; margin-left: 2px; }
}
@media (min-width: 1024px) and (max-width: 1199px) {
  .idn .idn-r > li:has(> a[href^="tel:"]) { display: none; }
}
.idn .idn-mega { position: absolute; left: 0; right: 0; top: 100%; background: #fff; color: #000; border-bottom: 1px solid #000; max-height: calc(100vh - var(--idn-h)); overflow-y: auto; opacity: 0; transition: opacity .2s var(--idn-ease); }
.idn .idn-mega[hidden], .idn .idn-dd[hidden] { display: block !important; visibility: hidden; pointer-events: none; }
.idn .idn-mega.idn-open, .idn .idn-dd.idn-open { opacity: 1; visibility: visible; }
.idn .idn-mega-in { max-width: 1320px; margin: 0 auto; padding: 36px 40px 40px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) 300px; gap: 0 40px; }
/* the aside always takes the last track, so a panel with fewer columns (Concerns: two groups)
   keeps the Treatments column widths instead of stretching */
.idn .idn-mega-in > .idn-aside { grid-column: -2 / -1; }
.idn .idn-col { min-width: 0; }
.idn .idn-col.idn-wide { grid-column: span 2; }
.idn .idn-col.idn-wide ul { column-count: 2; column-gap: 40px; }
/* A widened category moves the complete Explore group below; its photo stays compact. */
.idn .idn-mega-in.idn-has-wide .idn-aside { grid-column: 1 / -1; border-left: 0; padding-left: 0; }
.idn .idn-mega-in.idn-has-wide .idn-explore { max-width: 300px; }
.idn .idn-col-h { display: inline-block; font: 400 28px/1.15 var(--idn-display); padding-bottom: 6px; margin-bottom: 14px; min-height: 44px; background-image: linear-gradient(var(--idn-acc), var(--idn-acc)); background-size: 100% 6px; background-position: 0 92%; background-repeat: no-repeat; transition: background-size .2s var(--idn-ease); }
.idn a.idn-col-h:focus-visible { background-size: 100% 45%; }
.idn .idn-go { font: 15px var(--idn-body); margin-left: 6px; }
.idn .idn-col-k { display: block; font: 12px/1 var(--idn-body); letter-spacing: .16em; text-transform: uppercase; color: var(--idn-mute); margin: 10px 0 18px; }
.idn .idn-col li { break-inside: avoid; }
.idn .idn-col li a { display: block; padding: 7px 0 9px; min-height: 44px; }
.idn .idn-col li a b, .idn .idn-explore-link b { display: block; font-size: 17px; line-height: 1.25; }
.idn .idn-col li a span, .idn .idn-explore-gloss { display: block; font-size: 14px; color: var(--idn-mute); line-height: 1.3; }
.idn .idn-col li.idn-extra { animation: idn-rise .25s var(--idn-ease) both; }
@keyframes idn-rise { from { opacity: 0; transform: translateY(-4px); } }
.idn .idn-more { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; margin-top: 6px; font-size: 14px; letter-spacing: .06em; text-transform: uppercase; color: #000; }
.idn .idn-more .idn-ln { width: 28px; height: 1px; background: #000; transition: width .2s var(--idn-ease); }
.idn .idn-more:is(:focus-visible, [aria-expanded="true"]) .idn-ln { width: 44px; }
.idn .idn-aside { border-left: 1px solid var(--idn-line); padding-left: 32px; }
.idn .idn-explore-h { margin: 0 0 14px; font-weight: 400 !important; }
.idn .idn-explore-links { display: grid; }
.idn .idn-explore-link { display: block; min-height: 44px; padding: 7px 0 9px; font-size: 17px; line-height: 1.25; }
.idn .idn-explore-copy { display: block; min-width: 0; }
.idn .idn-explore .idn-card { margin-top: 18px; }
.idn .idn-card { display: block; }
.idn .idn-card img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; display: block; background: #f3f0ec; }
.idn .idn-kick { display: block; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--idn-mute); margin: 14px 0 6px; }
.idn .idn-t { display: block; font: 400 24px/1.15 var(--idn-display); }
.idn .idn-all { display: flex; justify-content: space-between; align-items: center; min-height: 48px; margin-top: 18px; border-top: 1px solid #000; border-bottom: 1px solid #000; font-size: 15px; letter-spacing: .04em; }
.idn .idn-all + .idn-all { margin-top: -1px; }

/* short dropdowns (Doctors, About) */
.idn .idn-dd { position: absolute; top: calc(100% + 14px); left: 0; background: #fff; color: #000; border: 1px solid #000; padding: 20px 24px; min-width: 240px; opacity: 0; transition: opacity .2s; }
.idn .idn-r .idn-dd { left: auto; right: 0; }
.idn .idn-dd li a { display: flex; align-items: center; min-height: 44px; font-size: 16px; }
.idn .idn-dd .idn-all { margin-top: 14px; border-bottom: 0; border-top-color: var(--idn-line); --idn-acc: #FFFF6E; }
.idn .idn-docs { display: grid; grid-template-columns: repeat(2, 200px); gap: 20px; }
.idn .idn-doc .idn-n { display: block; }
.idn .idn-docs img { width: 200px; height: 240px; object-fit: cover; object-position: top; display: block; background: #f3f0ec; }
.idn .idn-docs .idn-n b { display: block; font: 400 21px/1.15 var(--idn-display); margin-top: 10px; }
.idn .idn-docs small { display: block; font-size: 14px; color: var(--idn-mute); }
.idn .idn-docs .idn-bk { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-size: 15px; }
/* Underline only a destination's title, leaving photos, helper copy and arrows untouched. */
.idn a:is(:focus-visible, :active) :is(b, .idn-link-text, .idn-t) { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
@media (hover: hover) and (pointer: fine) {
  .idn .idn-tl:hover::after { transform: scaleX(1); }
  .idn a:hover :is(b, .idn-link-text, .idn-t) { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
  .idn a.idn-col-h:hover { background-size: 100% 45%; }
  .idn .idn-more:hover .idn-ln { width: 44px; }
  .idn .idn-book:hover, .idn.idn-overlay:not(.idn-solid) .idn-book:hover { background: #FF82C8; color: #000; border-color: #FF82C8; }
}
.idn-scrim { position: fixed; inset: 0; z-index: 9980; background: rgba(0,0,0,.28); opacity: 0; pointer-events: none; transition: opacity .25s; }
.idn-scrim.idn-on { opacity: 1; pointer-events: auto; }

/* ---------- phone ---------- */
.idn .idn-m { display: none; }
@media (max-width: 1023px) {
  html { scroll-padding-top: calc(var(--idn-mh) + 8px); scroll-padding-bottom: calc(var(--idn-thumb) + var(--idn-safe) + 8px); }
  .idn .idn-d { display: none; }
  .idn .idn-mtop { display: flex; justify-content: center; align-items: center; height: var(--idn-mh); padding: 0 16px; border-bottom: 1px solid rgba(255,255,255,.4); }
  .idn.idn-solid .idn-mtop, .idn:not(.idn-overlay) .idn-mtop { border-bottom-color: #000; }
  /* the bottom bar: never covers content or a focused element (2.4.11) */
  body.idn-page { padding-bottom: calc(var(--idn-thumb) + var(--idn-safe)); }
  .idn .idn-thumb { display: grid; position: fixed; left: 0; right: 0; bottom: 0; z-index: 9995; grid-template-columns: 60% 1fr 1fr; background: #fff; color: #000; border-top: 1px solid #000; padding-bottom: var(--idn-safe); }
  /* the newsletter slide-in rises above the bar instead of covering it */
  .idn .idn-pfoot .idn-thumb { position: static; }
  body.idn-page.single .fl-page-content { padding-top: var(--idn-mh); }
  .pp-subscribe-box.pp-subscribe-slidein { bottom: calc(var(--idn-thumb) + var(--idn-safe)) !important; }
}
.idn .idn-thumb a, .idn .idn-thumb button { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: var(--idn-thumb); font-size: 17px; color: #000; text-align: center; }
.idn .idn-thumb .idn-bk { background: #000; color: #fff; }
.idn .idn-thumb > * + * { border-left: 1px solid #000; }
.idn .idn-burger { width: 18px; height: 11px; position: relative; border-top: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; display: inline-block; }
.idn .idn-burger::after { content: ""; position: absolute; left: 0; right: 0; top: 3.25px; border-top: 1.5px solid currentColor; }
.idn .idn-thumb :focus-visible { outline-offset: -4px !important; }

/* the full-screen menu (a modal dialog) */
.idn .idn-panel { position: fixed; inset: 0; z-index: 100010; background: #fff; color: #000; display: flex; flex-direction: column; transform: translateY(100%); transition: transform .32s var(--idn-ease); visibility: hidden; }
.idn .idn-panel[hidden] { display: flex !important; }
.idn .idn-panel.idn-open { transform: none; visibility: visible; }
html.idn-locked, html.idn-locked body { overflow: hidden; }
.idn .idn-ptop { flex: none; height: var(--idn-mh); display: flex; align-items: center; justify-content: center; border-bottom: 1px solid var(--idn-line); color: #000; }
.idn .idn-stage { flex: 1; min-height: 0; position: relative; overflow-y: auto; overscroll-behavior: contain; overflow-anchor: none; -webkit-overflow-scrolling: touch; }
.idn .idn-lvl { padding: 8px 24px 28px; background: #fff; }
.idn .idn-p1 > li { border-bottom: 1px solid var(--idn-line); }
.idn .idn-p1 > li > a, .idn .idn-p1 > li > button { display: grid; grid-template-columns: 1fr auto; align-items: center; width: 100%; text-align: left; min-height: 76px; padding: 10px 0; color: #000; }
.idn .idn-p1 > li > a > b, .idn .idn-p1 > li > button > b { font: 400 32px/1.05 var(--idn-display); }
.idn .idn-p1 > li > a > small, .idn .idn-p1 > li > button > small { grid-column: 1; display: block; font-size: 14px; color: var(--idn-mute); margin-top: 4px; }
.idn .idn-p1 .idn-dot { grid-row: 1 / span 2; grid-column: 2; width: 34px; height: 34px; background: var(--idn-acc); display: grid; place-items: center; position: relative; }
.idn .idn-p1 .idn-dot svg { width: 16px; height: 16px; transition: transform .2s var(--idn-ease); }
.idn .idn-p1 .idn-destination { background: transparent; }
.idn .idn-p1 > li > :is(a, button):active { background: #f4f4f4; }
.idn .idn-section-toggle[aria-expanded="true"] .idn-dot svg { transform: rotate(180deg); }
.idn .idn-section-toggle[aria-expanded="true"] { padding-bottom: 18px; }
.idn .idn-p2 { padding: 0 0 20px 14px; border-left: 2px solid var(--idn-acc); margin-bottom: 18px; animation: idn-rise .2s var(--idn-ease); }
.idn .idn-hub { display: flex; justify-content: space-between; align-items: center; min-height: 48px; border-bottom: 1px solid #000; font-size: 16px; margin-bottom: 18px; }
.idn .idn-p2 .idn-col { margin-bottom: 26px; }
.idn .idn-p2 .idn-col-h { font-size: 26px; margin-bottom: 6px; }
.idn .idn-p2 .idn-explore { border-left: 0; padding-left: 0; margin-bottom: 28px; }
.idn .idn-p2 .idn-explore-link { min-height: 56px; }
.idn .idn-p2 .idn-audiences { --idn-acc: #F2B4FF; border-top: 1px solid var(--idn-line); padding-top: 10px; }
.idn .idn-p2 .idn-audience + .idn-audience { margin-top: 20px; }
.idn .idn-p2 .idn-audience-gloss { font-size: 14px; color: var(--idn-mute); line-height: 1.3; }
.idn .idn-p2 .idn-col li a { min-height: 56px; }
.idn .idn-p2 .idn-more { min-height: 48px; }
.idn .idn-p2 .idn-col.idn-wide ul { column-count: 1; }
.idn .idn-p2 .idn-docs { grid-template-columns: 1fr 1fr; gap: 14px; }
.idn .idn-p2 .idn-docs img { width: 100%; height: auto; aspect-ratio: 4 / 5; }
.idn .idn-list a { display: flex; align-items: center; min-height: 56px; border-bottom: 1px solid var(--idn-line); font: 400 24px var(--idn-display); }
.idn .idn-pfoot { flex: none; border-top: 1px solid #000; }
.idn .idn-addr { padding: 10px 16px; font-size: 13px; color: var(--idn-mute); text-align: center; border-bottom: 1px solid var(--idn-line); }
.idn .idn-thumb-in { display: grid; grid-template-columns: 60% 1fr 1fr; padding-bottom: var(--idn-safe); }

/* The theme's "Skip to content" link shows at the top when focused: above the fixed bar (2.4.11) */
.fl-screen-reader-text:focus { position: fixed !important; top: 8px !important; left: 8px !important; z-index: 100020 !important; width: auto !important; height: auto !important; clip: auto !important; clip-path: none !important; background: #fff !important; color: #000 !important; padding: 12px 16px !important; border: 1px solid #000; }

/* Shop moved to the footer (tools/nav.mjs footerShop): 24px target like its neighbours (2.5.8) */
footer a[href^="https://dridriss.com"] { display: inline-block; min-height: 24px; line-height: 24px; }

@media (prefers-reduced-motion: reduce) {
  .idn, .idn *, .idn *::before, .idn *::after, .idn-scrim { transition-duration: .001ms !important; animation-duration: .001ms !important; }
}