/* =====================================================================
   COAST 67 — Foundation v2 (revamp 2026)
   Loaded LAST on chrome pages, so it wins over tide / nav / elevate / book.

   Type    headings = Fraunces (SOFT 100, WONK 0 — rounded terminals that
           rhyme with the rounded logo; replaces Minimalust, whose capitals
           are swash glyphs) · body = Gowa · UI = Bantayog
   Colour  brand orange #D6894E stays for graphics (logo, rules, icons).
           Text uses --c67-orange-text (#9D5924, 4.91:1 on cream); body ink
           #5C5D55 (6.06:1). Nothing on the site renders below 13px.
   Logo    official artwork, vectorised (assets/logo/*.svg), inlined.
   ===================================================================== */

@font-face {
  font-family: "Fraunces";
  src: url("../fonts/coast67/fraunces-soft-latin.woff2") format("woff2");
  font-weight: 300 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Fraunces";
  src: url("../fonts/coast67/fraunces-soft-italic-latin.woff2") format("woff2");
  font-weight: 300 500; font-style: italic; font-display: swap;
}

/* ---- 1. Tokens ------------------------------------------------------ */
.coast67-tide {
  --c67-display: "Fraunces", Georgia, "Times New Roman", serif;
  --c67-ink-soft: #5C5D55;
  --c67-orange-text: #9D5924;
  --c67-orange-deep: #874B1E;
  --c67-foot-soft: #D6CFC2;
  --c67-fs-display: clamp(2.875rem, 1.5rem + 5.6vw, 6.5rem);
  --c67-fs-h2: clamp(2.125rem, 1.43rem + 2.86vw, 4rem);
  --c67-fs-h3: clamp(1.5rem, 1.27rem + .95vw, 2.125rem);
  --c67-fs-lead: clamp(1.3125rem, 1.17rem + .57vw, 1.6875rem);
  --c67-fs-body: clamp(1.1875rem, 1.14rem + .19vw, 1.3125rem);
  --c67-fs-label: clamp(.8125rem, .78rem + .1vw, .875rem);
  --c67-fs-ui: .875rem;
  --c67-fs-small: .8125rem;
}

/* ---- 2. Headings ---------------------------------------------------- */
.coast67-tide .elementor-heading-title {
  font-family: var(--c67-display); font-optical-sizing: auto; font-kerning: normal;
}
.coast67-tide h1.elementor-heading-title,
.coast67-tide h2.elementor-heading-title,
.coast67-tide h3.elementor-heading-title { font-weight: 350; }
.coast67-tide .elementor-heading-title em,
.coast67-tide .elementor-heading-title i { font-style: italic; font-weight: 300; }

.coast67-tide .c67-display .elementor-heading-title {
  font-family: var(--c67-display) !important; font-size: var(--c67-fs-display) !important;
  line-height: 1 !important; font-weight: 300 !important; letter-spacing: -.022em !important;
  text-transform: none !important; text-wrap: balance;
}
.coast67-tide .c67-h2 .elementor-heading-title {
  font-size: var(--c67-fs-h2) !important; line-height: 1.06 !important; font-weight: 340 !important;
  letter-spacing: -.016em !important; text-transform: none !important; text-wrap: balance;
}
.coast67-tide .c67-h3 .elementor-heading-title {
  font-size: var(--c67-fs-h3) !important; line-height: 1.15 !important; font-weight: 420 !important;
  letter-spacing: -.006em !important; text-transform: none !important; text-wrap: balance;
}
/* Home ethos (widget 88afd80): a sentence, set as a calm statement — not a
   display shout. TODO(P3): move to a c67-statement class in the builder. */
.coast67-tide .elementor-element-88afd80 .elementor-heading-title {
  font-size: clamp(1.625rem, 1.1rem + 1.75vw, 2.625rem) !important; line-height: 1.24 !important;
  font-weight: 320 !important; letter-spacing: -.01em !important; max-width: 21em; margin-inline: auto;
}

