/* ══════════════════════════════════════════════════════════════
   Brokerage. Sits under Management alongside Space for Lease.

   Hero is two tone: a solid block left, image right, hard seam
   with a gold hairline. Nothing sits on the photograph, so both
   halves stay legible. No other page uses this arrangement.
   ══════════════════════════════════════════════════════════════ */

/* Background classes. homepage.css does not define these, so a section
   carrying on-ivory or on-stone silently falls through to the body colour
   and the whole page reads as one flat field. Every page sheet declares
   its own set. The ghost and eyebrow variables ride along, so buttons and
   eyebrows invert correctly on the dark sections. */
.on-green{background:var(--green);color:var(--ivory);
  --ghost:var(--ivory);--ghost-hb:var(--ivory);--ghost-hf:var(--green-deep);
  --alink-c:var(--brand-accent);--eyb-c:var(--brand-accent)}
.on-deep{background:var(--green-deep);color:var(--ivory);
  --ghost:var(--ivory);--ghost-hb:var(--ivory);--ghost-hf:var(--green-deep);
  --alink-c:var(--brand-accent);--eyb-c:var(--brand-accent)}
.on-ivory{background:var(--ivory)}
.on-stone{background:var(--stone)}
.on-white{background:#fff}

/* Shared bits every page stylesheet declares for itself. homepage.css loads
   sitewide and supplies the tokens, but not the placeholder system, and its
   section padding has to be neutralised on heroes that sit under the fixed
   navigation. */
.ph{position:relative;background:repeating-linear-gradient(45deg,rgba(31,91,71,.10) 0 14px,rgba(31,91,71,.03) 14px 28px);
  display:flex;align-items:center;justify-content:center;text-align:center;padding:20px}
.ph span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:#7A6224;
  line-height:1.7;background:rgba(242,239,230,.86);border:1px dashed rgba(201,162,74,.75);padding:11px 15px}
img.ph{display:block;width:100%;height:100%;object-fit:cover;padding:0;background:none;border:0}
.ph.dark{background:repeating-linear-gradient(45deg,#20463a 0 14px,#1c4034 14px 28px)}
.ph.dark span{color:var(--brand-accent);background:rgba(23,63,50,.8)}

/* ══ 01 HERO ══ */
.bhero{padding:0;display:grid;grid-template-columns:1.05fr .95fr;min-height:clamp(480px,64vh,680px)}
.bhero-copy{background:var(--green-deep);display:flex;align-items:center;
  padding:calc(var(--nav-h) + 72px) clamp(36px,5vw,84px) 78px
          max(var(--pad),calc((100vw - 1280px) / 2 + var(--pad)))}
.bhero h1{font-size:clamp(32px,3.9vw,52px);color:var(--ivory);max-width:15ch;margin-top:18px}
.bhero .eyebrow{color:var(--brand-accent)}
.bhero .dek{font-size:17px;color:rgba(242,239,230,.84);max-width:42ch;margin-top:20px}
.bhero-scope{display:flex;flex-wrap:wrap;margin-top:32px;padding-top:20px;
  border-top:1px solid rgba(242,239,230,.26)}
.bhero-scope span{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;
  color:rgba(242,239,230,.68);padding-right:22px}
.bhero-scope span + span{padding-left:22px;border-left:1px solid rgba(242,239,230,.26)}
.bhero-media{position:relative;overflow:hidden;border-left:1px solid var(--brand-accent)}
.bhero-media .ph{position:absolute;inset:0}

/* ══ 02 WHO ══ */
.who{padding:96px 0}
.who-head h2{font-size:clamp(26px,3vw,40px);color:var(--green);max-width:22ch;margin-top:16px}
.who-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:52px;
  border-top:1px solid rgba(31,91,71,.22)}
.who-cell{padding:34px 32px 34px 0}
.who-cell + .who-cell{padding-left:32px;border-left:1px solid rgba(31,91,71,.22)}
.who-cell h3{font-size:21px;color:var(--green)}
.who-cell p{font-size:15px;color:var(--muted);margin-top:14px}

/* ══ 03 EDGE ══ */
.edge{padding:96px 0}
.edge-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:64px;align-items:center}
.edge-media{position:relative;aspect-ratio:4/5;overflow:hidden}
.edge-media .ph{position:absolute;inset:0}
.edge h2{font-size:clamp(24px,2.8vw,36px);color:var(--green);max-width:20ch;margin-top:16px}
.edge p{font-size:16px;color:var(--muted);max-width:52ch;margin-top:18px}

/* ══ 04 TYPES ══ */
.types{padding:88px 0}
.types h2{font-size:clamp(22px,2.4vw,32px);color:var(--ivory);max-width:22ch;margin-top:14px}
.types .eyebrow{color:var(--brand-accent)}
.tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:44px;
  background:rgba(242,239,230,.22);border:1px solid rgba(242,239,230,.22)}
.tcell{background:var(--green-deep);padding:28px 26px}
.tcell h3{font-size:17px;color:var(--ivory)}
.tcell p{font-size:14px;color:rgba(242,239,230,.72);margin-top:8px}

