/* Owner page styles - aligned with brand palette */

:root { --green:#0e4a3a; --ink:#111; --muted:#666; --cream:#f5efe6; }

.section-pad{ padding: clamp(2.5rem,5vw,4rem) 1.5rem; }
.container{ max-width: 1200px; margin: 0 auto; }
.center{ text-align: center; }
.h1{ font-family: 'Alliance', sans-serif; font-size: clamp(2rem,4.5vw,3rem); font-weight: 400; margin: 0 0 1.25rem; }
.h2{ font-family: 'Alliance', sans-serif; font-size: clamp(1.5rem,3.5vw,2.25rem); font-weight: 400; margin: 0 0 1rem; }

.btn-primary{ background: #2c5f41; color:#fff; border:0; padding:.875rem 1.5rem; display:inline-block; text-decoration:none; font-weight:600; }
.btn-primary:hover{ background: #000000; }
.btn-outline{ border:1px solid var(--green); color:var(--green); padding:.75rem 1.25rem; display:inline-block; text-decoration:none; font-weight:600; }
.btn-outline:hover{ background: #000000; color: #fff; border-color: #000000; }

/* Hero */
.owner-hero{ position:relative; min-height: 100vh; display:grid; place-items:center; color:#fff; }
.owner-hero__image{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter: saturate(.9) brightness(.8); z-index: 1; display:block; }
.owner-hero__overlay{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.45) 60%, rgba(0,0,0,.35) 100%); z-index: 2; }
.owner-hero__content{ position:relative; text-align:center; padding:0 1rem; max-width: 940px; z-index: 3; }
.owner-hero__eyebrow{ margin:0 0 .75rem; opacity:.9; }
.owner-hero__title{ font-family:'Alliance', sans-serif; font-size: clamp(2.25rem,6vw,4rem); font-weight:700; margin:.25rem 0 .5rem; }
.owner-hero__subtitle{ margin:0 0 1.25rem; font-weight:300; }
.owner-hero__cta{ background:#fff; color:var(--ink); border-radius:4px; text-decoration:none; padding:.875rem 1.25rem; font-weight:600; }

/* Intro */
.owner-intro__grid{ display:grid; grid-template-columns: 1fr 1.25fr; gap:2rem; align-items:center; }
.owner-video{ width:100%; height: clamp(220px,34vw,420px); object-fit:cover; }
.owner-intro .btn-outline{ margin-top:2rem; }

/* Features */
.feature{ display:grid; grid-template-columns: 1.2fr 1fr; gap:2rem; align-items:center; margin: 2.5rem 0; }
.feature img{ width:100%; height: clamp(260px,34vw,480px); object-fit:cover; display:block; }
.feature--image-right{ grid-template-columns: 1fr 1.2fr; }
.feature--image-right img{ order:2; }
.feature--image-right .feature__copy{ order:1; }
.feature__copy p{ color:#333; font-weight:300; margin-bottom:2rem; }

/* Cards */
.owner-cards{ background:#fff; }
.card-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap:1.25rem; margin-top:1.5rem; margin-bottom:3rem; }
.info-card{ background:#fff; border:1px solid rgba(0,0,0,.08); padding:1.5rem; box-shadow: 0 6px 24px rgba(0,0,0,.05); }
.info-card h3{ font-family:'Alliance', sans-serif; margin:.25rem 0 .5rem; font-size: 1.25rem; }
.info-card__icon{ width:40px; height:40px; display:grid; place-items:center; color:#333; }
.info-card__icon svg{ width:24px; height:24px; }

/* Steps */
.owner-steps{ background: var(--cream); }
.steps-image-container{ width:100%; }
.steps-image{ width:100%; height: clamp(300px,40vw,500px); object-fit:cover; display:block; }
.steps-content{ background: var(--cream); }
.steps-list{ display:grid; grid-template-columns: repeat(3, 1fr); gap:2rem; }
.step{ display:flex; flex-direction:column; gap:1rem; background:#fff; border:1px solid rgba(0,0,0,.08); padding:2rem; text-align:center; }
.step span{ color: var(--green); font-weight:700; font-size:1.5rem; }
.step h4{ margin:.5rem 0 .75rem; font-family:'Alliance', sans-serif; font-size:1.25rem; }
.step p{ margin:0; color:#666; font-weight:300; line-height:1.6; }

/* Property Form */
.owner-form{ background:#f8f9fa; }
.form-header{ text-align:center; margin-bottom:3rem; }
.form-intro{ max-width:600px; margin:0 auto; color:#666; font-weight:300; line-height:1.6; }

.property-form{ max-width:800px; margin:0 auto; }
.form-section{ background:#fff; border-radius:8px; padding:2rem; margin-bottom:2rem; box-shadow:0 2px 8px rgba(0,0,0,0.05); overflow:hidden; }
.form-section-title{ font-family:'Alliance', sans-serif; font-size:1.5rem; font-weight:400; margin:0 0 1.5rem 0; color:var(--ink); }

.form-grid{ display:grid; grid-template-columns:repeat(2, 1fr); gap:1.5rem; }
.form-group{ display:flex; flex-direction:column; }
.form-group label{ font-weight:600; color:var(--ink); margin-bottom:0.5rem; font-size:0.9rem; }
.form-group input, .form-group select, .form-group textarea{ 
    padding:0.75rem; 
    border:1px solid #ddd; 
    border-radius:4px; 
    font-size:1rem; 
    font-family:inherit; 
    transition:border-color 0.3s ease;
    background:#fff;
    width:100%;
    box-sizing:border-box;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus{ 
    outline:none; 
    border-color:var(--green); 
    box-shadow:0 0 0 2px rgba(14,74,58,0.1);
}

.form-note{ font-size:0.8rem; color:#666; margin-top:0.25rem; font-weight:300; }

/* Phone Input - FIXED VERSION */
.phone-input{ 
    display: flex; 
    gap: 0.5rem; 
    align-items: stretch;
}
.country-code{ 
    flex: 0 0 70px; 
    width: 70px; 
    min-width: 70px; 
    max-width: 70px;
    font-size: 0.9rem;
    padding: 0.5rem 0.25rem;
}
.phone-input input{ 
    flex: 1; 
    min-width: 0; 
    width: 100%;
}

/* Number Input with Unit */
.number-input{ position:relative; }
.number-input .unit{ position:absolute; right:0.75rem; top:50%; transform:translateY(-50%); color:#666; font-size:0.9rem; pointer-events:none; }
.number-input input{ padding-right:2.5rem; }

/* Radio Groups */
.radio-group{ margin-bottom:1.5rem; }
.radio-label{ display:block; font-weight:600; color:var(--ink); margin-bottom:0.75rem; font-size:0.9rem; }
.radio-options{ display:flex; gap:1rem; }
.radio-option{ display:flex; align-items:center; gap:0.5rem; cursor:pointer; }
.radio-option input[type="radio"]{ display:none; }
.radio-custom{ 
    width:18px; 
    height:18px; 
    border:2px solid #ddd; 
    border-radius:50%; 
    position:relative; 
    transition:all 0.3s ease;
}
.radio-option input[type="radio"]:checked + .radio-custom{ 
    border-color:var(--green); 
    background:var(--green);
}
.radio-option input[type="radio"]:checked + .radio-custom::after{ 
    content:''; 
    position:absolute; 
    top:50%; 
    left:50%; 
    transform:translate(-50%, -50%); 
    width:6px; 
    height:6px; 
    background:#fff; 
    border-radius:50%;
}

/* Form Submit */
.form-submit{ text-align:center; margin-top:2rem; }
.btn-submit{ 
    background:var(--green); 
    color:#fff; 
    border:none; 
    padding:1rem 2rem; 
    font-size:1rem; 
    font-weight:600; 
    border-radius:4px; 
    cursor:pointer; 
    transition:all 0.3s ease;
    min-width:200px;
}
.btn-submit:hover{ background:#0a3d2e; transform:translateY(-2px); }

@media (max-width: 1024px){
  .owner-intro__grid{ grid-template-columns:1fr; }
  .feature{ grid-template-columns:1fr; }
  .feature--image-right img{ order:0; }
  .feature--image-right .feature__copy{ order:0; }
  .steps-list{ grid-template-columns:1fr; }
  .card-grid{ grid-template-columns:1fr 1fr; }
  .form-grid{ grid-template-columns:1fr; }
  .radio-options{ flex-direction:column; gap:0.5rem; }
}

@media (max-width: 640px){
  .card-grid{ grid-template-columns:1fr; }
  .form-section{ padding:1rem; margin-bottom:1.5rem; }
  .form-grid{ gap:1rem; }
  .phone-input{ flex-direction:column; }
  .country-code{ min-width:auto; }
  .btn-submit{ width:100%; }
  .form-group input, .form-group select, .form-group textarea{ 
    padding:0.875rem; 
    font-size:16px; /* Prevents zoom on iOS */
    width:100%; 
    box-sizing:border-box;
  }
  .number-input input{ padding-right:3rem; }
  .number-input .unit{ right:1rem; }
  .form-note{ font-size:0.75rem; margin-top:0.5rem; }
  .form-section-title{ font-size:1.25rem; margin-bottom:1rem; }
}

@media (max-width: 480px){
  .owner-form{ padding:1rem; }
  .form-section{ padding:0.75rem; margin-bottom:1rem; }
  .form-grid{ gap:0.75rem; }
  .form-group input, .form-group select, .form-group textarea{ 
    padding:0.75rem; 
    font-size:16px;
  }
  .form-group label{ font-size:0.85rem; }
  .form-note{ font-size:0.7rem; }
  .form-section-title{ font-size:1.125rem; }
}