/* ---- 3. Labels: eyebrows + specs ------------------------------------ */
.coast67-tide .c67-eyebrow .elementor-heading-title {
  font-family: var(--c67-ui) !important; font-size: var(--c67-fs-label) !important;
  letter-spacing: .22em !important; line-height: 1.4 !important; font-weight: 400 !important;
  text-transform: uppercase; color: var(--c67-orange-text) !important;
}
.coast67-tide .c67-spec .elementor-widget-container {
  font-size: var(--c67-fs-label) !important; letter-spacing: .16em !important;
  line-height: 1.6 !important; color: var(--c67-orange-text) !important;
}
/* on photos: cream (the gold eyebrow disappeared against bright skies) */
.coast67-tide .c67-eyebrow.c67-on-image .elementor-heading-title {
  color: var(--c67-cream) !important; text-shadow: 0 1px 18px rgba(22, 23, 19, .6);
}
/* inside an ink band: gold reads (5.33:1); orange-text would not */
.coast67-tide .elementor-section:has(.c67-on-ink) .c67-eyebrow .elementor-heading-title,
.coast67-tide .elementor-section:has(.c67-on-ink) .c67-spec .elementor-widget-container { color: var(--c67-gold) !important; }

/* ---- 4. Running text ------------------------------------------------ */
.coast67-tide .elementor-widget-text-editor {
  font-size: var(--c67-fs-body); line-height: 1.62; color: var(--c67-ink-soft);
}
.coast67-tide .c67-lead .elementor-widget-container {
  font-size: var(--c67-fs-lead) !important; line-height: 1.45 !important; color: var(--c67-ink) !important;
  max-width: 30em; margin-inline: auto; text-wrap: pretty;
}
/* hero + band copy over photos and on ink: capped measure, still centred */
.coast67-tide .elementor-widget-text-editor.c67-on-image .elementor-widget-container {
  font-size: clamp(1.1875rem, 1.1rem + .35vw, 1.4375rem) !important; line-height: 1.55 !important;
  max-width: 34em; margin-inline: auto; text-wrap: pretty;
}
.coast67-tide .elementor-widget-text-editor.c67-on-ink .elementor-widget-container { max-width: 34em; margin-inline: auto; text-wrap: pretty; }
.coast67-tide .c67-on-image.c67-lead .elementor-widget-container,
.coast67-tide .c67-on-image .elementor-widget-container { color: var(--c67-cream) !important; }
.coast67-tide .c67-on-ink .elementor-widget-container { color: rgba(251, 243, 232, .88) !important; }
.coast67-tide .c67-includes .elementor-widget-container { font-size: var(--c67-fs-body) !important; line-height: 1.9 !important; }

/* ---- 5. Buttons ----------------------------------------------------- */
.coast67-tide .elementor-button {
  font-size: .8125rem !important; letter-spacing: .18em !important; padding: 17px 34px !important;
  min-height: 48px; border-color: rgba(78, 79, 71, .6) !important;
}
.coast67-tide .c67-pkg__btn, .coast67-tide .c67-esc__btn,
.coast67-tide .c67-overlay__book, .coast67-tide .c67-bkg__go {
  background: var(--c67-orange-text) !important; color: var(--c67-cream) !important;
  font-size: .8125rem; letter-spacing: .18em;
}
.coast67-tide .c67-pkg__btn:hover, .coast67-tide .c67-esc__btn:hover,
.coast67-tide .c67-overlay__book:hover, .coast67-tide .c67-bkg__go:hover { background: var(--c67-orange-deep) !important; }