/* ══ 05 PROCESS ══ */
.proc{padding:96px 0}
.proc-head h2{font-size:clamp(26px,3vw,40px);color:var(--green);max-width:20ch;margin-top:16px}
.proc-list{list-style:none;margin:52px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);
  gap:0;border-top:1px solid rgba(31,91,71,.22);border-left:1px solid rgba(31,91,71,.22)}
.proc-list li{padding:34px 34px 38px;border-right:1px solid rgba(31,91,71,.22);
  border-bottom:1px solid rgba(31,91,71,.22)}
.proc-list .n{font-family:var(--font-display);font-size:15px;color:var(--brand-accent);
  display:block;letter-spacing:.06em}
.proc-list h3{font-size:20px;color:var(--green);margin-top:12px;max-width:22ch}
.proc-list p{font-size:15px;color:var(--muted);margin-top:12px;max-width:44ch}

/* ══ 06 ASK ══ */
.ask{padding:96px 0}
/* The form is a GoHighLevel iframe, and an iframe reports its own width rather
   than the viewport. A two column GoHighLevel layout collapses below roughly
   640px of container width, so an even split gave the form 518px and it always
   rendered as one column. At 0.7 and 1.3 the form column is about 685px, which
   clears the threshold with room to spare. */
.ask-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:0;border:1px solid rgba(31,91,71,.2);
  background:#fff;padding:34px}
.ask-copy{padding:20px 30px 20px 20px;display:flex;flex-direction:column;justify-content:center}
.ask-copy h2{font-size:clamp(23px,2.5vw,32px);color:var(--green);max-width:18ch;margin-top:14px}
.ask-copy p{font-size:16px;color:var(--muted);margin-top:16px;max-width:42ch}
.ask-call{margin-top:26px;padding-top:22px;border-top:1px solid rgba(31,91,71,.2)}
.ask-call a{display:block;font-family:var(--font-display);font-size:24px;color:var(--green)}
.ask-call span{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--quiet);margin-top:7px}
.ask-form{padding:20px}
.ask-form .f2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.ask-form .field{margin-bottom:14px}
.ask-form .field.full{grid-column:1 / -1}
.ask-form label{display:block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:700;color:var(--quiet);margin-bottom:6px}
.ask-form input,.ask-form select,.ask-form textarea{width:100%;font-family:var(--font-body);
  font-size:15px;color:var(--ink);background:#fff;border:1px solid rgba(31,91,71,.3);
  padding:12px 13px;border-radius:0;transition:border-color .3s var(--ease)}
.ask-form input:focus,.ask-form select:focus,.ask-form textarea:focus{outline:0;border-color:var(--brand-accent)}
.ask-form textarea{resize:vertical;min-height:84px}
.ask-form .hp{position:absolute;left:-9999px}
.ask-form .submit{width:100%;text-align:center;border:0;cursor:pointer;margin-top:2px;
  font-family:var(--font-body)}
.ask-form .fine{font-size:11px;color:var(--quiet);margin-top:11px;line-height:1.6}

/* ══ 07 CLOSE ══ */
.bclose{padding:0;position:relative;height:clamp(300px,32vw,420px);overflow:hidden;background:var(--green-deep)}
.bclose img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bclose::after{content:"";position:absolute;inset:0;background:rgba(23,63,50,.58)}
.bclose-over{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;
  justify-content:center;text-align:center;padding:0 var(--pad)}
.bclose-over h2{font-size:clamp(24px,3vw,40px);color:var(--ivory);max-width:22ch;margin-top:14px}
.bclose-over .eyebrow{color:var(--brand-accent)}
.bclose-over .btns{justify-content:center}
.bclose-over .btn-ghost{color:var(--ivory)}
.bclose-over .btn-ghost:hover{background:var(--ivory);color:var(--green-deep)}

@media(max-width:1024px){
  .bhero{grid-template-columns:1fr;min-height:0}
  .bhero-copy{padding:calc(var(--nav-h) + 52px) var(--pad) 56px}
  .bhero-media{min-height:340px;border-left:0;border-top:1px solid var(--brand-accent)}
  .who-grid,.tgrid{grid-template-columns:1fr}
  .who-cell{padding:26px 0}
  .who-cell + .who-cell{padding-left:0;border-left:0;padding-top:26px;
    border-top:1px solid rgba(31,91,71,.22)}
  .edge-grid,.ask-grid{grid-template-columns:1fr;gap:40px}
  .edge-media{aspect-ratio:16/10}
  .ask-copy{padding:20px}
  .proc-list{grid-template-columns:1fr}
  .who,.edge,.proc,.ask{padding:72px 0}
}
@media(max-width:640px){
  .ask-form .f2{grid-template-columns:1fr}
  .proc-list li{padding:28px var(--pad) 32px}
}

/* GoHighLevel embed. */
.ghl-form{margin-top:18px;background:#fff;border:1px solid rgba(31,91,71,.2);padding:6px}
.ghl-form iframe{display:block;width:100%;border:0}