/* ============================================================
   The Dillon Condo — Welcome Guide  |  shared stylesheet
   ============================================================ */
:root{
  --pine:#1f3d34; --pine-dark:#16302a; --pine-soft:#2e5547;
  --lake:#2f6f8f; --wood:#b5793a; --wood-light:#d99a55;
  --cream:#f7f4ee; --ink:#232a27; --muted:#5d6863; --white:#fff; --line:#e2ded5;
  --shadow:0 8px 28px rgba(20,40,35,.10); --radius:14px; --maxw:1080px;
  --font-head:"Playfair Display",Georgia,"Times New Roman",serif;
  --font-body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;font-family:var(--font-body);color:var(--ink);background:var(--cream);line-height:1.65;-webkit-font-smoothing:antialiased;}
h1,h2,h3{font-family:var(--font-head);font-weight:700;line-height:1.2;color:var(--pine);}
h1{font-size:clamp(2rem,5vw,3.2rem);margin:0 0 .4em;}
h2{font-size:clamp(1.5rem,3.5vw,2.2rem);margin:0 0 .5em;}
h3{font-size:1.25rem;margin:0 0 .4em;color:var(--pine-soft);}
p{margin:0 0 1em;}
a{color:var(--lake);text-decoration:none;}
a:hover{text-decoration:underline;}
img{max-width:100%;display:block;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px;}

