/*
Theme Name: Acropolis Sun & Stars
Theme URI: https://acropolisunandstars.gr
Description: Boutique heritage-apartment theme for Acropolis Sun & Stars — a restored neoclassical building in Thissio, Athens. Child theme of Twenty Twenty-Four with a warm Mediterranean palette (ivory, sand, sea-blue, brass), elegant Cardo display type, a sticky translucent navigation, and a one-page landing layout.
Author: Acropolis Sun & Stars
Template: twentytwentyfour
Version: 1.4.0
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: acropolis-sun-stars
*/

/* ============================================================
   Brand tokens
   ============================================================ */
:root {
  --ass-base:      #faf6ee; /* warm ivory          */
  --ass-base-2:    #ffffff;
  --ass-ink:       #2b2722; /* warm near-black text */
  --ass-ink-soft:  #6a6055;
  --ass-sand:      #cbb189;
  --ass-sand-soft: #efe6d6;
  --ass-sea:       #3c6d8c; /* shutter sea-blue     */
  --ass-sea-deep:  #244b60;
  --ass-brass:     #a9844c;
  --ass-line:      rgba(43, 39, 34, .12);
  --ass-shadow:    0 18px 50px -24px rgba(36, 75, 96, .45);
  --ass-radius:    14px;
  --ass-nav-h:     74px;
}

/* ============================================================
   Base & rhythm
   ============================================================ */
