/* Airdrie 449: "your own front door and back yard".
   Deep plum for type, soft blush and a garden green beside it, on a blush-white page. Rounded, homey shapes
   (arched doorways, pebbles, soft panels) and fine plum line drawings of the fence, garden and front door.
   Fraunces (soft optical styles) for headlines, its italic for the friendly "voice" (drawing notes, the bird);
   Figtree for reading, buttons and every figure, in real bold so numbers stay crisp and line up.
   New pieces (journey rail, the chickadee, drawings, life-at-home) live in story.css. */
:root{
  --bg:#FFF8F5;
  --surface:#FFFFFF;
  --surface-2:#FBEBE6;
  --ink:#33142C;
  --muted:#6B5263;
  --line:#F0DDD7;
  --line-strong:#DCC3BC;
  --brand:#33142C;
  --on-brand:#FFF6F2;
  --on-brand-muted:#E3CBD8;
  --accent:#F1C3B8;
  --accent-ink:#33142C;
  --accent-soft:#FBE4DE;
  --signal:#74295F;
  --cta:#74295F;
  --on-cta:#FFFFFF;
  --cta-hover:#5C1F4B;
  --cta-shadow:rgba(116,41,95,.36);
  --cta-text:#74295F;
  --bar:#E8D3CD;
  --tick-bg:#F6D8D0;
  --hot:rgba(241,195,184,.5);
  --ok-bg:#F5E3EC;
  --ok-ink:#5C1F4B;
  --focus:#74295F;
  --garden:#5E7D55;
  --garden-soft:#E4ECDB;
  --garden-ink:#3D5A37;
  --radius-md:14px;
  --radius-lg:22px;
  --radius-xl:32px;
  --shadow-sm:0 1px 2px rgba(51,20,44,.05);
  --shadow-md:0 16px 36px -18px rgba(51,20,44,.28);
  --shadow-lg:0 34px 70px -30px rgba(51,20,44,.42);
  --font-display:'Fraunces',Georgia,'Times New Roman',serif;
  --font-body:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;
  --display-weight:500;
  --display-tracking:-.018em;
}

/* ---------- Type ---------- */
body{font-size:17px;line-height:1.62}
h1,h2,h3{font-optical-sizing:auto}
.hero h1{font-size:clamp(46px,5.2vw,72px);line-height:.98;letter-spacing:-.028em;font-weight:500;max-width:11ch}
.section-head h2{font-size:clamp(34px,3.9vw,52px);line-height:1.04;letter-spacing:-.024em}
.section-head p{font-size:clamp(16px,1.3vw,18.5px)}
.card h3,.freehold h3{font-size:clamp(22px,2vw,26px);line-height:1.15}
.note{font-size:13px}

/* ---------- Header ---------- */
.header{background:color-mix(in srgb,var(--bg) 88%,transparent);border-bottom-color:transparent}
.header.is-scrolled{border-bottom-color:var(--line);box-shadow:0 10px 30px -24px rgba(51,20,44,.5)}
.brand{font-family:var(--font-display);font-weight:600;font-size:21px;letter-spacing:-.015em}
.brand-mark{border-radius:9px}

/* ---------- Buttons ---------- */
.btn{font-weight:700;letter-spacing:.005em}
.btn-primary,.btn.lime{box-shadow:0 14px 28px -14px var(--cta-shadow)}
.btn-outline,.btn.white{border-color:var(--line-strong);background:color-mix(in srgb,var(--surface) 70%,transparent)}
.btn-outline:hover,.btn.white:hover{border-color:var(--ink);background:var(--surface)}
.text-link{text-decoration-color:var(--accent);text-decoration-thickness:2px}