/* Header / Nav */
.site-header{position:sticky;top:0;z-index:50;background:rgba(31,61,52,.97);backdrop-filter:blur(6px);box-shadow:0 2px 14px rgba(0,0,0,.18);}
.nav{display:flex;align-items:center;justify-content:space-between;max-width:var(--maxw);margin:0 auto;padding:12px 22px;gap:16px;}
.brand{display:flex;align-items:center;gap:10px;color:var(--white);font-family:var(--font-head);font-size:1.15rem;font-weight:700;}
.brand .mark{font-size:1.4rem;}
.brand:hover{text-decoration:none;opacity:.92;}
.nav-toggle{display:none;background:none;border:1.5px solid rgba(255,255,255,.5);color:#fff;border-radius:8px;padding:7px 11px;font-size:1.1rem;cursor:pointer;}
.nav-links{display:flex;flex-wrap:wrap;align-items:center;gap:2px;list-style:none;margin:0;padding:0;}
.nav-links a{color:#e8efe9;font-size:.86rem;font-weight:500;letter-spacing:.2px;padding:7px 11px;border-radius:8px;white-space:nowrap;}
.nav-links a:hover{background:rgba(255,255,255,.12);text-decoration:none;color:#fff;}
.nav-links a.active{background:var(--wood);color:#fff;}

/* Hero */
.hero{position:relative;min-height:78vh;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;padding:80px 22px;background:linear-gradient(rgba(18,34,29,.28),rgba(18,34,29,.42)),url('../images/sunset.jpg') center/cover no-repeat;}
.hero h1{color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.45);}
.hero p{font-size:1.2rem;max-width:640px;margin:0 auto 1.6em;text-shadow:0 1px 10px rgba(0,0,0,.4);}
.hero .eyebrow{text-transform:uppercase;letter-spacing:3px;font-size:.8rem;font-weight:600;color:var(--wood-light);margin-bottom:1rem;}
.pagehero{position:relative;color:#fff;text-align:center;padding:64px 22px;background:linear-gradient(rgba(18,34,29,.55),rgba(18,34,29,.65)),url('../images/balcony.jpg') center/cover no-repeat;}
.pagehero h1{color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.45);margin-bottom:.2em;}
.pagehero p{color:#eef3ef;margin:0;}

/* Buttons */
.btn{display:inline-block;background:var(--wood);color:#fff;font-weight:600;padding:13px 26px;border-radius:40px;letter-spacing:.3px;font-size:.95rem;transition:transform .15s ease,background .2s ease;}
.btn:hover{background:var(--wood-light);text-decoration:none;transform:translateY(-2px);color:#fff;}
.btn.ghost{background:transparent;border:2px solid #fff;}
.btn.ghost:hover{background:rgba(255,255,255,.15);}
.btn-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

/* Sections */
section.block{padding:64px 0;}
section.block.alt{background:var(--white);}
.lead{font-size:1.12rem;color:var(--muted);max-width:760px;}
.center{text-align:center;}
.center .lead{margin-left:auto;margin-right:auto;}

/* Card grid */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:22px;margin-top:36px;}
.card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:26px 24px;box-shadow:var(--shadow);transition:transform .18s ease,box-shadow .18s ease;display:flex;flex-direction:column;}
.card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(20,40,35,.16);text-decoration:none;}
.card .ico{font-size:1.7rem;margin-bottom:10px;}
.card h3{margin-bottom:6px;}
.card p{color:var(--muted);font-size:.95rem;margin:0;}

/* Info / panels */
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin-top:28px;}
.panel{background:var(--white);border:1px solid var(--line);border-left:5px solid var(--pine-soft);border-radius:12px;padding:22px 24px;box-shadow:var(--shadow);}
.panel.wood{border-left-color:var(--wood);}
.panel.lake{border-left-color:var(--lake);}
.panel h3{margin-top:0;}
.placeholder{background:#fbf6ea;border:1px dashed var(--wood);color:#7a5a2a;border-radius:8px;padding:3px 8px;font-weight:600;font-size:.92em;}
.note{font-size:.9rem;color:var(--muted);font-style:italic;}
.detail-list{list-style:none;padding:0;margin:0;}
.detail-list li{padding:10px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.detail-list li:last-child{border-bottom:none;}
.detail-list .k{font-weight:600;color:var(--pine);}
.detail-list .v{color:var(--muted);text-align:right;}

/* Distance list */
.dist{columns:2;column-gap:40px;list-style:none;padding:0;margin:24px 0 0;}
.dist li{padding:8px 0;border-bottom:1px solid var(--line);break-inside:avoid;}
.dist li b{color:var(--pine);}

/* Gallery */
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:28px;}
.gallery img{border-radius:12px;height:230px;object-fit:cover;width:100%;box-shadow:var(--shadow);}

/* Steps */
.steps{counter-reset:step;list-style:none;padding:0;margin:28px 0 0;}
.steps li{position:relative;padding:0 0 22px 56px;}
.steps li::before{counter-increment:step;content:counter(step);position:absolute;left:0;top:0;width:38px;height:38px;border-radius:50%;background:var(--pine);color:#fff;display:grid;place-items:center;font-weight:700;font-family:var(--font-head);}
.steps li:not(:last-child)::after{content:"";position:absolute;left:18px;top:40px;bottom:4px;width:2px;background:var(--line);}
.steps h3{margin-bottom:4px;}

/* FAQ */
.faq details{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:4px 20px;margin-bottom:12px;box-shadow:var(--shadow);}
.faq summary{cursor:pointer;font-weight:600;color:var(--pine);padding:14px 0;list-style:none;font-size:1.02rem;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";float:right;color:var(--wood);font-size:1.4rem;line-height:1;}
.faq details[open] summary::after{content:"\2212";}
.faq details[open] summary{border-bottom:1px solid var(--line);}
.faq details p{padding:14px 0;margin:0;color:var(--muted);}

/* Callout */
.callout{background:var(--pine);color:#eef3ef;border-radius:var(--radius);padding:30px 34px;margin-top:28px;}
.callout h3{color:var(--wood-light);}
.callout a{color:#fff;text-decoration:underline;}

/* CTA band */
.cta{background:linear-gradient(rgba(31,61,52,.86),rgba(31,61,52,.92)),url('../images/balcony.jpg') center/cover no-repeat;color:#fff;text-align:center;padding:70px 22px;}
.cta h2{color:#fff;}
.cta p{color:#e8efe9;max-width:620px;margin:0 auto 1.6em;}

/* Footer */
.site-footer{background:var(--pine-dark);color:#b9c7c0;padding:44px 22px 28px;}
.footer-inner{max-width:var(--maxw);margin:0 auto;display:flex;flex-wrap:wrap;gap:30px;justify-content:space-between;}
.footer-inner h4{color:#fff;font-family:var(--font-head);margin:0 0 12px;font-size:1.1rem;}
.footer-col{flex:1 1 220px;}
.footer-col a{color:#b9c7c0;display:block;padding:3px 0;font-size:.92rem;}
.footer-col a:hover{color:#fff;}
.footer-bottom{text-align:center;margin-top:30px;padding-top:18px;border-top:1px solid rgba(255,255,255,.12);font-size:.82rem;color:#8aa097;}

/* Responsive */


/* ===== v2 additions: luxury design elements ===== */
.nav-links a.book{background:var(--wood);color:#fff;font-weight:600;}
.nav-links a.book:hover{background:var(--wood-light);}

.hero .elev{font-size:.95rem;letter-spacing:1px;color:#eef3ef;margin-bottom:1.4rem;text-transform:uppercase;opacity:.9;}
.hero h1.tagline{font-size:clamp(2.1rem,5.5vw,3.6rem);line-height:1.12;}

/* Alternating showcase rows */
.showcase{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;}
.showcase .pic{min-height:340px;background-size:cover;background-position:center;}
.showcase .txt{padding:54px 48px;display:flex;flex-direction:column;justify-content:center;background:var(--white);}
.showcase .txt h2{margin-top:0;}
.showcase.flip .pic{order:2;}
.showcase.flip .txt{order:1;}
@media (max-width:760px){
  .showcase{grid-template-columns:1fr;}
  .showcase .pic{min-height:240px;}
  .showcase.flip .pic{order:0;}
  .showcase.flip .txt{order:0;}
  .showcase .txt{padding:38px 26px;}
}

/* Distance summary with drive times */
.dist-time{list-style:none;padding:0;margin:26px 0 0;max-width:680px;}
.dist-time li{display:flex;justify-content:space-between;gap:18px;padding:14px 4px;border-bottom:1px solid var(--line);}
.dist-time li:last-child{border-bottom:none;}
.dist-time .place{font-weight:600;color:var(--pine);}
.dist-time .time{color:var(--muted);white-space:nowrap;}

/* Big lifestyle gallery */
.gallery-lg{display:grid;grid-template-columns:repeat(12,1fr);gap:12px;margin-top:30px;}
.gallery-lg img{width:100%;height:100%;object-fit:cover;border-radius:12px;box-shadow:var(--shadow);display:block;}
.gallery-lg .g1{grid-column:span 8;height:380px;}
.gallery-lg .g2{grid-column:span 4;height:380px;}
.gallery-lg .g3,.gallery-lg .g4,.gallery-lg .g5{grid-column:span 4;height:240px;}
@media (max-width:760px){
  .gallery-lg{grid-template-columns:1fr 1fr;}
  .gallery-lg .g1{grid-column:span 2;height:260px;}
  .gallery-lg .g2{grid-column:span 2;height:220px;}
  .gallery-lg .g3,.gallery-lg .g4,.gallery-lg .g5{grid-column:span 1;height:160px;}
}

/* Fee/important note styling for rules */
.rule-strong{color:#a23b2d;font-weight:600;}
.agree{background:var(--pine);color:#eef3ef;border-radius:var(--radius);padding:24px 28px;margin-top:30px;font-size:.98rem;}

/* =========================================================
   v3 — refined / professional layer (overrides above)
   ========================================================= */
:root{ --gold:#c1873f; --gold-l:#dda85c; --ink-soft:#4b544f; }
body{ color:#222a26; }
h1,h2,h3{ letter-spacing:.2px; }
[id]{ scroll-margin-top:92px; }

/* ---------- Fixed transparent header -> solid on scroll ---------- */
.site-header{ position:fixed; top:0; left:0; right:0; z-index:200; background:transparent; box-shadow:none; backdrop-filter:none; transition:background .35s ease, box-shadow .35s ease, padding .3s ease; }
.site-header.scrolled{ background:rgba(20,44,37,.96); box-shadow:0 8px 30px rgba(0,0,0,.22); backdrop-filter:blur(10px); }
.nav{ padding:18px 34px; transition:padding .3s ease; }
.site-header.scrolled .nav{ padding:11px 34px; }

.brand{ gap:12px; color:#fff; align-items:center; }
.brand .mark{ width:34px; height:34px; fill:var(--gold-l); flex:none; filter:drop-shadow(0 2px 4px rgba(0,0,0,.3)); }
.brand-txt{ display:flex; flex-direction:column; line-height:1.02; font-family:var(--font-head); font-weight:700; font-size:1.12rem; color:#fff; }
.brand-txt em{ font-style:normal; font-family:var(--font-body); font-weight:600; font-size:.62rem; letter-spacing:3.5px; text-transform:uppercase; color:var(--gold-l); margin-top:3px; }
.brand:hover{ opacity:1; }

.nav-links{ display:flex; align-items:center; gap:2px; }
.nav-links > a, .dd-toggle{ position:relative; display:inline-flex; align-items:center; gap:7px; color:#eef3ef; font-family:var(--font-body); font-size:.78rem; font-weight:600; letter-spacing:1.4px; text-transform:uppercase; padding:11px 15px; background:none; border:0; cursor:pointer; }
.nav-links > a::after, .dd-toggle::after{ content:""; position:absolute; left:15px; right:15px; bottom:7px; height:1.5px; background:var(--gold-l); transform:scaleX(0); transform-origin:left; transition:transform .28s ease; }
.nav-links > a:hover, .dd-toggle:hover, .nav-item:hover .dd-toggle{ color:#fff; text-decoration:none; }
.nav-links > a:hover::after, .nav-item:hover .dd-toggle::after, .nav-links > a.active::after, .dd-toggle.active::after{ transform:scaleX(1); }
.nav-links > a.active, .dd-toggle.active{ color:#fff; }
.chev{ width:7px; height:7px; border-right:1.6px solid currentColor; border-bottom:1.6px solid currentColor; transform:rotate(45deg); margin-bottom:2px; transition:transform .25s ease; opacity:.85; }
.nav-item:hover .chev, .nav-item.open .chev{ transform:rotate(-135deg); margin-bottom:-2px; }

/* Dropdown panels */
.nav-item{ position:relative; }
.nav-item:hover::before{ content:""; position:absolute; top:100%; left:0; right:0; height:16px; }
.dd{ position:absolute; top:calc(100% + 10px); left:50%; transform:translateX(-50%) translateY(8px); min-width:236px; background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:0 22px 50px rgba(16,40,34,.22); padding:9px; opacity:0; visibility:hidden; transition:opacity .24s ease, transform .24s ease; }
.nav-item:hover .dd{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.dd a{ display:block; color:var(--pine); font-size:.9rem; font-weight:500; letter-spacing:.2px; text-transform:none; padding:11px 15px; border-radius:9px; }
.dd a::after{ display:none; }
.dd a:hover{ background:var(--cream); color:var(--pine); text-decoration:none; padding-left:19px; }
.dd a.active{ background:var(--cream); color:var(--gold); }

/* Book button */
.nav-links a.book{ background:var(--gold); color:#fff; border-radius:40px; padding:10px 22px; margin-left:10px; box-shadow:0 6px 18px rgba(193,135,63,.35); }
.nav-links a.book::after{ display:none; }
.nav-links a.book:hover{ background:var(--gold-l); color:#fff; transform:translateY(-1px); }

/* Hamburger */
.nav-toggle{ display:none; flex-direction:column; gap:6px; background:none; border:0; padding:8px; cursor:pointer; }
.nav-toggle span{ width:26px; height:2px; background:#fff; border-radius:2px; transition:transform .3s ease, opacity .2s ease; }
body.nav-open .nav-toggle span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
body.nav-open .nav-toggle span:nth-child(2){ opacity:0; }
body.nav-open .nav-toggle span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }
.nav-backdrop{ position:fixed; inset:0; background:rgba(10,20,17,.5); opacity:0; visibility:hidden; transition:.3s ease; z-index:150; }
body.nav-open .nav-backdrop{ opacity:1; visibility:visible; }

/* ---------- Hero ---------- */
.hero{ min-height:100vh; padding:130px 22px 96px; position:relative; }
.hero::before{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,22,18,.12), rgba(10,22,18,.28) 45%, rgba(10,22,18,.72)); }
.hero > *{ position:relative; z-index:1; }
.hero .elev{ display:inline-flex; align-items:center; gap:15px; font-size:.82rem; letter-spacing:2.5px; }
.hero .elev::before, .hero .elev::after{ content:""; width:40px; height:1px; background:var(--gold-l); opacity:.85; }
.hero h1.tagline{ font-size:clamp(2.5rem,6.2vw,4.2rem); letter-spacing:.5px; }
.hero p{ font-size:1.22rem; color:#f2f5f1; }
.hero::after{ content:""; position:absolute; left:50%; bottom:28px; width:13px; height:13px; border-right:2px solid rgba(255,255,255,.85); border-bottom:2px solid rgba(255,255,255,.85); transform:translateX(-50%) rotate(45deg); animation:heroBob 1.9s ease-in-out infinite; z-index:1; }
@keyframes heroBob{ 0%,100%{ transform:translateX(-50%) rotate(45deg) translateY(0);} 50%{ transform:translateX(-50%) rotate(45deg) translate(0,8px);} }

/* ---------- Page hero (interior) ---------- */
.pagehero{ padding:132px 22px 62px; position:relative; }
.pagehero::before{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(12,26,22,.42), rgba(12,26,22,.62)); }
.pagehero > *{ position:relative; z-index:1; }
.pagehero h1{ font-size:clamp(2rem,4.5vw,2.9rem); }

/* ---------- Section rhythm & accents ---------- */
section.block{ padding:82px 0; }
.block .center h2{ display:inline-block; }
.block .center h2::after{ content:""; display:block; width:56px; height:3px; background:var(--gold); border-radius:2px; margin:16px auto 0; }
.lead{ font-size:1.14rem; color:var(--ink-soft); }

/* ---------- Showcase ---------- */
.showcase .txt{ padding:66px 58px; }
.showcase .txt h2::before{ content:""; display:block; width:46px; height:3px; background:var(--gold); border-radius:2px; margin-bottom:20px; }
.showcase .pic{ min-height:420px; }

/* ---------- Cards ---------- */
.card{ border-radius:16px; padding:30px 26px; border:1px solid var(--line); box-shadow:0 10px 30px rgba(16,40,34,.06); transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.card:hover{ transform:translateY(-6px); box-shadow:0 22px 46px rgba(16,40,34,.14); border-color:#dcd3bf; }
.card .ico{ display:inline-grid; place-items:center; width:54px; height:54px; border-radius:15px; background:linear-gradient(135deg,#f4eee1,#e9dfc9); font-size:1.5rem; margin-bottom:16px; box-shadow:inset 0 0 0 1px rgba(193,135,63,.18); }
.card h3{ color:var(--pine); }

/* ---------- Panels ---------- */
.panel{ border-radius:14px; box-shadow:0 10px 30px rgba(16,40,34,.06); }

/* ---------- Buttons ---------- */
.btn{ padding:15px 32px; font-size:.8rem; font-weight:600; letter-spacing:1.5px; text-transform:uppercase; border-radius:44px; box-shadow:0 10px 24px rgba(193,135,63,.28); }
.btn:hover{ box-shadow:0 14px 30px rgba(193,135,63,.38); }
.btn, .btn:hover{ background:var(--gold); }
.btn.ghost{ background:transparent; box-shadow:none; }
.btn.ghost:hover{ background:rgba(255,255,255,.14); }

/* ---------- Distance list ---------- */
.dist-time li{ padding:15px 6px; }
.dist-time .place{ letter-spacing:.2px; }

/* ---------- CTA ---------- */
.cta{ padding:96px 22px; }
.cta h2{ font-size:clamp(1.9rem,4.5vw,2.8rem); }

/* ---------- Footer ---------- */
.site-footer{ padding:66px 22px 30px; }
.footer-inner{ gap:44px; }
.footer-inner h4{ font-family:var(--font-body); font-weight:600; text-transform:uppercase; letter-spacing:1.8px; font-size:.78rem; color:var(--gold-l); }
.footer-col a{ letter-spacing:.3px; }

/* ---------- Scroll reveal ---------- */
.js .reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease; }
.js .reveal.in{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  .js .reveal{ opacity:1 !important; transform:none !important; }
  .hero::after{ animation:none; }
}

/* ---------- Mobile ---------- */



/* ================= v4: consolidated responsive layer ================= */
html, body { overflow-x: hidden; max-width: 100%; }
img, .showcase .pic { max-width: 100%; }

/* ---- Tablet / mobile: off-canvas drawer nav (single source of truth) ---- */
@media (max-width: 960px){
  .nav { padding: 12px 18px; }
  .site-header.scrolled .nav { padding: 10px 18px; }
  .brand-txt { font-size: 1rem; }
  .brand .mark { width: 30px; height: 30px; }

  .nav-toggle { display: flex; }

  .nav-links{
    display: flex; position: fixed; top: 0; right: 0;
    height: 100vh; height: 100dvh; width: min(340px, 88vw);
    flex-direction: column; align-items: stretch; gap: 0;
    background: var(--pine); padding: 88px 20px 32px;
    transform: translateX(105%); transition: transform .35s ease;
    overflow-y: auto; box-shadow: -20px 0 50px rgba(0,0,0,.4);
    z-index: 205; visibility: hidden;
  }
  body.nav-open .nav-links{ transform: translateX(0); visibility: visible; }
  body.nav-open{ overflow: hidden; }

  .nav-links > a, .dd-toggle{
    width: 100%; justify-content: space-between; text-transform: uppercase;
    padding: 15px 6px; border-bottom: 1px solid rgba(255,255,255,.09);
    font-size: .82rem; letter-spacing: 1.2px;
  }
  .nav-links > a::after, .dd-toggle::after{ display: none; }
  .nav-item{ position: static; border-bottom: 1px solid rgba(255,255,255,.09); }
  .nav-item .dd-toggle{ border-bottom: 0; }
  .nav-item:hover::before{ display: none; }
  .dd{
    position: static; transform: none; opacity: 1; visibility: visible;
    min-width: 0; background: transparent; border: 0; box-shadow: none;
    padding: 0; max-height: 0; overflow: hidden; transition: max-height .3s ease;
  }
  .nav-item:hover .dd{ max-height: 0; }        /* no hover-open on touch */
  .nav-item.open .dd{ max-height: 520px; padding: 2px 0 10px; }
  .dd a{ color: #cfe0d8; padding: 12px 14px; }
  .dd a:hover{ background: rgba(255,255,255,.07); color: #fff; padding-left: 18px; }
  .nav-links a.book{ margin: 16px 0 0; text-align: center; border-bottom: 0; border-radius: 40px; }
  .nav-backdrop{ z-index: 200; }
}

/* ---- Phone layout tightening ---- */
@media (max-width: 760px){
  .wrap{ padding: 0 18px; }
  section.block{ padding: 52px 0; }
  .hero{ min-height: 86vh; padding: 116px 20px 76px; }
  .hero p{ font-size: 1.08rem; }
  .pagehero{ padding: 108px 20px 46px; }
  .lead{ font-size: 1.05rem; }
  .showcase .txt{ padding: 34px 22px; }
  .showcase .pic{ min-height: 230px; }
  .cards{ gap: 16px; }
  .card{ padding: 24px 20px; }
  .info-grid{ gap: 16px; }
  .panel{ padding: 20px; }
  .callout{ padding: 24px 22px; }
  .agree{ padding: 22px 22px; }
  .cta{ padding: 64px 20px; }
  .dist-time li{ flex-direction: column; gap: 2px; align-items: flex-start; }
  .dist-time .time{ text-align: left; }
  .detail-list li{ flex-direction: column; gap: 2px; }
  .detail-list .v{ text-align: left; }
  .steps li{ padding-left: 46px; }
  .footer-inner{ gap: 26px; }
  .block .center h2::after{ margin-top: 12px; }
}

/* ---- Small phones ---- */
@media (max-width: 430px){
  .hero h1.tagline, .hero h1{ font-size: 2.15rem; line-height: 1.16; }
  .pagehero h1{ font-size: 1.7rem; }
  .hero .elev{ font-size: .7rem; letter-spacing: 1.4px; gap: 8px; }
  .hero .elev::before, .hero .elev::after{ width: 18px; }
  .btn-row{ flex-direction: column; align-items: stretch; }
  .btn-row .btn{ width: 100%; text-align: center; }
  .brand-txt em{ font-size: .56rem; letter-spacing: 2.5px; }
}