html { scroll-behavior: smooth; }
:where(body) {
  background: var(--ass-base);
  color: var(--ass-ink);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* anchor offset so sticky nav never covers section titles */
:where([id]) { scroll-margin-top: calc(var(--ass-nav-h) + 18px); }

::selection { background: var(--ass-sand); color: var(--ass-ink); }

.wp-site-blocks :where(h1,h2,h3,h4) {
  font-family: "Cardo", Georgia, serif;
  font-weight: 400;
  letter-spacing: .2px;
  line-height: 1.12;
}
.wp-site-blocks p { line-height: 1.75; }

a { text-underline-offset: 3px; }

/* Kicker / eyebrow label */
.ass-kicker {
  font-family: "Inter", sans-serif !important;
  text-transform: uppercase;
  letter-spacing: .28em;
  font-size: .72rem !important;
  font-weight: 600;
  color: var(--ass-brass);
  margin-bottom: .4em !important;
}
.ass-kicker.is-light { color: #e9d8b8; }

/* Decorative sun/star divider */
.ass-rule {
  display: flex; align-items: center; justify-content: center;
  gap: 14px; color: var(--ass-brass); margin: 4px 0 2px;
}
.ass-rule::before, .ass-rule::after {
  content: ""; height: 1px; width: 54px;
  background: linear-gradient(90deg, transparent, currentColor);
}
.ass-rule::after { background: linear-gradient(90deg, currentColor, transparent); }
.ass-rule__dot { font-size: 1rem; line-height: 1; }

/* ============================================================
   Sticky navigation
   ============================================================ */
.ass-nav {
  position: fixed; inset: 0 0 auto 0; z-index: 100;
  min-height: var(--ass-nav-h);
  display: flex; align-items: center;
  padding-block: 0 !important;
  background: rgba(250, 246, 238, .72);
  -webkit-backdrop-filter: saturate(140%) blur(14px);
  backdrop-filter: saturate(140%) blur(14px);
  border-bottom: 1px solid transparent;
  transition: background .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.ass-nav.is-scrolled {
  background: rgba(250, 246, 238, .92);
  border-bottom-color: var(--ass-line);
  box-shadow: 0 10px 30px -22px rgba(36,75,96,.5);
}
.ass-nav__inner {
  width: min(1340px, 92vw); margin-inline: auto;
  display: flex; align-items: center; justify-content: space-between;
  gap: 18px;
}
.ass-brand {
  font-family: "Cardo", Georgia, serif !important;
  font-size: 1.18rem !important; line-height: 1.05 !important;
  color: var(--ass-ink) !important; text-decoration: none !important;
  letter-spacing: .3px; white-space: nowrap;
}
.ass-brand small {
  display: block; font-family: "Inter", sans-serif;
  font-size: .56rem; letter-spacing: .26em; text-transform: uppercase;
  color: var(--ass-brass); margin-top: 2px;
}
.ass-nav__links {
  display: flex; align-items: center; gap: 26px;
  font-family: "Inter", sans-serif; font-size: .82rem;
  letter-spacing: .04em;
}
.ass-nav__links a {
  color: var(--ass-ink); text-decoration: none; position: relative;
  padding: 6px 0; transition: color .2s ease;
}
.ass-nav__links a::after {
  content: ""; position: absolute; left: 0; bottom: 0; height: 1.5px; width: 0;
  background: var(--ass-brass); transition: width .25s ease;
}
.ass-nav__links a:hover { color: var(--ass-brass); }
.ass-nav__links a:hover::after { width: 100%; }

.ass-lang {
  font-family: "Inter", sans-serif; font-size: .78rem; letter-spacing: .08em;
  color: var(--ass-ink-soft) !important; text-decoration: none !important;
  border: 1px solid var(--ass-line); border-radius: 999px;
  padding: 5px 12px !important; transition: all .25s ease; white-space: nowrap;
}
.ass-lang:hover { border-color: var(--ass-brass); color: var(--ass-brass) !important; }

.ass-nav .ass-book {
  background: var(--ass-sea) !important; color: #fff !important;
  border-radius: 999px !important; padding: 9px 20px !important;
  font-size: .82rem !important; letter-spacing: .03em;
}
.ass-nav .ass-book:hover { background: var(--ass-sea-deep) !important; }

/* mobile toggle */
.ass-nav__toggle {
  display: none; border: 0; background: transparent; cursor: pointer;
  font-size: 1.5rem; line-height: 1; color: var(--ass-ink); padding: 6px 8px;
}

@media (max-width: 980px) {
  .ass-nav__toggle { display: inline-flex; }
  .ass-nav__links {
    position: absolute; top: var(--ass-nav-h); left: 0; right: 0;
    flex-direction: column; align-items: flex-start; gap: 4px;
    background: rgba(250,246,238,.98);
    -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--ass-line);
    padding: 14px clamp(16px, 4vw, 40px) 22px;
    box-shadow: var(--ass-shadow);
    display: none;
  }
  .ass-nav.is-open .ass-nav__links { display: flex; }
  .ass-nav__links a { padding: 10px 0; width: 100%; font-size: .95rem; }
  .ass-nav__links .ass-lang,
  .ass-nav__links .ass-book { display: inline-block; margin-top: 8px; }
}

/* ============================================================
   Hero (cover block)
   ============================================================ */
.ass-hero { min-height: 100svh; }
.ass-hero .wp-block-cover__inner-container { width: min(900px, 92vw); }
.ass-hero h1 {
  font-size: clamp(2.6rem, 7vw, 5.4rem) !important;
  color: #fff !important; line-height: 1.02 !important;
  text-shadow: 0 2px 30px rgba(0,0,0,.35);
}
.ass-hero p { color: rgba(255,255,255,.92) !important; }
.ass-hero .ass-hero__sub {
  font-family: "Inter", sans-serif !important;
  letter-spacing: .04em; font-size: 1.05rem !important;
}
.ass-scroll-cue {
  position: absolute; left: 50%; bottom: 26px; transform: translateX(-50%);
  color: rgba(255,255,255,.8); font-size: 1.4rem; animation: assBob 2.4s ease-in-out infinite;
}
@keyframes assBob { 0%,100%{transform:translate(-50%,0)} 50%{transform:translate(-50%,8px)} }

/* ============================================================
   Sections
   ============================================================ */
.ass-section {
  padding-block: clamp(56px, 9vw, 120px) !important;
  padding-inline: clamp(20px, 4vw, 72px) !important;
}
.ass-section--tight { padding-block: clamp(40px, 6vw, 80px) !important; }

/* ---- Guaranteed full-bleed (edge-to-edge) ----
   Anchors the hero and every section to the FULL viewport width,
   independent of any ancestor max-width. The 100vw + calc(50% - 50vw)
   trick works even when the WordPress container is narrow/centered. */
.wp-site-blocks { overflow-x: clip; }   /* clip the scrollbar-width overflow */

.ass-hero,
.ass-section {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}
.ass-section { padding-inline: clamp(14px, 1.8vw, 38px) !important; }

/* inner content fills the full-bleed section */
.ass-section.is-layout-constrained > * {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* keep the little "includes" pill centered and compact */
.ass-section.is-layout-constrained > .ass-includes {
  max-width: 1100px !important;
  margin-inline: auto !important;
}

@media (min-width: 1600px) {
  .ass-section .wp-block-columns { gap: clamp(3rem, 4vw, 6rem); }
}
.ass-lead {
  font-size: clamp(1.12rem, 1.7vw, 1.4rem) !important;
  line-height: 1.7 !important; color: var(--ass-ink-soft) !important;
}
.ass-h2 { font-size: clamp(2rem, 4.4vw, 3.1rem) !important; }

/* media + text rounded images */
.ass-round img, .wp-block-image.ass-round img { border-radius: var(--ass-radius); }
.ass-shadow img { box-shadow: var(--ass-shadow); }
.wp-block-image img { border-radius: var(--ass-radius); }

/* Feature cards */
.ass-card {
  background: var(--ass-base-2);
  border: 1px solid var(--ass-line);
  border-radius: var(--ass-radius);
  padding: 30px 28px !important;
  height: 100%;
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  position: relative; overflow: hidden;
}
.ass-card::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 3px;
  background: linear-gradient(90deg, var(--ass-sand), var(--ass-brass));
  transform: scaleX(0); transform-origin: left; transition: transform .35s ease;
}
.ass-card:hover { transform: translateY(-6px); box-shadow: var(--ass-shadow); border-color: transparent; }
.ass-card:hover::before { transform: scaleX(1); }
.ass-card h3 { font-size: 1.35rem !important; margin-bottom: .35em !important; }
.ass-card .ass-ico { font-size: 1.7rem; display: block; margin-bottom: .5rem; }
.ass-card p { color: var(--ass-ink-soft); font-size: .98rem; }

/* "Each unit includes" list */
.ass-check ul { list-style: none; margin: 0; padding: 0; }
.ass-check li {
  position: relative; padding-left: 30px; margin-bottom: 14px; line-height: 1.55;
}
.ass-check li::before {
  content: "✦"; position: absolute; left: 0; top: 1px;
  color: var(--ass-brass); font-size: .95rem;
}

/* Palette swatches (Design section) */
.ass-swatches { display: flex; flex-wrap: wrap; gap: 14px; }
.ass-swatch {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  font-family: "Inter", sans-serif; font-size: .68rem; letter-spacing: .14em;
  text-transform: uppercase; color: var(--ass-ink-soft);
}
.ass-swatch span {
  width: 58px; height: 58px; border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.06), var(--ass-shadow);
}

/* Location list */
.ass-place ul { list-style: none; margin: 0; padding: 0; }
.ass-place li {
  display: flex; gap: 14px; align-items: baseline;
  padding: 16px 0; border-bottom: 1px solid var(--ass-line); line-height: 1.5;
}
.ass-place li::before { content: "→"; color: var(--ass-brass); font-weight: 600; }
.ass-place li strong { font-family: "Cardo", serif; font-weight: 700; }
.ass-place .ass-dist {
  margin-left: auto; white-space: nowrap; color: var(--ass-sea);
  font-family: "Inter", sans-serif; font-size: .82rem; letter-spacing: .04em;
}
.ass-map iframe {
  width: 100%; border: 0; border-radius: var(--ass-radius);
  box-shadow: var(--ass-shadow); min-height: 320px; filter: saturate(.92);
}

/* ============================================================
   Gallery
   ============================================================ */
.ass-gallery figure { overflow: hidden; border-radius: var(--ass-radius); }
.ass-gallery img {
  transition: transform .6s cubic-bezier(.2,.7,.2,1), filter .4s ease;
  width: 100%;
}
.ass-gallery figure:hover img { transform: scale(1.07); }

/* ============================================================
   CTA / Contact
   ============================================================ */
.ass-cta { position: relative; overflow: hidden; }
.ass-cta h2 { color: #fff !important; }
.ass-cta p { color: rgba(255,255,255,.88) !important; }
.ass-contact-line a, .ass-contact-line {
  color: #fff !important; text-decoration: none; font-size: 1.15rem;
}
.ass-contact-line a:hover { color: var(--ass-sand) !important; }

.wp-block-button.ass-btn-gold .wp-block-button__link {
  background: var(--ass-sand) !important; color: var(--ass-ink) !important;
}
.wp-block-button.ass-btn-gold .wp-block-button__link:hover { background: #ddc59a !important; }

.wp-block-button .wp-block-button__link {
  border-radius: 999px !important; padding: 14px 30px !important;
  letter-spacing: .03em; transition: transform .25s ease, background .25s ease, box-shadow .25s ease;
}
.wp-block-button .wp-block-button__link:hover { transform: translateY(-2px); }
.wp-block-button.is-style-outline .wp-block-button__link { border-width: 1.5px; }

/* ============================================================
   Footer
   ============================================================ */
.ass-footer { background: var(--ass-ink); color: #cfc7bb; }
.ass-footer a { color: #cfc7bb; text-decoration: none; }
.ass-footer a:hover { color: var(--ass-sand); }
.ass-footer .ass-brand, .ass-footer .ass-brand:link { color: #fff !important; }
.ass-footer .ass-fine { color: #8c8478; font-size: .82rem; }

/* Footer button (e.g. → Balance Sheets / Ισολογισμοί) */
.ass-foot-btn {
  display: inline-block; margin-top: 16px;
  padding: 9px 20px; border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 999px; color: #fff !important; text-decoration: none !important;
  font-family: "Inter", sans-serif; font-size: .8rem; letter-spacing: .04em;
  transition: background .25s ease, color .25s ease, border-color .25s ease;
}
.ass-foot-btn:hover {
  background: var(--ass-sand); color: var(--ass-ink) !important; border-color: var(--ass-sand);
}

/* ============================================================
   Reveal on scroll
   ============================================================ */
/* Gated on html.js so content stays visible if scripting is unavailable. */
html.js .ass-reveal { opacity: 0; transform: translateY(26px); transition: opacity .8s ease, transform .8s ease; }
html.js .ass-reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .ass-reveal { opacity: 1; transform: none; transition: none; }
  .ass-scroll-cue { animation: none; }
}