/* ---------- Hero ---------- */
.hero{padding-block:clamp(24px,3.4vw,44px) 0;overflow:visible}
.hero-grid{grid-template-columns:1fr 1.02fr;gap:clamp(28px,4vw,64px);align-items:center}
.chips{margin-bottom:20px}
.chip{border-color:var(--line-strong);background:transparent;font-weight:600}
.chip.solid{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.hero-sub{margin-top:18px;max-width:44ch;font-size:clamp(17px,1.45vw,19px)}
.offer{display:grid;grid-template-columns:auto 1fr;gap:6px 26px;align-items:center;margin-top:24px;padding:16px 22px 14px;border-radius:26px 26px 26px 10px;background:var(--surface-2);max-width:520px}
.offer-main{display:grid;grid-template-columns:auto auto;justify-content:start;align-items:baseline;column-gap:8px}
.offer-label{grid-column:1/-1;font-size:13.5px;font-weight:600;color:var(--muted)}
.offer-main strong{font-family:var(--font-display);font-size:clamp(50px,5vw,64px);font-weight:600;line-height:.95;letter-spacing:-.035em;color:var(--cta);font-variant-numeric:lining-nums}
.offer-gst{font-size:15px;font-weight:700;color:var(--ink)}
.offer-rows{display:grid;gap:4px;margin:0;padding-left:22px;border-left:1.5px dashed var(--line-strong)}
.offer-rows div{display:flex;justify-content:space-between;align-items:baseline;gap:14px}
.offer-rows dt{font-size:14px;font-weight:600;color:var(--muted)}
.offer-rows dd{margin:0;font-size:18px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
.offer-note{grid-column:1/-1;margin-top:6px;font-size:12.5px;line-height:1.5;color:var(--muted)}
.spots{grid-column:1/-1;margin-top:6px}
.spots-dots{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.spots-dots i{height:8px;border-radius:4px;background:var(--cta)}
.spots-dots i.taken{background:var(--line-strong)}
.spots p{margin-top:8px;font-size:13px;font-weight:700;color:var(--ink)}
.hero-actions{margin-top:24px}
.hero-alt{margin-top:14px}

/* ---------- Facts: standing on the fence's ground line ---------- */
.facts{position:relative;z-index:1;background:var(--surface);border-top:1.6px solid var(--ink);border-bottom:0}
.facts-row div{border-left:0;padding:22px 16px 26px;position:relative}
.facts-row div + div::before{content:"";position:absolute;left:0;top:26px;bottom:30px;border-left:1.5px dotted var(--line-strong)}
.facts-row strong{font-family:var(--font-body);font-weight:800;font-size:clamp(24px,2.5vw,32px);letter-spacing:-.025em;color:var(--ink)}
.facts-row span{font-weight:500;font-size:13.5px}

/* ---------- Sections as soft, rounded rooms ---------- */
.section.tint,.section.tint-white,.section.tint-green{margin-inline:clamp(8px,1.6vw,22px);border-radius:clamp(28px,4.4vw,60px)}
.section.tint{background:var(--surface-2)}
.section.tint-white{background:var(--surface);box-shadow:0 0 0 1px var(--line)}
.section.tint-green{background:var(--garden-soft)}
.section-head{max-width:720px}
/* Journey stop marker: a little house-number plaque */
.stop{display:inline-flex;align-items:center;gap:10px;margin-bottom:16px;font-size:15px;font-weight:700;color:var(--ink)}
.stop-n{display:inline-grid;place-items:center;width:32px;height:34px;border-radius:9px 9px 7px 7px;border:1.6px solid var(--ink);background:var(--surface);font-family:var(--font-display);font-size:18px;font-weight:600;line-height:1;box-shadow:2px 2px 0 var(--accent)}

/* ---------- Gallery and plans ---------- */
.gallery{gap:14px}
.gallery a{border-radius:18px}
.gallery a:nth-child(9),.gallery a:nth-child(11),.gallery a:nth-child(12){grid-column:span 2}
.gallery span{background:rgba(255,255,255,.94);color:var(--ink);font-weight:600}
.plans{gap:22px;margin-top:28px}
.fp-box{border-color:var(--line);border-radius:26px}
.fp-tab[aria-selected="true"]{color:var(--ink)}
.fp-hint{background:var(--accent-soft);color:var(--ink)}
.showing{background:var(--garden-soft);color:var(--ink);border-radius:26px}
.showing h3{font-size:clamp(26px,2.5vw,32px)}
.showing p{color:var(--muted)}
.showing li::before{background-color:var(--surface)}
.showing-photo{border-radius:0 0 999px 999px / 0 0 60px 60px}
.showing .btn-primary{background:var(--cta);color:var(--on-cta)}
.showing .btn-primary:hover{background:var(--cta-hover)}

/* ---------- Neighbourhood: drive times as stops along one road ---------- */
.loc-map{border-radius:var(--radius-xl);border:0;box-shadow:var(--shadow-md)}
.loc-ring{border-color:var(--cta);background:radial-gradient(circle,rgba(241,195,184,.45),transparent 70%)}
.loc-ring span{background:var(--ink);color:var(--bg)}
.loc-split{align-items:start}
.reasons li{border-top-color:var(--line)}
.reasons strong{font-family:var(--font-display);font-weight:500;font-size:20px}
.tiles{position:relative;grid-template-columns:repeat(5,1fr);gap:0;margin-top:56px}
.tiles::before{content:"";position:absolute;left:10%;right:10%;top:7px;border-top:2px dashed var(--line-strong)}
.tiles div{position:relative;padding:30px 8px 0;background:none;border:0;border-radius:0}
.tiles div::before{content:"";position:absolute;left:50%;top:0;width:16px;height:16px;margin-left:-8px;border-radius:50%;background:var(--bg);border:2.5px solid var(--cta)}
.tiles div:last-child::before{background:var(--cta)}
.tiles strong{font-family:var(--font-body);font-weight:800;font-size:28px;letter-spacing:-.025em}
@media (hover:hover){.tiles div:hover{transform:none;box-shadow:none}}

/* ---------- Compare + freehold ---------- */
.compare{grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,56px)}
.compare .card{background:var(--bg);border-color:var(--line);border-radius:28px}
.bar{background:var(--surface-2);height:16px}
.bar i{background:var(--bar)}
.bar-row.you .bar i{background:var(--cta)}
.bar-label b{color:var(--ink)}
.gap-callout{border-radius:20px 20px 20px 6px;background:var(--accent-soft)}
.gap-callout strong{color:var(--cta);white-space:nowrap}
.freehold > p{margin-top:10px;color:var(--muted)}
.offer-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:22px 0 0}
.offer-points div{padding:4px 16px;border-left:1.5px dotted var(--line-strong)}
.offer-points div:first-child{padding-left:0;border-left:0}
.offer-points strong{display:block;font-size:24px;font-weight:800;letter-spacing:-.025em;color:var(--ink)}
.offer-points span{display:block;font-size:13px;color:var(--muted);font-weight:500;line-height:1.35}
.callout{border-radius:18px;background:var(--accent-soft)}

/* ---------- Your numbers ---------- */
.ptab{border-radius:120px 120px 22px 22px / 60px 60px 22px 22px;padding:30px 28px 22px;background:var(--bg);border-color:var(--line-strong)}
.ptab[aria-selected="true"]{background:var(--surface);border-color:var(--cta);box-shadow:var(--shadow-md)}
.path-tag{font-family:var(--font-display);font-size:23px;font-weight:500;letter-spacing:-.01em;text-transform:none;color:var(--ink);margin-bottom:12px}
.prow{border-top-color:var(--line)}
.ptab em{color:var(--cta)}
.panel-title{font-size:clamp(28px,3vw,38px)}
.money .card{border-radius:24px}
.label,.result-label{text-transform:none;letter-spacing:0;font-size:14px;font-weight:600;color:var(--muted)}
.big{font-family:var(--font-body);font-weight:800;letter-spacing:-.035em;color:var(--ink)}
.big-unit{font-size:.4em;letter-spacing:0;font-weight:600;color:var(--muted)}
.line-item strong{font-weight:800}
.allin{border-radius:18px}
.hold-title{margin-top:8px}
.hold-sub{margin-top:8px}
.roi-tile{border-radius:18px}
.growth-toggle button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink)}
.calc input{border-radius:14px}
.result{border-radius:18px}
details.more{border-radius:18px}
.more-body .small-print:only-child{margin:0}

