/*
Theme Name: Airy Communities
Theme URI: https://airycommunities.com
Author: Airy Communities
Description: Custom WordPress theme created from the Airy Communities static website.
Version: 1.0.0
Text Domain: airy-communities
*/

:root{
    --gold: #C8A46B;
    --gold-soft: rgba(200,164,107,0.35);
    --charcoal: #1B1B1D;
    --charcoal-soft: #26262A;
    --warm-gray: #8C8C8C;
    --light-gray: #F3F3F3;
    --white: #FFFFFF;
    --serif: 'Fraunces', serif;
    --sans: 'Inter', sans-serif;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth; overflow-x:hidden;}
  body{
    font-family: var(--sans);
    background: var(--white);
    color: var(--charcoal);
  }
  a{text-decoration:none;color:inherit;}

  .eyebrow{
    font-family: var(--sans);
    font-size: 0.72rem;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: var(--gold);
    font-weight: 500;
  }

  h1,h2,h3{ font-family: var(--serif); font-weight:400; letter-spacing:0.01em; }

  .btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding: 16px 32px;
    font-size: 0.78rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight:500;
    border: 1px solid var(--charcoal);
    color: var(--charcoal);
    transition: all 0.5s cubic-bezier(.2,.7,.3,1);
    cursor:pointer;
    background:none;
  }
  .btn:hover{ background: var(--charcoal); color: var(--white); }
  .btn.solid{ background: var(--charcoal); color: var(--white); }
  .btn.solid:hover{ background: var(--gold); border-color: var(--gold); color: var(--charcoal); }
  .btn.gold{ border-color: var(--gold); color: var(--gold); }
  .btn.gold:hover{ background: var(--gold); color: var(--charcoal); }
  .btn.light{ border-color: rgba(255,255,255,0.4); color: var(--white); }
  .btn.light:hover{ background: var(--white); color: var(--charcoal); }

  /* ===== NAV ===== */
  nav{
    position: relative; z-index: 100;
    display:flex; align-items:center; justify-content:space-between;
    padding: 28px 5vw;
    background: var(--charcoal);
    color: white;
    transition: padding 0.4s ease;
  }
  nav.scrolled{ padding: 16px 5vw; }
  .logo{ font-family: var(--serif); font-size:1.25rem; letter-spacing:0.08em; display:flex; align-items:center; gap:10px; }
  .logo span{ color: var(--gold); }
  .logo-mark{ width:20px; height:26px; flex-shrink:0; display:block; }
  .nav-links{ display:flex; gap: 40px; font-size: 0.75rem; letter-spacing: 0.16em; text-transform:uppercase; }
  .nav-links a{ position:relative; }
  .nav-links a::after{
    content:''; position:absolute; left:0; bottom:-6px; width:0; height:1px; background: var(--gold);
    transition: width 0.4s ease;
  }
  .nav-links a:hover::after{ width:100%; }
  .nav-toggle{
    display:none; flex-direction:column; gap:6px; background:none; border:none; cursor:pointer; padding:6px; z-index:110;
  }
  .nav-toggle span{ width:24px; height:1.5px; background: currentColor; display:block; transition: all 0.35s ease; }
  .nav-toggle.open span:nth-child(1){ transform: translateY(7.5px) rotate(45deg); }
  .nav-toggle.open span:nth-child(2){ opacity:0; }
  .nav-toggle.open span:nth-child(3){ transform: translateY(-7.5px) rotate(-45deg); }

  .mobile-menu{
    position: fixed; inset:0; z-index:99;
    background: var(--charcoal);
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:36px;
    opacity:0; visibility:hidden; transform: translateY(-16px);
    transition: opacity 0.4s ease, transform 0.4s ease, visibility 0.4s;
  }
  .mobile-menu.open{ opacity:1; visibility:visible; transform: translateY(0); }
  .mobile-menu a{
    color: var(--white); font-size:1rem; letter-spacing:0.18em; text-transform:uppercase; font-family: var(--sans); font-weight:500;
  }
  .mobile-menu a:hover{ color: var(--gold); }

  /* ===== HERO ===== */
  .hero{
    position: relative;
    height: 100vh;
    min-height: 720px;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    background: var(--charcoal);
    overflow:hidden;
    text-align:center;
  }
  .hero-lines{ position:absolute; inset:0; opacity:0.5; }
  .hero-vignette{
    position:absolute; inset:0;
    background: radial-gradient(ellipse at center, transparent 30%, rgba(27,27,29,0.9) 100%);
  }
  .hero-content{ position:relative; z-index:2; color: var(--white); padding: 0 24px; }
  .hero .eyebrow{ opacity:0; animation: rise 1s ease forwards 0.3s; }
  .hero h1{
    font-size: clamp(2.4rem, 6vw, 5rem);
    line-height: 1.05;
    margin: 22px 0 26px;
    font-weight:300;
    opacity:0; animation: rise 1.2s ease forwards 0.6s;
  }
  .hero h1 em{ font-style:italic; color: var(--gold); }
  .hero p{
    max-width: 560px; margin: 0 auto 44px;
    font-size: 1.02rem; line-height:1.7; color: rgba(255,255,255,0.75);
    opacity:0; animation: rise 1.2s ease forwards 0.9s;
  }
  .hero-btns{ display:flex; gap:18px; justify-content:center; flex-wrap:wrap;
    opacity:0; animation: rise 1.2s ease forwards 1.2s; }

  @keyframes rise{ from{opacity:0; transform: translateY(24px);} to{opacity:1; transform: translateY(0);} }

  .scroll-cue{
    position:absolute; bottom: 36px; left:50%; transform: translateX(-50%);
    color: rgba(255,255,255,0.5); font-size:0.68rem; letter-spacing:0.3em; text-transform:uppercase;
    display:flex; flex-direction:column; align-items:center; gap:10px;
    opacity:0; animation: rise 1s ease forwards 1.6s;
  }
  .scroll-cue::after{
    content:''; width:1px; height:40px; background: linear-gradient(var(--gold), transparent);
    animation: pulse-line 2s ease-in-out infinite;
  }
  @keyframes pulse-line{ 0%,100%{opacity:0.3;} 50%{opacity:1;} }

  /* ===== GENERIC SECTION ===== */
  section{ padding: 140px 5vw; position:relative; }
  .section-inner{ max-width: 1180px; margin:0 auto; }
  .reveal{ opacity:0; transform: translateY(36px); transition: all 1.1s cubic-bezier(.2,.7,.3,1); }
  .reveal.in{ opacity:1; transform: translateY(0); }

  /* ===== PURPOSE ===== */
  .purpose{ background: var(--white); text-align:center; }
  .purpose h2{ font-size: clamp(1.8rem, 3.4vw, 2.6rem); max-width: 780px; margin: 20px auto 0; line-height:1.4; color: var(--charcoal-soft); font-weight:300; }
  .purpose-grid{
    margin-top: 70px; display:grid; grid-template-columns: repeat(4,1fr); gap:0;
    border-top: 1px solid #eaeaea;
  }
  .purpose-item{ padding: 40px 20px; border-right: 1px solid #eaeaea; }
  .purpose-item:last-child{ border-right:none; }
  .purpose-item .num{ font-family: var(--serif); font-size:0.85rem; color: var(--gold); }
  .purpose-item h4{ font-family: var(--sans); font-weight:600; font-size:0.95rem; margin-top:14px; letter-spacing:0.02em; }

  /* ===== ABOUT ===== */
  .about{ background: var(--light-gray); }
  .about-grid{ display:grid; grid-template-columns: 0.9fr 1.1fr; gap: 90px; align-items:center; }
  .about-visual{
    aspect-ratio: 3/2; background: var(--charcoal); position:relative; overflow:hidden;
  }
  .about-text .eyebrow{ margin-bottom:18px; display:block; }
  .about-text h2{ font-size: clamp(1.9rem, 3.2vw, 2.6rem); font-weight:300; line-height:1.25; margin-bottom:26px; }
  .about-text p{ color: var(--warm-gray); line-height:1.85; font-size:1.02rem; max-width: 520px; }
  .about-text p + p{ margin-top:18px; }

  /* ===== OWNERS ===== */
  .owners{ background: var(--white); }
  .owner-profile{
    display:grid; grid-template-columns: 0.85fr 1.15fr; gap: 90px; align-items:start;
  }
  .owner-profile + .owner-profile{ margin-top: 120px; }
  .owner-profile.reverse{ grid-template-columns: 1.15fr 0.85fr; }
  .owner-profile.reverse .owner-visual{ order:2; }
  .owner-profile.reverse .owner-text{ order:1; }
  .owner-visual{
    aspect-ratio: 4/5; background: var(--charcoal); position:relative; overflow:hidden;
  }
  .owner-visual .placeholder-label{
    position:absolute; bottom:24px; left:24px; z-index:2;
    font-size:0.65rem; letter-spacing:0.2em; text-transform:uppercase;
    color: rgba(255,255,255,0.45);
  }
  .owner-text .eyebrow{ margin-bottom:18px; display:block; }
  .owner-text h2{ font-size: clamp(1.9rem, 3.2vw, 2.6rem); font-weight:300; line-height:1.2; margin-bottom:6px; }
  .owner-title{
    font-size:0.85rem; letter-spacing:0.1em; text-transform:uppercase;
    color: var(--gold); margin-bottom:28px; display:block;
  }
  .owner-text p{ color: var(--warm-gray); line-height:1.85; font-size:1.02rem; max-width: 540px; }
  .owner-text p + p{ margin-top:18px; }
  .founder-statement{
    margin: 36px 0 0 0; padding: 32px 0 0 32px;
    border-left: 2px solid var(--gold);
    max-width: 540px;
  }
  .founder-statement-label{
    font-size:0.75rem; letter-spacing:0.16em; text-transform:uppercase;
    color: var(--gold); margin-bottom:16px !important; font-style:normal;
  }
  .founder-statement p{ font-style: italic; color: var(--warm-gray); line-height:1.85; font-size:1.02rem; }
  .founder-statement p + p{ margin-top:18px; }
  .founder-statement footer{
    margin-top:20px; font-style:normal; font-size:0.85rem;
    letter-spacing:0.05em; color: var(--gold);
  }
  @media (max-width: 860px){
    .owner-profile, .owner-profile.reverse{ grid-template-columns: 1fr; gap:40px; }
    .owner-profile.reverse .owner-visual{ order:1; }
    .owner-profile.reverse .owner-text{ order:2; }
    .owner-profile + .owner-profile{ margin-top: 80px; }
  }

  /* ===== MISSION (FULL STATEMENT) ===== */
  .mission{ background: var(--white); }
  .mission-text p{ color: var(--warm-gray); line-height:1.9; font-size:1.02rem; margin-bottom:22px; }
  .mission-close{ font-family: var(--serif); font-style:italic; color: var(--charcoal) !important; font-size:1.25rem !important; line-height:1.6 !important; margin-top:34px !important; border-left: 2px solid var(--gold); padding-left:24px; }

  /* ===== VALUES ===== */
  .values{ background: var(--charcoal); color: var(--white); }
  .values-head{ text-align:center; margin-bottom: 80px; }
  .values-head h2{ font-size: clamp(1.9rem,3.2vw,2.6rem); font-weight:300; margin-top:16px; }
  .values-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: rgba(255,255,255,0.08); }
  .value-card{ background: var(--charcoal); padding: 48px 30px; transition: background 0.5s ease; }
  .value-card:hover{ background: var(--charcoal-soft); }
  .value-card h3{ font-size:1.3rem; font-weight:400; color: var(--gold); margin-bottom:16px; }
  .value-card p{ color: rgba(255,255,255,0.6); font-size:0.92rem; line-height:1.7; }

  /* ===== PHILOSOPHY ===== */
  .philosophy{ background: var(--white); }
  .phil-head{ text-align:center; margin-bottom:80px; }
  .phil-head h2{ font-size: clamp(1.9rem,3.2vw,2.6rem); font-weight:300; margin-top:16px; }
  .phil-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:60px; }
  .phil-item{ text-align:center; padding: 0 10px; }
  .phil-icon{ width:56px; height:56px; margin: 0 auto 26px; }
  .phil-item h3{ font-size:1.15rem; font-weight:500; font-family: var(--sans); margin-bottom:14px; letter-spacing:0.01em;}
  .phil-item p{ color: var(--warm-gray); font-size:0.95rem; line-height:1.75; }

  /* ===== INTELLIGENCE ===== */
  .intelligence{
    background: var(--charcoal);
    color:var(--white);
    position:relative;
    overflow:hidden;
  }
  .intel-grid-bg{ position:absolute; inset:0; opacity:0.25; }
  .intel-inner{ position:relative; z-index:2; display:grid; grid-template-columns: 1fr 1fr; gap:80px; align-items:center; }
  .intel-text .eyebrow{ margin-bottom:18px; display:block; }
  .intel-text h2{ font-size: clamp(1.9rem,3.4vw,2.7rem); font-weight:300; line-height:1.2; margin-bottom:22px; }
  .intel-text h2 span{ color: var(--gold); font-style:italic; }
  .intel-text p{ color: rgba(255,255,255,0.65); line-height:1.85; font-size:1rem; max-width:480px; margin-bottom:36px; }
  .intel-features{ display:grid; grid-template-columns: 1fr 1fr; gap: 26px 20px; margin-bottom:40px; }
  .intel-feature{ display:flex; align-items:flex-start; gap:14px; }
  .intel-feature .dot{ width:6px; height:6px; border-radius:50%; background: var(--gold); margin-top:8px; flex-shrink:0; }
  .intel-feature span{ font-size:0.9rem; color: rgba(255,255,255,0.8); line-height:1.5; }
  .intel-visual{ position:relative; aspect-ratio:1/1; }

  /* ===== PROJECTS ===== */
  .projects{ background: var(--light-gray); }
  .proj-head{ display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:70px; flex-wrap:wrap; gap:20px;}
  .proj-head h2{ font-size: clamp(1.9rem,3.2vw,2.6rem); font-weight:300; margin-top:16px; }
  .proj-grid{ display:grid; grid-template-columns: repeat(2,1fr); gap:2px; background:#e2e2e2; }
  .proj-card{ background: var(--white); padding: 52px 44px; transition: all 0.5s ease; position:relative; }
  .proj-card:hover{ background: var(--charcoal); }
  .proj-card:hover .proj-name, .proj-card:hover .proj-type{ color: var(--white); }
  .proj-card:hover .proj-status{ color: var(--gold); border-color: var(--gold-soft); }
  .proj-status{
    display:inline-block; font-size:0.65rem; letter-spacing:0.16em; text-transform:uppercase;
    color: var(--warm-gray); border:1px solid #ddd; padding:6px 14px; margin-bottom:22px; transition: all 0.5s ease;
  }
  .proj-name{ font-family: var(--serif); font-size:1.6rem; font-weight:400; margin-bottom:8px; transition: color 0.5s ease; }
  .proj-type{ color: var(--warm-gray); font-size:0.88rem; transition: color 0.5s ease; }
  .proj-loc{ color: var(--gold); font-size:0.78rem; letter-spacing:0.08em; text-transform:uppercase; margin-top:16px; display:block; }

  /* ===== INVESTOR ===== */
  .investor{
    background: var(--charcoal); color: var(--white); text-align:center;
  }
  .investor h2{ font-size: clamp(2rem,4vw,3.2rem); font-weight:300; max-width:800px; margin: 20px auto 26px; line-height:1.25; }
  .investor p{ color: rgba(255,255,255,0.6); max-width:560px; margin: 0 auto 46px; line-height:1.8; }
  .investor-contact{ color: var(--gold) !important; font-size:0.95rem; letter-spacing:0.08em; margin-top:-24px; margin-bottom:46px; }
  .investor-btns{ display:flex; gap:18px; justify-content:center; flex-wrap:wrap; }

  /* ===== FOOTER ===== */
  footer{ background: var(--white); padding: 80px 5vw 40px; }
  .footer-top{ display:flex; justify-content:space-between; align-items:flex-start; padding-bottom:60px; border-bottom:1px solid #eaeaea; flex-wrap:wrap; gap:40px;}
  .footer-logo{ font-family: var(--serif); font-size:1.6rem; display:flex; align-items:center; gap:12px; }
  .footer-logo span{ color: var(--gold); }
  .footer-logo-mark{ width:24px; height:31px; flex-shrink:0; display:block; }
  .footer-tag{ color: var(--warm-gray); font-size:0.95rem; margin-top:14px; max-width:280px; line-height:1.6; }
  .footer-links{ display:flex; gap:60px; flex-wrap:wrap; }
  .footer-col h5{ font-size:0.7rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--warm-gray); margin-bottom:18px; }
  .footer-col a{ display:block; font-size:0.92rem; margin-bottom:12px; color: var(--charcoal); }
  .footer-col a:hover{ color: var(--gold); }
  .footer-bottom{ padding-top:30px; display:flex; justify-content:space-between; color: var(--warm-gray); font-size:0.78rem; flex-wrap:wrap; gap:10px; }

  @media (max-width: 860px){
    .nav-links{ display:none; }
    .nav-toggle{ display:flex; }
    .about-grid, .intel-inner{ grid-template-columns: 1fr; gap:50px; }
    .purpose-grid{ grid-template-columns: repeat(2,1fr); }
    .purpose-item:nth-child(2){ border-right:none; }
    .values-grid{ grid-template-columns: repeat(2,1fr); }
    .phil-grid, .proj-grid{ grid-template-columns: 1fr; }
    section{ padding: 90px 6vw; }
    .footer-top{ flex-direction:column; }
  }

  @media (prefers-reduced-motion: reduce){
    *{ animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  }

  :focus-visible{ outline: 2px solid var(--gold); outline-offset: 3px; }
