/*
Theme Name: Verdad Realty One-Pager
Theme URI: https://urbanspacegh.com
Author: Urban Space Digital Marketing Agency
Author URI: https://urbanspacegh.com
Description: Custom one-page WordPress theme for Verdad Realty — property listings, construction cleaning, and the Verdad Certified Artisan Program, editable via the WordPress Customizer.
Version: 1.0
License: Proprietary — built for Verdad Realty
Text Domain: verdad-onepager
*/


  :root{
    --ink:#14120D;
    --ink-soft:#221E16;
    --gold:#C8861A;
    --gold-light:#E3A83D;
    --sand:#EDE3D0;
    --sand-deep:#E1D3B6;
    --clay:#A54B33;
    --clay-deep:#84381F;
    --charcoal:#241F18;
    --cream:#FAF6EE;
    --line: rgba(20,18,13,0.12);
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Inter', sans-serif;
    color:var(--charcoal);
    background:var(--cream);
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3{font-family:'Archivo', sans-serif; letter-spacing:-0.01em;}
  .eyebrow{
    font-family:'IBM Plex Mono', monospace;
    font-size:0.72rem;
    letter-spacing:0.14em;
    text-transform:uppercase;
    font-weight:500;
  }
  a{color:inherit;}
  img{max-width:100%; display:block;}
  button{font-family:inherit; cursor:pointer;}
  :focus-visible{outline:3px solid var(--gold); outline-offset:3px;}

  .wrap{max-width:1120px; margin:0 auto; padding:0 24px;}

  /* ---------- NAV ---------- */
  header.nav{
    position:sticky; top:0; z-index:50;
    background:rgba(20,18,13,0.92);
    backdrop-filter:blur(6px);
    border-bottom:1px solid rgba(200,134,26,0.25);
  }
  .nav-inner{
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 24px;
    max-width:1120px; margin:0 auto;
  }
  .brand{display:flex; align-items:center; gap:10px;}
  .brand img{height:36px; width:auto;}
  .brand-text{color:var(--cream); font-family:'Archivo'; font-weight:900; font-size:1.05rem; letter-spacing:0.02em;}
  .brand-text span{display:block; font-family:'IBM Plex Mono'; font-weight:500; font-size:0.6rem; letter-spacing:0.1em; color:var(--gold-light); text-transform:uppercase; margin-top:1px;}

  .nav-menu-wrap{flex:1; display:flex; justify-content:center;}
  .nav-menu{list-style:none; display:flex; gap:28px; margin:0; padding:0;}
  .nav-menu li a{
    color:rgba(250,246,238,0.82);
    font-family:'IBM Plex Mono'; font-size:0.78rem; font-weight:500;
    letter-spacing:0.05em; text-transform:uppercase;
    text-decoration:none; transition:color .15s ease;
  }
  .nav-menu li a:hover{color:var(--gold-light);}
  @media (max-width:820px){ .nav-menu-wrap{display:none;} }

  .nav-cta{
    display:inline-flex; align-items:center; gap:8px;
    background:var(--gold); color:var(--ink);
    font-family:'IBM Plex Mono'; font-size:0.75rem; font-weight:500;
    letter-spacing:0.06em; text-transform:uppercase;
    padding:10px 16px; border-radius:2px; text-decoration:none;
    transition:background .15s ease;
    flex-shrink:0;
  }
  .nav-cta:hover{background:var(--gold-light);}

  /* ---------- SKYLINE DIVIDER ---------- */
  .skyline{
    display:flex; align-items:flex-end; gap:3px;
    height:26px; overflow:hidden;
  }
  .skyline i{
    display:block; width:5px; background:var(--gold); flex-shrink:0; opacity:0.85;
  }
  .skyline.on-dark i{background:var(--gold);}
  .skyline.on-light i{background:var(--clay);}

  /* ---------- HERO SLIDER ---------- */
  .hero-wrap{background:var(--ink);}
  .hero-kicker{padding:22px 24px 0;}
  .hero-kicker .eyebrow{color:var(--gold-light);}

  .hero-slider{
    position:relative;
    min-height:600px;
    overflow:hidden;
  }
  @media (max-width:700px){ .hero-slider{ min-height:560px; } }

  .hero-slide{
    position:absolute; inset:0;
    display:flex; align-items:center;
    opacity:0; visibility:hidden; z-index:1;
    transition:opacity .9s ease;
  }
  .hero-slide.active{opacity:1; visibility:visible; z-index:2;}

  .slide-bg{
    position:absolute; inset:0;
    background-size:cover; background-position:center;
    z-index:0;
  }
  .slide-overlay{position:absolute; inset:0; z-index:1; pointer-events:none;}
  .overlay-photo{background:linear-gradient(100deg, rgba(20,18,13,0.86) 0%, rgba(20,18,13,0.55) 55%, rgba(20,18,13,0.35) 100%);}
  .overlay-gold{background:
      radial-gradient(circle at 82% 15%, rgba(200,134,26,0.22), transparent 45%),
      radial-gradient(circle at 10% 85%, rgba(165,75,51,0.16), transparent 50%),
      var(--ink);}
  .overlay-clay{background:
      radial-gradient(circle at 15% 20%, rgba(165,75,51,0.28), transparent 50%),
      radial-gradient(circle at 85% 80%, rgba(200,134,26,0.18), transparent 50%),
      var(--ink);}
  .overlay-full-clay{background:linear-gradient(150deg, var(--clay) 0%, var(--clay-deep) 65%, var(--ink) 100%);}

  .hero-slide .hero-inner{position:relative; z-index:2; padding:64px 24px;}
  .hero-slide h1{
    font-size:clamp(2.2rem, 5.6vw, 3.9rem);
    font-weight:900; color:var(--cream);
    line-height:1.04;
    max-width:14ch;
  }
  .hero-sub{
    margin-top:20px;
    font-size:1.05rem;
    color:rgba(250,246,238,0.82);
    max-width:44ch;
  }
  .hero-ctas{margin-top:32px; display:flex; gap:14px; flex-wrap:wrap;}

  .hero-arrow{
    position:absolute; top:50%; transform:translateY(-50%); z-index:5;
    width:44px; height:44px; border-radius:50%;
    background:rgba(20,18,13,0.45); border:1px solid rgba(250,246,238,0.32);
    color:var(--cream); font-size:1.4rem; line-height:1;
    display:flex; align-items:center; justify-content:center;
    transition:background .15s ease, border-color .15s ease;
  }
  .hero-arrow:hover{background:rgba(200,134,26,0.5); border-color:var(--gold-light);}
  .hero-arrow.prev{left:16px;}
  .hero-arrow.next{right:16px;}
  @media (max-width:600px){ .hero-arrow{width:36px; height:36px; font-size:1.2rem;} }

  .hero-nav-dots{
    position:absolute; bottom:22px; left:50%; transform:translateX(-50%);
    z-index:5; display:flex; gap:10px;
  }
  .hero-dot{
    width:10px; height:10px; border-radius:50%;
    background:rgba(250,246,238,0.35); border:none; padding:0;
    transition:background .15s ease, transform .15s ease;
  }
  .hero-dot.active{background:var(--gold); transform:scale(1.15);}
  .btn{
    display:inline-flex; align-items:center; gap:8px;
    padding:14px 22px; border-radius:2px;
    font-family:'IBM Plex Mono'; font-size:0.78rem; font-weight:500;
    letter-spacing:0.05em; text-transform:uppercase;
    text-decoration:none; border:1px solid transparent;
    transition:transform .15s ease, background .15s ease, border-color .15s ease;
  }
  .btn:hover{transform:translateY(-1px);}
  .btn-gold{background:var(--gold); color:var(--ink);}
  .btn-gold:hover{background:var(--gold-light);}
  .btn-outline{border-color:rgba(250,246,238,0.4); color:var(--cream);}
  .btn-outline:hover{border-color:var(--gold-light); color:var(--gold-light);}
  .btn-clay{background:var(--clay); color:var(--cream);}
  .btn-clay:hover{background:var(--clay-deep);}

  /* ---------- SECTION SHELL ---------- */
  section.block{padding:76px 0;}
  .block-head{max-width:56ch; margin-bottom:44px;}
  .block-head .eyebrow{color:var(--clay); margin-bottom:14px;}
  .on-dark .block-head .eyebrow{color:var(--gold-light);}
  .block-head h2{font-size:clamp(1.7rem, 3.6vw, 2.5rem); font-weight:800; line-height:1.08;}
  .block-head p{margin-top:16px; font-size:1.02rem; color:rgba(36,31,24,0.72);}
  .on-dark .block-head p{color:rgba(250,246,238,0.72);}

  .grid-2{display:grid; grid-template-columns:1.05fr 0.95fr; gap:48px; align-items:start;}
  @media (max-width:860px){.grid-2{grid-template-columns:1fr;}}

  /* feature list */
  .feature-list{list-style:none; margin-top:28px; display:flex; flex-direction:column; gap:16px;}
  .feature-list li{display:flex; gap:14px; align-items:flex-start;}
  .feature-list .num{
    font-family:'IBM Plex Mono'; font-weight:500; font-size:0.75rem;
    color:var(--gold); border:1px solid var(--gold); border-radius:50%;
    width:26px; height:26px; flex-shrink:0; display:flex; align-items:center; justify-content:center;
    margin-top:2px;
  }
  .on-light .feature-list .num{color:var(--clay); border-color:var(--clay);}
  .feature-list strong{display:block; font-size:0.98rem;}
  .feature-list span{font-size:0.9rem; color:rgba(36,31,24,0.65);}
  .on-dark .feature-list span{color:rgba(250,246,238,0.65);}

  /* ---------- FORM CARD ---------- */
  .form-card{
    background:var(--cream);
    border:1px solid var(--line);
    padding:32px;
    border-radius:2px;
  }
  .on-dark .form-card{background:var(--ink-soft); border-color:rgba(250,246,238,0.14);}
  .form-card h3{font-size:1.15rem; font-weight:700; margin-bottom:6px;}
  .on-dark .form-card h3{color:var(--cream);}
  .form-card .form-note{font-size:0.88rem; color:rgba(36,31,24,0.6); margin-bottom:20px;}
  .on-dark .form-card .form-note{color:rgba(250,246,238,0.55);}
  .field{margin-bottom:16px;}
  .field label{
    display:block; font-family:'IBM Plex Mono'; font-size:0.68rem;
    letter-spacing:0.08em; text-transform:uppercase; margin-bottom:7px;
    color:rgba(36,31,24,0.55);
  }
  .on-dark .field label{color:rgba(250,246,238,0.55);}
  .field input, .field select, .field textarea{
    width:100%; padding:11px 12px; font-family:'Inter'; font-size:0.94rem;
    border:1px solid var(--line); border-radius:2px; background:#fff; color:var(--charcoal);
  }
  .on-dark .field input, .on-dark .field select, .on-dark .field textarea{
    background:rgba(250,246,238,0.06); border-color:rgba(250,246,238,0.18); color:var(--cream);
  }
  .field input::placeholder, .field textarea::placeholder{color:rgba(36,31,24,0.35);}
  .on-dark .field input::placeholder, .on-dark .field textarea::placeholder{color:rgba(250,246,238,0.32);}
  .field-row{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
  @media (max-width:520px){.field-row{grid-template-columns:1fr;}}
  .form-status{
    margin-top:14px; font-size:0.88rem; font-family:'IBM Plex Mono';
    display:none; padding:10px 12px; border-radius:2px;
  }
  .form-status.show{display:block;}
  .on-light .form-status{background:rgba(165,75,51,0.08); color:var(--clay-deep); border:1px solid rgba(165,75,51,0.25);}
  .on-dark .form-status{background:rgba(200,134,26,0.14); color:var(--gold-light); border:1px solid rgba(200,134,26,0.35);}

  /* section-specific backgrounds */
  .on-light{background:var(--sand);}
  .on-dark{background:var(--ink); color:var(--cream);}
  .on-clay{background:linear-gradient(160deg, var(--clay) 0%, var(--clay-deep) 100%); color:var(--cream);}
  .on-clay .block-head .eyebrow{color:rgba(250,246,238,0.85);}
  .on-clay .block-head p{color:rgba(250,246,238,0.82);}
  .on-clay .form-card{background:rgba(20,18,13,0.22); border-color:rgba(250,246,238,0.22);}
  .on-clay .form-card h3{color:var(--cream);}
  .on-clay .field label{color:rgba(250,246,238,0.7);}
  .on-clay .field input, .on-clay .field select, .on-clay .field textarea{
    background:rgba(250,246,238,0.1); border-color:rgba(250,246,238,0.28); color:var(--cream);
  }
  .on-clay .feature-list .num{color:var(--gold-light); border-color:var(--gold-light);}
  .on-clay .feature-list span{color:rgba(250,246,238,0.78);}
  .on-clay .form-status{background:rgba(20,18,13,0.3); color:var(--cream); border:1px solid rgba(250,246,238,0.3);}

  .tag-row{display:flex; flex-wrap:wrap; gap:8px; margin-top:22px;}
  .tag{
    font-family:'IBM Plex Mono'; font-size:0.72rem; letter-spacing:0.04em;
    padding:6px 12px; border:1px solid rgba(250,246,238,0.35); border-radius:99px;
    color:rgba(250,246,238,0.85);
  }
  .on-light .tag{border-color:rgba(36,31,24,0.25); color:rgba(36,31,24,0.75);}

  /* ---------- FOOTER ---------- */
  footer{background:var(--ink); color:rgba(250,246,238,0.65); padding:44px 0 28px;}
  .footer-inner{display:flex; flex-wrap:wrap; justify-content:space-between; gap:24px; align-items:flex-start;}
  .footer-brand{display:flex; align-items:center; gap:10px;}
  .footer-brand img{height:30px;}
  .footer-brand span{font-family:'Archivo'; font-weight:800; color:var(--cream);}
  .footer-tagline{font-family:'IBM Plex Mono'; font-size:0.72rem; letter-spacing:0.06em; color:var(--gold-light); margin-top:6px;}
  .footer-links{display:flex; gap:28px; flex-wrap:wrap; font-size:0.88rem;}
  .footer-links a{text-decoration:none; color:rgba(250,246,238,0.75);}
  .footer-links a:hover{color:var(--gold-light);}
  .footer-bottom{
    margin-top:32px; padding-top:20px; border-top:1px solid rgba(250,246,238,0.12);
    font-size:0.78rem; color:rgba(250,246,238,0.4);
  }

  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    .hero-slide{transition:none;}
    .btn:hover{transform:none;}
  }