/* ---- 6. Components -------------------------------------------------- */
/* escapes + package cards */
.coast67-tide .c67-pkg__name, .coast67-tide .c67-esc__name {
  font-family: var(--c67-display); font-weight: 340; text-transform: none; letter-spacing: -.014em;
  font-size: clamp(2rem, 1.4rem + 1.6vw, 2.9rem); line-height: 1.02;
}
.coast67-tide .c67-pkg__tag, .coast67-tide .c67-esc__tag { color: var(--c67-orange-text); }
.coast67-tide .c67-pkg__list li, .coast67-tide .c67-esc__list li { font-size: clamp(1.0625rem, 1rem + .2vw, 1.1875rem); line-height: 1.5; }
.coast67-tide .c67-pkg__amt, .coast67-tide .c67-esc__amt { font-family: var(--c67-display); font-weight: 300; letter-spacing: -.02em; }
.coast67-tide .c67-pkg__meta, .coast67-tide .c67-esc__meta { font-size: var(--c67-fs-small); letter-spacing: .12em; }
/* rooms: facilities, amenities, FAQ */
.coast67-tide .c67-fac__item h3 {
  font-family: var(--c67-display); font-weight: 420; text-transform: none; letter-spacing: -.006em;
  font-size: clamp(1.4rem, 1.2rem + .7vw, 1.8rem); line-height: 1.15;
}
.coast67-tide .c67-fac__item p { font-size: clamp(1.0625rem, 1rem + .2vw, 1.1875rem); }
.coast67-tide .c67-amen__gtitle { font-size: var(--c67-fs-label); letter-spacing: .2em; color: var(--c67-orange-text); }
.coast67-tide .c67-amen__grid li { font-size: clamp(1.0625rem, 1rem + .2vw, 1.1875rem); }
.coast67-tide .c67-ac__n { font-size: var(--c67-fs-label); color: var(--c67-orange-text); }
.coast67-tide .c67-ac__t {
  font-family: var(--c67-display); text-transform: none; letter-spacing: -.004em; font-weight: 400;
  font-size: clamp(1.25rem, 1.08rem + .6vw, 1.55rem); line-height: 1.25;
}
.coast67-tide .c67-ac__q:hover .c67-ac__t, .coast67-tide .c67-ac__item.is-open .c67-ac__t { color: var(--c67-orange-text); }
.coast67-tide .c67-ac__a p, .coast67-tide .c67-faq details > div { font-size: var(--c67-fs-body); }
/* restaurant menu */
.coast67-tide .c67-menu-cat .elementor-heading-title { font-size: var(--c67-fs-h3) !important; font-weight: 380 !important; letter-spacing: -.008em !important; }
.coast67-tide .c67-dish__name { font-size: .9375rem; letter-spacing: .1em; }
.coast67-tide .c67-dish__price { font-size: .9375rem; font-variant-numeric: tabular-nums; }
.coast67-tide .c67-dish__desc { font-size: 1.0625rem; }
.coast67-tide .c67-menu-note .elementor-widget-container { font-size: clamp(1.0625rem, 1rem + .2vw, 1.1875rem) !important; }
.coast67-tide .c67-menu-foot .elementor-widget-container { font-size: 1.0625rem !important; opacity: 1; }
/* journal cards + article */
.coast67-tide .c67-journal__date { font-size: var(--c67-fs-label); letter-spacing: .2em; color: var(--c67-orange-text); }
.coast67-tide .c67-journal__title { font-family: var(--c67-display); font-weight: 400; font-size: clamp(1.45rem, 1.15rem + 1vw, 1.9rem); line-height: 1.12; letter-spacing: -.01em; }
.coast67-tide .c67-journal__excerpt { font-size: 1.0625rem; }
.coast67-tide .c67-journal__more { font-size: var(--c67-fs-label); letter-spacing: .2em; }
.coast67-tide .c67-journal__card:hover .c67-journal__more { color: var(--c67-orange-text); }
.coast67-tide .c67-post__eyebrow { font-size: var(--c67-fs-label); letter-spacing: .24em; color: var(--c67-orange-text); }
.coast67-tide .c67-post__title { font-family: var(--c67-display); font-weight: 300; font-size: var(--c67-fs-h2); line-height: 1.04; letter-spacing: -.018em; }
.coast67-tide .c67-post__body { font-size: var(--c67-fs-body); line-height: 1.75; }
.coast67-tide .c67-post__body h2, .coast67-tide .c67-post__body h3 { font-family: var(--c67-display); font-weight: 400; letter-spacing: -.01em; }
.coast67-tide .c67-post__body a, .coast67-tide.c67-policy .elementor-widget-text-editor a { color: var(--c67-orange-text); }
.coast67-tide .c67-post__back a { font-size: var(--c67-fs-label); }
/* legal pages */
.coast67-tide.c67-policy .elementor-widget-heading .elementor-heading-title { font-family: var(--c67-display); font-weight: 300; font-size: var(--c67-fs-h2); letter-spacing: -.016em; }
.coast67-tide.c67-policy .elementor-widget-text-editor { font-size: var(--c67-fs-body); line-height: 1.75; }
.coast67-tide.c67-policy .elementor-widget-text-editor h3 { font-family: var(--c67-display); font-weight: 420; }
/* contact form */
.coast67-tide .wpcf7 label { font-size: var(--c67-fs-label) !important; letter-spacing: .18em; }
.coast67-tide .wpcf7 input[type="text"], .coast67-tide .wpcf7 input[type="email"],
.coast67-tide .wpcf7 input[type="tel"], .coast67-tide .wpcf7 input[type="date"],
.coast67-tide .wpcf7 textarea { font-size: 1.1875rem !important; }
.coast67-tide .wpcf7 input[type="submit"] { font-size: .8125rem !important; letter-spacing: .18em; min-height: 48px; }
.coast67-tide .wpcf7 .wpcf7-not-valid-tip { font-size: var(--c67-fs-small); }
/* gallery lightbox counter */
.c67-lb__count { font-size: var(--c67-fs-small, .8125rem); }

