/*
 * Contact page (page-contact.php) design system — copied from contact.html's
 * <style> block. Shared #r1fh / .r1-nav-menu / .r1-pillnav / footer rules
 * live in assets/css/base.css and are not duplicated here.
 */
:root{--emerald:#183c28;--emerald2:#133020;--emerald50:#ecfdf5;--slate950:#020617;--slate900:#0f172a;--slate700:#334155;--slate600:#475569;--slate500:#64748b;--slate300:#cbd5e1;--slate200:#e2e8f0;--slate50:#f8fafc;--white:#fff}
.container{width:min(1180px,calc(100% - 48px));margin:auto}
.section{padding:80px 0}
.hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#f8fafc 0%,#fff 50%,#ecfdf5 100%)}
.blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:.7}
.blob.a{width:320px;height:320px;background:#a7f3d0;left:-100px;top:90px}
.blob.b{width:380px;height:380px;background:#bae6fd;right:-110px;top:70px}
/* .brand / .brand-logo are shared in base.css now — .logo/.brand strong/
   .brand span are unused here (this page renders the SVG logo via
   .brand-logo, not the original text-badge logo variant). */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:12px;padding:15px 24px;text-decoration:none;font-weight:700;border:1px solid transparent;transition:.2s;cursor:pointer;font-family:inherit;font-size:15px}
.btn-primary{background:var(--emerald);color:#fff}
.btn-primary:hover{background:var(--emerald2);transform:translateY(-1px)}
.btn-light{background:#fff;color:var(--emerald2)}
.btn-outline{border-color:#cbd5e1;background:#fff;color:var(--slate950)}
.btn-outline-dark{border-color:rgba(255,255,255,.4);color:#fff;background:transparent}
.hero-grid,.split{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.hero-grid{padding:50px 0 100px}
.eyebrow{display:inline-flex;padding:10px 16px;border:1px solid #a7f3d0;border-radius:999px;background:#fff;color:var(--emerald);font-size:1.4rem;font-weight:700;box-shadow:0 6px 20px rgba(15,23,42,.06)}
.hero-grid .eyebrow{font-size:1rem}
h1{font-size:clamp(48px,7vw,74px);line-height:1.02;letter-spacing:-.045em;margin:22px 0 0}
h2{font-size:clamp(36px,5vw,54px);line-height:1.05;letter-spacing:-.035em;margin:14px 0 0}
h3{margin:0;font-size:24px}
.lead{font-size:20px;line-height:1.65;color:var(--slate950);max-width:760px}
.actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:30px}
.proof{display:grid;grid-template-columns:1fr;gap:12px;margin-top:32px}
.proof-card,.card{background:#fff;border:1px solid var(--slate200);border-radius:24px;box-shadow:0 10px 35px rgba(15,23,42,.08)}
.proof-card{padding:16px;display:flex;align-items:center;gap:10px}
.proof-card b{font-size:26px;color:var(--emerald)}
.proof-card span{font-size:1rem;color:#020617}
.feature-card{padding:30px}
.icon{width:48px;height:48px;border-radius:16px;background:#d1fae5;color:var(--emerald);display:grid;place-items:center;flex:0 0 auto}
.icon svg{width:24px;height:24px}
.feature-card h3{font-size:30px;margin-top:20px}
.muted{color:var(--slate950);line-height:1.75}
.list{display:grid;gap:12px;margin-top:24px}
.list-item{display:flex;gap:12px;align-items:flex-start;padding:16px;border-radius:16px;background:var(--slate50)}
.dark{background:var(--slate950);color:#fff}
.dark .muted{color:var(--slate300)}
.emerald{background:var(--emerald50)}
.kicker{text-transform:uppercase;letter-spacing:.28em;font-size:13px;font-weight:800;color:var(--emerald)}
.dark .kicker{color:#6ee7b7}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.service-card{padding:28px;transition:.2s}
.service-card:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(15,23,42,.12)}
.service-card h3{margin-top:18px}
.commitment{background:#fff;border:1px solid #d1fae5}
.dark-card{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.12)}
.cta{text-align:center;background:var(--emerald);color:#fff}
.cta p{color:#d1fae5}
.fade{opacity:0;transform:translateY(22px);animation:fade .7s ease forwards}
.delay{animation-delay:.12s}
@keyframes fade{to{opacity:1;transform:none}}
@media(max-width:900px){.hero-grid,.split{grid-template-columns:1fr}.grid-3{grid-template-columns:1fr 1fr}.proof{grid-template-columns:1fr}.nav .btn{display:none}}
@media(max-width:640px){.container{width:min(100% - 28px,1180px)}.section{padding:64px 0}.grid-3,.grid-2{grid-template-columns:1fr}.actions{flex-direction:column}.btn{width:100%}.hero-grid{padding:30px 0 70px}}

/* Contact-specific */
.contact-form{padding:34px}
.field{display:flex;flex-direction:column;gap:8px;margin-bottom:18px}
.field label{font-size:1rem;font-weight:700;color:var(--slate950)}
.field input,.field select,.field textarea{font-family:inherit;font-size:1rem;padding:14px 16px;border-radius:12px;border:1px solid var(--slate200);background:var(--slate50);color:var(--slate950);transition:.15s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--emerald);background:#fff;box-shadow:0 0 0 4px rgba(4,120,87,.1)}
.field textarea{resize:vertical;min-height:120px}
.row-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-note{font-size:1rem;color:var(--slate950);margin-top:14px;text-align:center}
.info-card{padding:30px;text-align:left}
.info-card .icon{margin-bottom:18px}
.info-card a{color:var(--slate950);text-decoration:none}
.info-card a:hover{color:var(--emerald2)}
@media(max-width:640px){.row-2{grid-template-columns:1fr}}
/* .brand-logo now lives in base.css (shared header component). */

/* Page-specific pill-nav padding override (contact uses a slightly shorter
   top/bottom padding than the index.html base rule in base.css). */
.r1-pillnav{padding:9px 20px}
@media(max-width:640px){.r1-pillnav{padding:12px 14px}}