/*
Theme Name: Islamorada Estates
Theme URI: https://islandmoradaestates.com
Description: Luxury coastal real estate child theme for islandmoradaestates.com
Version: 1.0.1
Template: twentytwentyfour
Author: Gold Peach Realty (WDF Factory)
Tags: block-theme, full-site-editing, luxury, real-estate, coastal
*/

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

:root {
  --ie-deep-ocean:  #0A3D52;
  --ie-warm-sand:   #C8A86B;
  --ie-seafoam:     #4A9B8E;
  --ie-ink-navy:    #0D1B2A;
  --ie-off-white:   #F7F5F0;
  --ie-coral-blush: #E8A898;
  --ie-font-serif:  'Cormorant Garant', Georgia, serif;
  --ie-font-sans:   'Outfit', system-ui, sans-serif;
  --ie-transition:  200ms ease;
  --ie-transition-slow: 500ms ease;
  --ie-shadow-card: 0 4px 24px rgba(10, 61, 82, 0.10);
  --ie-shadow-hover: 0 12px 48px rgba(10, 61, 82, 0.18);
}

*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: var(--ie-font-sans);
  color: var(--ie-ink-navy);
  background-color: var(--ie-off-white);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 { font-family: var(--ie-font-serif); }
h4, h5, h6 { font-family: var(--ie-font-sans); letter-spacing: 0.08em; text-transform: uppercase; }

/* ── Navigation ── */
.wp-block-navigation { font-family: var(--ie-font-sans); font-size: 0.875rem; font-weight: 500; letter-spacing: 0.06em; }
.wp-block-navigation a { color: #fff !important; text-decoration: none; transition: color var(--ie-transition); }
.wp-block-navigation a:hover { color: var(--ie-warm-sand) !important; }

.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  transition: background var(--ie-transition-slow), box-shadow var(--ie-transition-slow);
  background: transparent;
}
.site-header.scrolled {
  background: var(--ie-deep-ocean);
  box-shadow: 0 2px 20px rgba(10, 61, 82, 0.25);
}