/* ---- 7. Header bar + logo ------------------------------------------- */
.c67-logo { display: block; }
.c67-logo svg { display: block; width: auto; height: 100%; }
.c67-bar__brand { gap: 0; }
.c67-bar__logo { height: clamp(32px, 2.2vw + 12px, 44px); color: inherit; transition: color .45s var(--c67-ease), height .45s var(--c67-ease); }
.c67-bar.is-scrolled .c67-bar__logo { height: clamp(30px, 1.6vw + 12px, 38px); }
/* on cream (scrolled / menu open / cream pages): the official orange artwork */
.c67-bar.is-scrolled .c67-bar__logo, .c67-bar.is-open .c67-bar__logo,
body.c67-policy .c67-bar .c67-bar__logo, body.single .c67-bar .c67-bar__logo { color: var(--c67-orange); }
/* review option: orange mark + ink wordmark (toggle body.c67-logo-twotone) */
body.c67-logo-twotone .c67-bar.is-scrolled .c67-logo__word, body.c67-logo-twotone .c67-bar.is-open .c67-logo__word,
body.c67-logo-twotone.c67-policy .c67-bar .c67-logo__word, body.c67-logo-twotone.single .c67-bar .c67-logo__word { color: var(--c67-ink); }
/* pages that open on cream (contact, legal, journal posts — body.c67-cream-top
   from functions.php): ink bar text, orange logo, no photo scrim */
body.c67-cream-top .c67-bar { color: var(--c67-ink); }
body.c67-cream-top .c67-bar::after { opacity: 0; }
body.c67-cream-top .c67-bar .c67-bar__logo { color: var(--c67-orange); }
body.c67-logo-twotone.c67-cream-top .c67-bar .c67-logo__word { color: var(--c67-ink); }
.c67-bar__menu, .c67-bar__book { font-size: var(--c67-fs-ui); letter-spacing: .16em; }
.c67-bar__book { padding: 12px 20px; }
.c67-bar__book:hover { background: var(--c67-orange-text); border-color: var(--c67-orange-text); color: var(--c67-cream); }
@media (max-width: 560px) {
  .c67-bar__logo, .c67-bar.is-scrolled .c67-bar__logo { height: 30px; }
  .c67-bar__right { gap: 14px; }
  .c67-bar__menu-label { min-width: 0; }
  .c67-bar__book { padding: 11px 14px; }
}

/* ---- 8. Menu overlay ------------------------------------------------ */
.c67-overlay__eyebrow { font-size: var(--c67-fs-label); letter-spacing: .24em; color: var(--c67-orange-text); }
.c67-index__label {
  font-family: var(--c67-display); font-weight: 340; text-transform: none; letter-spacing: -.012em;
  font-size: clamp(1.7rem, min(4vw, 5.6vh), 3.2rem); line-height: 1.05; padding-bottom: .08em;
}
.c67-index__item a:hover .c67-index__label, .c67-index__item a.is-current .c67-index__label { color: var(--c67-orange-text); }
.c67-overlay__contact { font-size: .9375rem; line-height: 1.9; }
.c67-overlay__contact a:hover { color: var(--c67-orange-text); border-color: var(--c67-orange-text); }

