/* ==========================================================================
   New York Restoration — Static site stylesheet
   Palette: Navy #0f2147, White #ffffff, Gray #f4f6f9 / #6b7480 / #2a2f3a
   Accent : Subtle blue #2c5fa5
   ========================================================================== */

:root{
    --navy: #0f2147;
    --navy-2: #16306b;
    --blue: #2c5fa5;
    --blue-soft: #e8eef7;
    --ink: #1c2230;
    --text: #2a2f3a;
    --muted: #6b7480;
    --line: #e5e8ee;
    --bg-soft: #f4f6f9;
    --white: #ffffff;
    --shadow: 0 1px 3px rgba(15,33,71,.06), 0 6px 18px rgba(15,33,71,.06);
    --radius: 6px;
    --container: 1180px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    font-family:"Inter","Helvetica Neue",Arial,sans-serif;
    color:var(--text);
    background:var(--white);
    line-height:1.65;
    font-size:16px;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block;height:auto}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{font-family:"Source Serif Pro","Georgia",serif;color:var(--navy);font-weight:600;letter-spacing:-.01em;line-height:1.25;margin:0 0 .6em}
h1{font-size:2.4rem}
h2{font-size:1.85rem}
h3{font-size:1.25rem}
p{margin:0 0 1em}
.container{max-width:var(--container);margin:0 auto;padding:0 24px}