/* ── Hero ── */
.ie-hero {
  position: relative; min-height: 95vh;
  display: flex; align-items: flex-end; overflow: hidden;
}
.ie-hero__bg {
  position: absolute; inset: 0;
  background-size: cover; background-position: center 40%;
  will-change: transform;
}
.ie-hero__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(10,61,82,0.15) 0%, rgba(13,27,42,0.72) 100%);
}
.ie-hero__content {
  position: relative; z-index: 2;
  padding: clamp(3rem,8vw,8rem) clamp(1.5rem,5vw,5rem);
  max-width: 900px;
}
.ie-hero__eyebrow {
  font-family: var(--ie-font-sans); font-size: 0.75rem; font-weight: 500;
  letter-spacing: 0.2em; text-transform: uppercase; color: var(--ie-warm-sand);
  margin-bottom: 1.5rem; display: flex; align-items: center; gap: 1rem;
}
.ie-hero__eyebrow::before { content:''; display:block; width:3rem; height:1px; background:var(--ie-warm-sand); }
.ie-hero h1 { color:#fff; font-weight:300; margin-bottom:1.5rem; }
.ie-hero__sub { font-size:1.125rem; color:rgba(255,255,255,0.82); max-width:540px; margin-bottom:2.5rem; line-height:1.6; }
.ie-hero__actions { display:flex; gap:1rem; flex-wrap:wrap; }

/* ── Buttons ── */
.ie-btn {
  display:inline-flex; align-items:center; gap:0.5rem;
  font-family:var(--ie-font-sans); font-size:0.8125rem; font-weight:500;
  letter-spacing:0.12em; text-transform:uppercase; text-decoration:none;
  padding:1rem 2.5rem; border:none; cursor:pointer;
  transition: transform var(--ie-transition), box-shadow var(--ie-transition), background var(--ie-transition);
}
.ie-btn:hover { transform:translateY(-2px); box-shadow:0 8px 32px rgba(10,61,82,0.25); }
.ie-btn--primary { background:var(--ie-deep-ocean); color:#fff; }
.ie-btn--primary:hover { background:#0D4D66; color:#fff; }
.ie-btn--gold { background:var(--ie-warm-sand); color:var(--ie-ink-navy); }
.ie-btn--gold:hover { background:#D4B87A; }
.ie-btn--ghost { background:transparent; color:#fff; border:1px solid rgba(255,255,255,0.5); }
.ie-btn--ghost:hover { border-color:#fff; background:rgba(255,255,255,0.08); }

/* ── Sections ── */
.ie-section { padding: clamp(4rem,8vw,8rem) clamp(1.5rem,5vw,5rem); }
.ie-section--white  { background:#fff; }
.ie-section--warm   { background:var(--ie-off-white); }
.ie-section--ocean  { background:var(--ie-deep-ocean); color:#fff; }
.ie-section--navy   { background:var(--ie-ink-navy); color:#fff; }
.ie-container { max-width:1400px; margin:0 auto; }
.ie-eyebrow { font-family:var(--ie-font-sans); font-size:0.75rem; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:var(--ie-warm-sand); margin-bottom:1rem; }
.ie-divider { width:3rem; height:1px; background:var(--ie-warm-sand); margin:1.5rem 0; }

/* ── Editorial Tiles ── */
.ie-tiles { display:grid; grid-template-columns:repeat(3,1fr); gap:0; }
@media(max-width:768px) { .ie-tiles { grid-template-columns:1fr; } }
.ie-tile { position:relative; overflow:hidden; aspect-ratio:4/5; cursor:pointer; }
.ie-tile img { width:100%; height:100%; object-fit:cover; transition:transform 500ms ease; }
.ie-tile:hover img { transform:scale(1.05); }
.ie-tile__overlay { position:absolute; inset:0; background:linear-gradient(to top,rgba(13,27,42,0.8) 0%,transparent 60%); display:flex; flex-direction:column; justify-content:flex-end; padding:2rem; }
.ie-tile__label { font-size:0.7rem; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:var(--ie-warm-sand); margin-bottom:0.5rem; }
.ie-tile__title { font-family:var(--ie-font-serif); font-size:clamp(1.5rem,3vw,2rem); font-weight:400; color:#fff; line-height:1.15; }

/* ── Split Section ── */
.ie-split { display:grid; grid-template-columns:1fr 1fr; }
@media(max-width:768px) { .ie-split { grid-template-columns:1fr; } }
.ie-split__text { padding:clamp(3rem,6vw,7rem) clamp(2rem,5vw,5rem); display:flex; flex-direction:column; justify-content:center; }
.ie-split__image { position:relative; overflow:hidden; min-height:500px; }
.ie-split__image img { width:100%; height:100%; object-fit:cover; transition:transform 600ms ease; }
.ie-split:hover .ie-split__image img { transform:scale(1.03); }

/* ── Cards ── */
.ie-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1.5rem; }
.ie-card { background:#fff; box-shadow:var(--ie-shadow-card); overflow:hidden; transition:transform var(--ie-transition-slow),box-shadow var(--ie-transition-slow); cursor:pointer; }
.ie-card:hover { transform:translateY(-6px); box-shadow:var(--ie-shadow-hover); }
.ie-card img { width:100%; aspect-ratio:16/10; object-fit:cover; }
.ie-card__body { padding:1.75rem; }
.ie-card__tag { font-size:0.7rem; font-weight:600; letter-spacing:0.16em; text-transform:uppercase; color:var(--ie-seafoam); margin-bottom:0.5rem; }
.ie-card__title { font-family:var(--ie-font-serif); font-size:1.4rem; font-weight:400; color:var(--ie-ink-navy); margin-bottom:0.75rem; line-height:1.2; }
.ie-card__desc { font-size:0.9375rem; color:#5a6a75; line-height:1.65; }
.ie-card__link { display:inline-flex; align-items:center; gap:0.4rem; margin-top:1.25rem; font-size:0.8rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:var(--ie-deep-ocean); text-decoration:none; border-bottom:1px solid var(--ie-warm-sand); padding-bottom:2px; transition:color var(--ie-transition); }
.ie-card__link:hover { color:var(--ie-warm-sand); }

/* ── Stats Row ── */
.ie-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:2rem; text-align:center; padding:3rem 0; }
.ie-stat__number { font-family:var(--ie-font-serif); font-size:clamp(2.5rem,5vw,4rem); font-weight:300; color:var(--ie-deep-ocean); line-height:1; }
.ie-stat__label { font-size:0.75rem; font-weight:600; letter-spacing:0.16em; text-transform:uppercase; color:#7a8a95; margin-top:0.5rem; }

/* ── CTA Strip ── */
.ie-cta-strip { background:var(--ie-deep-ocean); color:#fff; padding:clamp(4rem,7vw,7rem) clamp(1.5rem,5vw,5rem); text-align:center; }
.ie-cta-strip h2 { font-family:var(--ie-font-serif); font-size:clamp(2rem,5vw,3.5rem); font-weight:300; margin-bottom:1rem; }
.ie-cta-strip p { font-size:1.125rem; color:rgba(255,255,255,0.78); max-width:580px; margin:0 auto 2.5rem; line-height:1.65; }

/* ── Blog / Fishing Guide Cards ── */
.ie-blog-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:2rem; }
.ie-blog-card { background:#fff; box-shadow:var(--ie-shadow-card); overflow:hidden; transition:transform var(--ie-transition-slow),box-shadow var(--ie-transition-slow); }
.ie-blog-card:hover { transform:translateY(-4px); box-shadow:var(--ie-shadow-hover); }
.ie-blog-card img { width:100%; aspect-ratio:16/9; object-fit:cover; }
.ie-blog-card__body { padding:1.75rem; }
.ie-blog-card__category { font-size:0.7rem; font-weight:600; letter-spacing:0.18em; text-transform:uppercase; color:var(--ie-seafoam); margin-bottom:0.5rem; }
.ie-blog-card__title { font-family:var(--ie-font-serif); font-size:1.5rem; font-weight:400; color:var(--ie-ink-navy); margin:0.5rem 0 0.75rem; line-height:1.2; }
.ie-blog-card__excerpt { font-size:0.9375rem; color:#5a6a75; line-height:1.65; }
.ie-blog-card__meta { display:flex; align-items:center; gap:1rem; margin-top:1.25rem; font-size:0.8rem; color:#9aabb5; }

/* ── Scroll Reveal ── */
.ie-reveal { opacity:0; transform:translateY(24px); transition:opacity 600ms ease,transform 600ms ease; }
.ie-reveal.visible { opacity:1; transform:translateY(0); }

/* ── Footer ── */
.ie-footer { background:var(--ie-ink-navy); color:rgba(255,255,255,0.7); padding:4rem clamp(1.5rem,5vw,5rem); font-size:0.875rem; }
.ie-footer__grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:3rem; max-width:1400px; margin:0 auto 3rem; }
@media(max-width:900px) { .ie-footer__grid { grid-template-columns:1fr 1fr; } }
@media(max-width:550px) { .ie-footer__grid { grid-template-columns:1fr; } }
.ie-footer__brand { font-family:var(--ie-font-serif); font-size:1.5rem; color:#fff; font-weight:300; margin-bottom:1rem; }
.ie-footer h4 { font-size:0.7rem; font-weight:600; letter-spacing:0.18em; text-transform:uppercase; color:var(--ie-warm-sand); margin-bottom:1rem; }
.ie-footer a { display:block; color:rgba(255,255,255,0.65); text-decoration:none; margin-bottom:0.5rem; transition:color var(--ie-transition); }
.ie-footer a:hover { color:var(--ie-warm-sand); }
.ie-footer__bottom { max-width:1400px; margin:0 auto; border-top:1px solid rgba(255,255,255,0.1); padding-top:1.5rem; display:flex; justify-content:space-between; flex-wrap:wrap; gap:0.5rem; font-size:0.8rem; color:rgba(255,255,255,0.4); }

@media(max-width:768px) { .ie-hero { min-height:85vh; } }

/* Hide page title on front page */
.home .wp-block-post-title, .page-id-13 .wp-block-post-title { display:none !important; }