/* ---- 9. Footer ------------------------------------------------------ */
.c67-foot__logo { width: clamp(150px, 9vw + 60px, 196px); color: var(--c67-cream); }
.c67-foot__logo svg { width: 100%; height: auto; }
.c67-foot__col .c67-foot__line { color: var(--c67-foot-soft); font-size: 1.0625rem; line-height: 1.6; letter-spacing: 0; margin-top: 26px; }
.c67-foot h4 { font-size: var(--c67-fs-label); letter-spacing: .2em; }
.c67-foot__col p, .c67-foot__col a { font-size: .9375rem; }
.c67-foot__col a, .c67-foot a { color: rgba(251, 243, 232, .92); }
.c67-foot a:hover { color: var(--c67-gold); }
.c67-foot .c67-foot__book { display: inline-flex; align-items: center; font-size: .8125rem; letter-spacing: .18em; min-height: 48px; }
.c67-foot__bottom, .c67-foot__bottom a { font-size: var(--c67-fs-small); letter-spacing: .1em; color: var(--c67-foot-soft); }
.c67-foot__bottom .c67-foot__legal a:hover { color: var(--c67-gold); }

/* ---- 10. Preloader + page-turn: the vector mark + wordmark ----------- */
.c67-pre__mark { width: 60px; height: auto; color: var(--c67-orange); }
.c67-pre__mark svg { width: 100%; height: auto; }
.c67-pre__word { display: block; width: 150px; overflow: visible; padding: 0; letter-spacing: 0; color: var(--c67-ink); }
.c67-pre__word svg { display: block; width: 100%; height: auto; overflow: hidden; }
/* letters rise one by one from behind the baseline (paths sit in a y-flipped
   group, so -140% in local space is visually downward) */
.c67-pre__word .c67-wm-l {
  transform-box: fill-box; transform: translateY(-140%);
  animation: c67-pre-rise .9s cubic-bezier(.16, 1, .3, 1) forwards;
  animation-delay: calc(.38s + var(--i, 0) * .055s);
}
@keyframes c67-pre-rise { to { transform: none; } }
.c67-turn__mark { width: 54px; height: auto; color: var(--c67-orange); }
@media (prefers-reduced-motion: reduce) {
  .c67-pre__word .c67-wm-l { transform: none; animation: none; }
}

/* ---- 11. Booking bar + calendar (/book/) ----------------------------- */
.coast67-tide .c67-bkg__label { font-size: var(--c67-fs-label); letter-spacing: .2em; color: var(--c67-orange-text); }
.coast67-tide .c67-bkg__value { font-family: var(--c67-display); font-weight: 350; font-size: clamp(1.2rem, 1rem + .6vw, 1.45rem); letter-spacing: -.005em; }
.coast67-tide .c67-bkg__rawf span { font-size: var(--c67-fs-label); color: var(--c67-orange-text); }
.coast67-tide .c67-bkg__rawf input { font-family: var(--c67-display); }
.coast67-tide .c67-bkg__guestname, .coast67-tide .c67-bkg__stepval { font-family: var(--c67-display); font-weight: 400; }
.coast67-tide .c67-bkg__guesthint { font-size: var(--c67-fs-small); }
.coast67-tide .c67-bkg__popdone { font-size: var(--c67-fs-small); min-height: 44px; }
.c67-cal .flatpickr-current-month .flatpickr-monthDropdown-months,
.c67-cal .flatpickr-current-month input.cur-year { font-family: "Fraunces", Georgia, serif; font-weight: 400; }
.c67-cal .flatpickr-monthDropdown-months { font-weight: 400; }
.c67-cal span.flatpickr-weekday { font-size: 12px; color: #5C5D55; }

/* ---- 12. Focus: visible, on-brand (replaces the browser's blue ring) -- */
.coast67-tide a:focus-visible, .coast67-tide button:focus-visible,
.coast67-tide [role="button"]:focus-visible, .coast67-tide input:focus-visible,
.coast67-tide textarea:focus-visible, .coast67-tide summary:focus-visible {
  outline: 2px solid currentColor; outline-offset: 4px;
}
.c67-index__item a:focus-visible { outline-offset: 6px; }