/* ---------- Reserve ---------- */
.sp-wrap{border-color:transparent;border-radius:26px;box-shadow:var(--shadow-sm)}
.sp-chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink)}
.sp-detail{border-radius:18px}
.sp-facts span{text-transform:none;letter-spacing:0;font-size:12px}
.closeout-badge{letter-spacing:0;font-size:12px;background:var(--accent-soft)}
.sp-table-wrap{background:var(--surface);border-color:transparent;border-radius:18px}
.sp-table th{text-transform:none;letter-spacing:0;font-size:12.5px;background:var(--surface-2)}
.status-pill{text-transform:none;letter-spacing:0;font-size:12px;font-weight:700}
.reserve-form{border-radius:28px;top:96px}
.reserve-form h3{font-size:28px}
.reserve-form .btn-primary,.final-card .btn-primary,.thanks-card .btn-primary{background:var(--accent);color:var(--accent-ink);box-shadow:0 14px 30px -14px rgba(241,195,184,.7)}
.reserve-form .btn-primary:hover,.thanks-card .btn-primary:hover{background:#F6D3CA}
.reserve-form input[type=file]::file-selector-button{background:var(--cta)}

/* ---------- FAQ ---------- */
.faq-group h3{font-size:24px}
.faq-list summary{font-weight:600;font-size:17px;align-items:center}
.faq-list summary::after{content:"";width:28px;height:28px;border-radius:50%;background:var(--surface-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 5v10M5 10h10' stroke='%2333142C' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center/16px no-repeat;transition:transform .25s ease,background-color .25s ease}
.faq-list details[open] summary::after{content:"";transform:rotate(45deg);background-color:var(--accent)}

/* ---------- Final + footer ---------- */
.final{padding-block:clamp(56px,8vw,104px) clamp(40px,6vw,72px)}
.final-card{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(20px,4vw,56px);align-items:center;text-align:left;background:var(--accent-soft);color:var(--ink);border-radius:clamp(32px,5vw,64px);padding:clamp(32px,5vw,64px)}
.final-card h2{font-size:clamp(36px,4.6vw,60px);line-height:1.02;letter-spacing:-.026em}
.final-card p{margin:16px 0 0;color:var(--muted)}
.final-card .final-price{margin:0 0 14px;font-weight:700;color:var(--cta);font-size:16px}
.final-actions{justify-content:flex-start}
.final-card .btn-primary{background:var(--cta);color:var(--on-cta);box-shadow:0 14px 28px -14px var(--cta-shadow)}
.final-card .btn-primary:hover{background:var(--cta-hover)}
.final-card .btn-outline{color:var(--ink);border-color:var(--line-strong)}
.final-card .btn-outline:hover{border-color:var(--ink)}
.footer{background:var(--bg);border-top:0}
.footer-legal{border-top-color:var(--line)}

/* ---------- Dialogs and sub pages ---------- */
dialog::backdrop{background:rgba(51,20,44,.55)}
.lead-media-copy strong{font-family:var(--font-display);font-weight:600;letter-spacing:-.03em}
.lead-done .tick{background:var(--accent-soft);color:var(--cta)}
.lead-times input:checked + span{background:var(--ink);border-color:var(--ink)}
.thanks-card{background:var(--accent-soft);color:var(--ink);border-radius:clamp(28px,4vw,48px)}
.thanks-card .thanks-lead{color:var(--muted)}
.thanks-card .btn-primary{background:var(--cta);color:var(--on-cta);box-shadow:0 14px 28px -14px var(--cta-shadow)}
.thanks-card .btn-primary:hover{background:var(--cta-hover)}
.sub-note{margin:0 0 10px;font-family:var(--font-display);font-style:italic;font-size:19px;color:var(--cta)}
.legal h1{letter-spacing:-.024em}

/* Figures in Figtree Bold; the display face stays on headlines and the hero price */
.bar-label b,.gap-callout strong,.prow b,.line-item.total strong,.allin strong,.roi-tile strong,.result-main,.sp-home-name,.sp-price{font-family:var(--font-body);font-weight:800;letter-spacing:-.03em}

/* ---------- Responsive ---------- */
@media (max-width:1040px){
  .hero-grid,.compare{grid-template-columns:1fr}
  .collage{max-width:560px;width:100%;margin-inline:auto}
  .tiles{grid-template-columns:repeat(5,1fr)}
  .final-card{grid-template-columns:1fr}
}
@media (max-width:720px){
  body{font-size:16px}
  .hero h1{font-size:clamp(40px,11.4vw,50px);max-width:none}
  .chip{font-size:12.5px;padding:6px 12px}
  .collage{height:min(92vw,380px)}
  .offer{grid-template-columns:1fr;gap:12px;padding:16px 18px}
  .offer-rows{padding:12px 0 0;border-left:0;border-top:1.5px dashed var(--line-strong)}
  .offer-rows div{justify-content:flex-start}
  .offer-rows dt{min-width:112px}
  .facts-row div{padding:16px 6px;border-top:0}
  .facts-row div + div::before{display:none}
  .facts-row div:nth-child(n+3){border-top:1.5px dotted var(--line-strong)}
  .gallery a:nth-child(9),.gallery a:nth-child(11){grid-column:span 1}
  .gallery a:nth-child(12){grid-column:span 2}
  .fp-tabs{flex-wrap:wrap;width:auto;border-radius:18px}
  .tiles{grid-template-columns:1fr;margin-top:36px;padding-left:34px}
  .tiles::before{left:7px;right:auto;top:10px;bottom:22px;border-top:0;border-left:2px dashed var(--line-strong)}
  .tiles div{display:flex;align-items:baseline;gap:12px;padding:0 0 18px;text-align:left}
  .tiles div::before{left:-34px;top:6px;margin-left:0}
  .tiles div:last-child{grid-column:auto}
  .tiles strong{font-size:22px;min-width:76px}
  .offer-points div{padding:2px 10px}
  .offer-points strong{font-size:19px}
  .ptab{padding:26px 20px 18px}
  .final-card{padding:28px 22px}
  .footer{padding-bottom:170px}
}
.final-card .final-more{margin-top:18px;font-size:15px}
.link-btn{padding:0;border:0;background:none;cursor:pointer;font:inherit;font-weight:700;color:var(--ink)}