/* ---------- Top bar ---------- */
.topbar{
    background:var(--navy);
    color:#cdd6e6;
    font-size:.84rem;
    border-bottom:1px solid #0a1736;
}
.topbar .container{
    display:flex;justify-content:space-between;align-items:center;
    height:38px;
}
.topbar a{color:#e7ecf6}
.topbar .top-meta span+span{margin-left:18px;border-left:1px solid #2a3c66;padding-left:18px}

/* ---------- Header / Nav ---------- */
.site-header{
    background:var(--white);
    border-bottom:1px solid var(--line);
    position:sticky;top:0;z-index:50;
}
.site-header .container{
    display:flex;align-items:center;justify-content:space-between;
    height:78px;
}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand-mark{
    width:42px;height:42px;background:var(--navy);color:#fff;
    display:grid;place-items:center;font-family:"Source Serif Pro",serif;
    font-weight:700;font-size:1.1rem;letter-spacing:.02em;border-radius:4px;
}
.brand-name{display:flex;flex-direction:column;line-height:1.1}
.brand-name strong{color:var(--navy);font-family:"Source Serif Pro",serif;font-size:1.15rem;font-weight:700}
.brand-name small{color:var(--muted);font-size:.78rem;letter-spacing:.04em;text-transform:uppercase}

.nav{display:flex;align-items:center;gap:6px}
.nav a{
    color:var(--ink);font-weight:500;font-size:.95rem;
    padding:10px 14px;border-radius:4px;
}
.nav a:hover{color:var(--navy);background:var(--bg-soft);text-decoration:none}
.nav a.active{color:var(--navy);background:var(--blue-soft)}
.nav-cta{
    margin-left:10px;background:var(--navy);color:#fff !important;
    padding:11px 18px !important;border-radius:4px;
}
.nav-cta:hover{background:var(--navy-2);text-decoration:none}

.menu-toggle{display:none;background:none;border:1px solid var(--line);padding:8px 10px;border-radius:4px;cursor:pointer}
.menu-toggle span{display:block;width:22px;height:2px;background:var(--navy);margin:4px 0}

/* ---------- Buttons ---------- */
.btn{
    display:inline-block;padding:13px 22px;border-radius:4px;
    font-weight:600;font-size:.95rem;letter-spacing:.01em;
    border:1px solid transparent;cursor:pointer;transition:all .15s ease;
}
.btn-primary{background:var(--navy);color:#fff}
.btn-primary:hover{background:var(--navy-2);text-decoration:none;color:#fff}
.btn-outline{border-color:var(--navy);color:var(--navy);background:transparent}
.btn-outline:hover{background:var(--navy);color:#fff;text-decoration:none}
.btn-ghost{color:var(--navy);background:transparent;border-color:var(--line)}
.btn-ghost:hover{background:var(--bg-soft);text-decoration:none}

/* ---------- Hero ---------- */
.hero{
    position:relative;
    background:
        linear-gradient(rgba(15,33,71,.78), rgba(15,33,71,.78)),
        url("../images/hero-nyc-skyline.jpg") center/cover no-repeat;
    color:#fff;
    padding:96px 0 110px;
}
.hero h1{color:#fff;font-size:2.9rem;max-width:780px}
.hero .lead{font-size:1.18rem;max-width:680px;color:#dde4f1;margin-bottom:30px}
.hero .hero-meta{
    margin-top:34px;display:flex;gap:32px;flex-wrap:wrap;
    color:#cdd6e6;font-size:.92rem;
}
.hero .hero-meta strong{color:#fff;display:block;font-size:1.05rem;margin-bottom:2px}
.hero .actions{display:flex;gap:12px;flex-wrap:wrap}
.hero .actions .btn-primary{background:#fff;color:var(--navy)}
.hero .actions .btn-primary:hover{background:#eef2fb}
.hero .actions .btn-outline{border-color:#fff;color:#fff}
.hero .actions .btn-outline:hover{background:#fff;color:var(--navy)}

/* Inner page banner */
.page-hero{
    background:var(--navy);color:#fff;padding:64px 0 56px;
    border-bottom:4px solid var(--blue);
}
.page-hero h1{color:#fff;margin-bottom:6px}
.page-hero .crumb{color:#a8b6d4;font-size:.9rem;letter-spacing:.04em}
.page-hero .crumb a{color:#dde4f1}

/* ---------- Section base ---------- */
section{padding:72px 0}
section.tight{padding:48px 0}
.section-head{max-width:760px;margin-bottom:40px}
.section-head .eyebrow{
    color:var(--blue);text-transform:uppercase;letter-spacing:.12em;
    font-size:.78rem;font-weight:600;margin-bottom:12px;display:block;
}
.section-head h2{margin-bottom:12px}
.section-head p{color:var(--muted);font-size:1.05rem}

.bg-soft{background:var(--bg-soft)}
.bg-navy{background:var(--navy);color:#dde4f1}
.bg-navy h2,.bg-navy h3{color:#fff}
.bg-navy p{color:#cdd6e6}

/* ---------- Grids ---------- */
.grid{display:grid;gap:24px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}

/* ---------- Cards ---------- */
.card{
    background:#fff;border:1px solid var(--line);border-radius:var(--radius);
    overflow:hidden;display:flex;flex-direction:column;
    transition:transform .2s ease, box-shadow .2s ease;
}
.card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.card .card-body{padding:24px 24px 28px}
.card h3{margin-bottom:8px;font-size:1.15rem}
.card p{color:var(--muted);font-size:.95rem;margin-bottom:0}
.card .cover{aspect-ratio:16/10;background:#eef1f6 center/cover no-repeat}
.card .meta{font-size:.8rem;color:var(--blue);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px;font-weight:600}
.card-link{display:inline-block;margin-top:14px;color:var(--navy);font-weight:600;font-size:.92rem}
.card-link::after{content:" \2192"}

/* Service tile (icon-style) */
.service-tile{
    background:#fff;border:1px solid var(--line);border-left:3px solid var(--blue);
    padding:28px 26px;border-radius:var(--radius);
}
.service-tile h3{font-size:1.1rem;margin-bottom:8px}
.service-tile p{color:var(--muted);font-size:.93rem;margin-bottom:0}

/* Feature list (Why choose us) */
.feature{display:flex;gap:16px;align-items:flex-start}
.feature .num{
    flex:0 0 38px;height:38px;border-radius:50%;
    background:var(--blue-soft);color:var(--navy);
    display:grid;place-items:center;font-weight:700;
    font-family:"Source Serif Pro",serif;
}
.feature h3{font-size:1.05rem;margin-bottom:4px}
.feature p{color:var(--muted);font-size:.93rem;margin:0}

/* Property tags */
.tags{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 0}
.tag{
    display:inline-block;background:#fff;border:1px solid var(--line);
    padding:8px 14px;border-radius:999px;font-size:.88rem;color:var(--ink);
}

/* Service area chips */
.areas{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:24px}
.area-chip{
    background:#fff;border:1px solid var(--line);padding:18px 20px;border-radius:var(--radius);
    display:flex;align-items:center;gap:14px;
}
.area-chip .dot{width:10px;height:10px;border-radius:50%;background:var(--blue);flex:0 0 10px}
.area-chip strong{color:var(--navy);font-family:"Source Serif Pro",serif;font-size:1.05rem;display:block}
.area-chip span{color:var(--muted);font-size:.85rem}

/* Two-column intro */
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.split img{border-radius:var(--radius);box-shadow:var(--shadow)}

/* FAQ */
.faq-item{
    border-bottom:1px solid var(--line);padding:22px 0;
}
.faq-item h3{font-size:1.05rem;margin-bottom:8px}
.faq-item p{color:var(--muted);margin:0}

/* Contact block */
.contact-block{
    background:#fff;border:1px solid var(--line);border-radius:var(--radius);
    padding:36px;display:grid;grid-template-columns:1.1fr .9fr;gap:36px;
}
.contact-block h3{margin-top:0}
.contact-block ul{list-style:none;padding:0;margin:0 0 12px}
.contact-block li{padding:8px 0;color:var(--text);font-size:.96rem;border-bottom:1px dashed var(--line)}
.contact-block li:last-child{border-bottom:none}
.contact-block li strong{display:inline-block;min-width:90px;color:var(--navy)}

/* Forms */
.form-group{margin-bottom:16px}
.form-group label{display:block;font-size:.88rem;font-weight:600;color:var(--navy);margin-bottom:6px}
.form-group input,
.form-group select,
.form-group textarea{
    width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:4px;
    font-family:inherit;font-size:.95rem;color:var(--ink);background:#fff;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-soft)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}

/* CTA strip */
.cta-strip{background:var(--navy);color:#fff;padding:54px 0}
.cta-strip .container{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.cta-strip h2{color:#fff;margin:0;font-size:1.6rem}
.cta-strip p{color:#cdd6e6;margin:6px 0 0}
.cta-strip .btn-primary{background:#fff;color:var(--navy)}
.cta-strip .btn-primary:hover{background:#eef2fb}

/* Footer */
.site-footer{background:#0a1736;color:#cdd6e6;padding:60px 0 0;font-size:.92rem}
.site-footer h4{color:#fff;font-family:"Source Serif Pro",serif;font-size:1rem;margin:0 0 16px;letter-spacing:.02em}
.site-footer a{color:#cdd6e6}
.site-footer a:hover{color:#fff}
.site-footer .grid-4{gap:32px}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{padding:5px 0}
.footer-bottom{
    border-top:1px solid #1a2a55;margin-top:50px;padding:22px 0;
    color:#8d9bbb;font-size:.84rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
}

/* Project gallery photo */
.gallery-img{aspect-ratio:4/3;object-fit:cover;width:100%;border-radius:var(--radius)}

/* Map */
.map-wrap{
    border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
    background:var(--bg-soft);
}
.map-wrap iframe{display:block;border:0;width:100%;height:360px}

/* Hours table */
.hours-table{width:100%;border-collapse:collapse;font-size:.95rem}
.hours-table td{padding:8px 0;border-bottom:1px dashed var(--line);color:var(--text)}
.hours-table td:last-child{text-align:right;color:var(--muted)}

/* Prose (legal pages) */
.prose{max-width:820px}
.prose h2{margin-top:36px;font-size:1.4rem}
.prose h3{margin-top:24px;font-size:1.1rem}
.prose ul{padding-left:22px;color:var(--text)}
.prose li{margin-bottom:6px}

/* Responsive */
@media (max-width: 960px){
    .grid-4{grid-template-columns:repeat(2,1fr)}
    .grid-3{grid-template-columns:repeat(2,1fr)}
    .areas{grid-template-columns:repeat(2,1fr)}
    .split{grid-template-columns:1fr}
    .contact-block{grid-template-columns:1fr;padding:28px}
    .hero{padding:72px 0 80px}
    .hero h1{font-size:2.2rem}
}
@media (max-width: 720px){
    .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
    .areas{grid-template-columns:1fr}
    .form-row{grid-template-columns:1fr}
    .nav{
        display:none;position:absolute;top:78px;left:0;right:0;
        background:#fff;flex-direction:column;align-items:stretch;
        border-bottom:1px solid var(--line);padding:12px 16px;
    }
    .nav.open{display:flex}
    .nav a{padding:12px 14px}
    .nav-cta{margin-left:0;text-align:center}
    .menu-toggle{display:block}
    .topbar .top-meta span+span{display:none}
    h1{font-size:1.8rem}
    h2{font-size:1.5rem}
    section{padding:54px 0}
    .cta-strip .container{flex-direction:column;align-items:flex-start}
}