/* ==========================================================================
   AGP Construction — shared silo page framework
   Brand system is locked (see AGP_Construction_Brand_Identity.pdf).
   Oxydancepilot: keep all CSS in this block; never put styles on markup attributes.
   ========================================================================== */
/* Every rule is scoped under .page-body so this stylesheet can be injected
   into a live Breakdance page without touching the theme, header or footer. */
.page-body{
  --ink:#0F1530;
  --blue:#465587;
  --red:#C13A1F;
  --red-bright:#E55A3C;
  --concrete:#F4F4F2;
  --steel:#8A8E99;
  --slate:#3A3F50;
  --white:#FFFFFF;
  --line:#E4E4E0;
  --line-dark:rgba(255,255,255,.12);
  --ink-2:#181F42;
  --hero-sub:#B9BFCF;
  --ph-bg:#E7E2D6;
  --ph-line:#CDC5AD;
}
.page-body,.page-body *{margin:0;padding:0;box-sizing:border-box}
.page-body{font-family:'Inter',system-ui,-apple-system,sans-serif;font-size:16px;line-height:1.7;color:var(--slate);background:var(--white);-webkit-font-smoothing:antialiased}
.page-body a{color:inherit;text-decoration:none}
.page-body img{max-width:100%;display:block}
.page-body .wrap{max-width:1200px;margin:0 auto;padding:0 24px}

/* --- type helpers --------------------------------------------------------- */
.page-body .eyebrow{font:600 12px/1.4 'Inter',sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--red);margin-bottom:14px}
.page-body h1,.page-body h2,.page-body h3.serif{font-family:'Playfair Display',Georgia,serif;font-weight:400;color:var(--ink)}
.page-body h1 em,.page-body h2 em{font-style:italic;font-weight:400;color:var(--red)}

/* --- buttons: element+class (a.btn--x) beats .page-body a ----------------- */
.btn{display:inline-block;font:600 14px/1 'Inter',sans-serif;letter-spacing:.04em;padding:16px 28px;border:1px solid transparent;border-radius:2px;transition:background .18s,color .18s,border-color .18s;cursor:pointer}
a.btn--red{background:var(--red);color:var(--white)}
a.btn--red:hover{background:#A83119}
a.btn--ghost{background:transparent;color:var(--white);border-color:rgba(255,255,255,.35)}
a.btn--ghost:hover{border-color:var(--white)}
a.btn--ghost-ink{background:transparent;color:var(--ink);border-color:#C9CBD3}
a.btn--ghost-ink:hover{border-color:var(--ink)}
a.btn--on-red{background:var(--white);color:var(--ink)}
a.btn--on-red:hover{background:var(--concrete)}
.page-body a:focus-visible,.page-body button:focus-visible{outline:2px solid var(--red-bright);outline-offset:2px}

/* --- page hero ------------------------------------------------------------ */
.page-hero{background:var(--ink);color:var(--white);padding:88px 0 72px;position:relative;overflow:hidden}
.page-hero::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.03) 0 1px,transparent 1px 80px),repeating-linear-gradient(0deg,rgba(255,255,255,.03) 0 1px,transparent 1px 80px);pointer-events:none}
.page-hero .wrap{position:relative}
.crumbs{font-size:12px;letter-spacing:.06em;color:var(--steel);margin-bottom:34px}
.crumbs a:hover{color:var(--white)}
.crumbs span{color:#AEB3C2}
.page-hero h1{font-size:clamp(2.1rem,4.6vw,3.3rem);line-height:1.15;color:var(--white);max-width:820px;margin-bottom:20px}
.page-hero h1 em{color:var(--red-bright)}
.hero-sub{font-size:1.08rem;color:var(--hero-sub);max-width:640px;margin-bottom:32px}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap}

/* --- content sections ----------------------------------------------------- */
.content{padding:76px 0}
.content--alt{background:var(--concrete)}
.content--dark{background:var(--ink)}
.content--dark p{color:var(--hero-sub)}
.section-head{max-width:760px;margin-bottom:44px}
.section-head h2{font-size:clamp(1.7rem,3.4vw,2.35rem);line-height:1.2}
.content--dark .section-head h2{color:var(--white)}
.section-head .lede{margin-top:14px;font-size:1.02rem}

/* --- prose ---------------------------------------------------------------- */
.prose{max-width:760px}
.prose p{margin-bottom:1.15em}
.prose p:last-child{margin-bottom:0}
.prose strong{color:var(--ink);font-weight:600}
.prose a{color:var(--red);text-decoration:underline;text-underline-offset:3px}
.prose a:hover{color:#A83119}
.content--dark .prose a{color:var(--red-bright)}
.content--dark .prose strong{color:var(--white)}
.prose h3{font-family:'Playfair Display',Georgia,serif;font-weight:500;font-size:1.35rem;color:var(--ink);margin:1.8em 0 .6em}
.content--dark .prose h3{color:var(--white)}
.prose ul{list-style:none;margin-bottom:1.15em}
.prose ul li{padding-left:26px;position:relative;margin-bottom:.45em}
.prose ul li::before{content:"—";color:var(--red);position:absolute;left:0;font-weight:600}

/* --- checklist (2-col tick list) ------------------------------------------ */
.ticks{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px 32px;max-width:760px}
.ticks li{padding-left:28px;position:relative;color:var(--slate)}
.ticks li::before{content:"\2713";position:absolute;left:0;color:var(--red);font-weight:700}
.ticks strong{color:var(--ink);font-weight:600}

/* --- card grids ----------------------------------------------------------- */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.card-grid--2{grid-template-columns:repeat(2,1fr)}
.card{background:var(--white);border:1px solid var(--line);padding:30px 28px}
.content--alt .card{border-color:#E0E0DB}
.content--dark .card{background:var(--ink-2);border-color:var(--line-dark)}
.card h3{font-family:'Playfair Display',Georgia,serif;font-weight:500;font-size:1.22rem;color:var(--ink);margin-bottom:10px}
.content--dark .card h3{color:var(--white)}
.card p{font-size:.95rem;margin-bottom:0}
.card .card-kicker{font:600 11px/1.4 'Inter',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--red);display:block;margin-bottom:12px}

/* --- link tiles (silo cross-links) ---------------------------------------- */
.tile-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.tile-row--3{grid-template-columns:repeat(3,1fr)}
a.tile{display:block;border:1px solid var(--line);padding:20px 22px;font:600 .95rem/1.4 'Inter',sans-serif;color:var(--ink);background:var(--white);transition:border-color .18s}
a.tile:hover{border-color:var(--red)}
a.tile .tile-note{display:block;font:400 .82rem/1.5 'Inter',sans-serif;color:var(--steel);margin-top:6px}
a.tile .tile-go{color:var(--red);font-weight:700}
.content--dark a.tile{background:var(--ink-2);border-color:var(--line-dark);color:var(--white)}
.content--dark a.tile:hover{border-color:var(--red-bright)}

/* --- process steps -------------------------------------------------------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;counter-reset:step}
.step{border-top:2px solid var(--red);padding-top:18px}
.step .step-num{font-family:'Playfair Display',Georgia,serif;font-style:italic;font-size:1.9rem;color:var(--red);display:block;margin-bottom:8px}
.step h3{font:600 1rem/1.4 'Inter',sans-serif;color:var(--ink);margin-bottom:8px}
.content--dark .step h3{color:var(--white)}
.step p{font-size:.92rem;margin-bottom:0}

/* --- stats ---------------------------------------------------------------- */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:760px}
.stat .stat-num{font-family:'Playfair Display',Georgia,serif;font-size:2.3rem;color:var(--red);display:block;line-height:1.1}
.stat .stat-label{font-size:.9rem;color:var(--steel)}

/* --- FAQ ------------------------------------------------------------------ */
.faq{max-width:760px}
.faq-item{border-top:1px solid var(--line);padding:24px 0}
.faq-item:last-child{border-bottom:1px solid var(--line)}
.faq-item h3{font:600 1.05rem/1.5 'Inter',sans-serif;color:var(--ink);margin-bottom:10px}
.faq-item p{font-size:.97rem;margin-bottom:0}
.faq-item p a{color:var(--red);text-decoration:underline;text-underline-offset:3px}

/* --- image placeholders (beige, until AGP supplies photos) ---------------- */
.img-ph{background:var(--ph-bg);border:1px dashed var(--ph-line);min-height:280px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:12px;padding:36px 40px}
.img-ph--wide{min-height:340px}
.img-duo{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.img-duo .img-ph{min-height:240px}
.img-ph .ph-tag{background:var(--red);color:var(--white);font:700 11px/1 'Inter',sans-serif;letter-spacing:.14em;text-transform:uppercase;padding:6px 10px}
.img-ph .ph-desc{color:var(--slate);font-size:.98rem;max-width:560px}
.img-ph .ph-note{color:var(--steel);font-size:.8rem}

/* --- AGP verify callout --------------------------------------------------- */
.verify-note{background:#FFF6D9;border:2px dashed #E0B400;padding:18px 22px;font-size:.92rem;color:#5A4A00;max-width:760px;margin:28px 0}
.verify-note strong{color:#5A4A00}

/* --- CTA band ------------------------------------------------------------- */
.cta-band{background:var(--red);padding:64px 0}
.cta-band .wrap{display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap}
.cta-band h2{font-size:clamp(1.6rem,3.2vw,2.3rem);color:var(--white);max-width:640px}
.cta-band h2 em{color:var(--ink)}
.cta-band p{color:#F6D7CE;margin-top:10px;max-width:560px}

/* --- contact block (Request a Bid) ---------------------------------------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.contact-card{border:1px solid var(--line);padding:32px;background:var(--white)}
.contact-card h3{font-family:'Playfair Display',Georgia,serif;font-weight:500;font-size:1.3rem;color:var(--ink);margin-bottom:16px}
.contact-card p{font-size:.97rem;margin-bottom:12px}
.contact-card a{color:var(--red);text-decoration:underline;text-underline-offset:3px}
.form-note{background:var(--concrete);border:1px dashed #C9CBD3;padding:24px;font-size:.9rem;color:var(--steel)}
.bid-form label{display:block;font:600 .85rem/1.4 'Inter',sans-serif;color:var(--ink);margin:18px 0 6px}
.bid-form input,.bid-form select,.bid-form textarea{width:100%;font:400 .95rem/1.5 'Inter',sans-serif;color:var(--slate);padding:12px 14px;border:1px solid #C9CBD3;border-radius:2px;background:var(--white)}
.bid-form textarea{min-height:120px;resize:vertical}
.bid-form button{font:600 14px/1 'Inter',sans-serif;letter-spacing:.04em;background:var(--red);color:var(--white);border:0;border-radius:2px;padding:16px 28px;margin-top:22px;cursor:pointer}
.bid-form button:hover{background:#A83119}

/* --- spacing utilities ---------------------------------------------------- */
.mt-32{margin-top:32px}
.mt-48{margin-top:48px}

/* --- responsive ----------------------------------------------------------- */
@media(max-width:960px){
  .card-grid,.tile-row{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr);row-gap:32px}
  .contact-grid{grid-template-columns:1fr}
}
@media(max-width:640px){
  .page-body{font-size:15px}
  .page-hero{padding:64px 0 52px}
  .crumbs{margin-bottom:26px}
  .content{padding:56px 0}
  .card-grid,.card-grid--2,.tile-row,.tile-row--3,.img-duo,.steps,.ticks{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr;gap:18px}
  .img-ph{padding:28px 24px;min-height:220px}
  .img-ph--wide{min-height:240px}
  .cta-band .wrap{flex-direction:column;align-items:flex-start}
  a.btn--red,a.btn--ghost,a.btn--ghost-ink,a.btn--on-red{width:100%;text-align:center}
  .hero-ctas{width:100%}
  .hero-ctas a{flex:1}
}

/* ==========================================================================
   AGP Construction — site chrome (top bar, nav, footer)
   Loaded alongside framework.css on every static page.
   ========================================================================== */
.skip-link{position:absolute;left:-9999px;top:0;background:var(--red);color:#fff;padding:12px 18px;z-index:100}
.skip-link:focus{left:0}

/* --- top bar -------------------------------------------------------------- */
.topbar{background:#0A0F24;color:#8A8E99;font-size:.8rem}
.topbar-in{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:9px;padding-bottom:9px;flex-wrap:wrap}
.topbar-loc{letter-spacing:.04em}
.topbar-contact{display:flex;gap:20px}
.topbar a{color:#C9CCD6}
.topbar a:hover{color:#fff}

/* --- header --------------------------------------------------------------- */
.siteheader{background:var(--ink);position:sticky;top:0;z-index:60;border-bottom:1px solid rgba(255,255,255,.09)}
.header-in{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:16px;padding-bottom:16px}
.brand{display:flex;align-items:baseline;gap:9px;flex-shrink:0}
.brand-mark{font-family:'Playfair Display',Georgia,serif;font-size:1.6rem;color:#fff;letter-spacing:.02em}
.brand-txt{font:600 .72rem/1 'Inter',sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--red-bright)}
.mainnav{margin-left:auto}
.navlist{list-style:none;display:flex;align-items:center;gap:26px}
.navlist>li>a{font:500 .88rem/1 'Inter',sans-serif;color:#E6E8EE;letter-spacing:.02em;padding:8px 0;display:inline-block}
.navlist>li>a:hover{color:var(--red-bright)}
.has-sub{position:relative}
.has-sub>a::after{content:"";display:inline-block;width:5px;height:5px;margin-left:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.subnav{list-style:none;position:absolute;top:100%;left:-18px;min-width:250px;background:var(--ink-2);border:1px solid rgba(255,255,255,.12);padding:8px 0;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .16s,transform .16s,visibility .16s}
.has-sub:hover .subnav,.has-sub:focus-within .subnav{opacity:1;visibility:visible;transform:translateY(0)}
.subnav--2col{display:grid;grid-template-columns:1fr 1fr;min-width:400px}
.subnav a{display:block;padding:10px 20px;font:400 .86rem/1.3 'Inter',sans-serif;color:#D2D5DE}
.subnav a:hover{background:rgba(255,255,255,.06);color:#fff}
.nav-cta a.btn--red{padding:12px 20px;font-size:.8rem}
.navtoggle{display:none;background:none;border:0;padding:10px;cursor:pointer}
.navtoggle span{display:block;width:24px;height:2px;background:#fff;margin:5px 0;transition:transform .2s,opacity .2s}
.navtoggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.navtoggle.is-open span:nth-child(2){opacity:0}
.navtoggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* --- footer --------------------------------------------------------------- */
.sitefooter{background:#0A0F24;color:#9BA0AC;padding:64px 0 0;font-size:.9rem}
.footer-in{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:40px;padding-bottom:48px}
.footer-brand p{margin-top:14px;max-width:330px;line-height:1.6}
.footer-nap{color:#7E838F;font-size:.85rem}
.footer-brand a{color:#C9CCD6}
.footer-brand a:hover{color:#fff}
.footer-col h3{font:600 .72rem/1 'Inter',sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--red-bright);margin-bottom:16px}
.footer-col ul{list-style:none}
.footer-col li{margin-bottom:9px}
.footer-col a{color:#9BA0AC}
.footer-col a:hover{color:#fff}
.footer-legal{display:flex;justify-content:space-between;gap:16px;padding-top:22px;padding-bottom:22px;border-top:1px solid rgba(255,255,255,.08);font-size:.8rem;color:#6E7380;flex-wrap:wrap}

@media(max-width:960px){
  .footer-in{grid-template-columns:1fr 1fr;gap:32px}
}
@media(max-width:860px){
  .navtoggle{display:block;margin-left:auto}
  .mainnav{position:absolute;top:100%;left:0;right:0;background:var(--ink);border-bottom:1px solid rgba(255,255,255,.1);max-height:0;overflow:hidden;transition:max-height .25s ease}
  .mainnav.is-open{max-height:80vh;overflow-y:auto}
  .navlist{flex-direction:column;align-items:stretch;gap:0;padding:8px 24px 24px}
  .navlist>li>a{padding:14px 0;border-bottom:1px solid rgba(255,255,255,.07)}
  .has-sub>a::after{float:right;margin-top:7px}
  .subnav{position:static;opacity:1;visibility:visible;transform:none;border:0;background:transparent;padding:0 0 8px 14px;min-width:0}
  .subnav--2col{display:block;min-width:0}
  .subnav a{padding:9px 0;font-size:.84rem}
  .nav-cta{margin-top:16px}
  .nav-cta a.btn--red{display:block;text-align:center}
}
@media(max-width:640px){
  .topbar-in{justify-content:center;text-align:center;font-size:.75rem}
  .topbar-loc{width:100%}
  .topbar-contact{gap:14px;justify-content:center}
  .footer-in{grid-template-columns:1fr}
  .footer-legal{justify-content:center;text-align:center}
}

/* ==========================================================================
   AGP Construction — static-site additions (real images, homepage blocks)
   ========================================================================== */
.ph-img{width:100%;height:340px;object-fit:cover;display:block}
.ph-img--wide{height:420px}
.img-duo{align-items:stretch}
/* fixed height: a % height inside an auto-height grid collapses to zero */
.img-duo .ph-img,.img-duo .ph-img--wide{height:320px}
/* homepage recent-work: one tall frame beside a stacked pair */
.home-work{display:grid;grid-template-columns:1.4fr 1fr;gap:24px;height:520px}
.home-work>*{min-height:0}
.home-work .ph-img,.home-work .img-ph{height:100%}
.proj-stack{display:grid;grid-template-rows:1fr 1fr;gap:24px;min-height:0}
.proj-stack>*{min-height:0}
.proj-stack .img-ph,.proj-stack .ph-img{height:100%}

/* --- homepage hero -------------------------------------------------------- */
.home-hero{padding:104px 0 96px}
.home-hero h1{font-size:clamp(2.4rem,5.4vw,4rem);max-width:900px}
.home-hero .hero-sub{font-size:1.14rem;max-width:660px}

/* --- pillar cards --------------------------------------------------------- */
.pillar-card{padding:36px 34px;display:flex;flex-direction:column}
.pillar-card h3{font-size:1.6rem;margin-bottom:6px}
.pillar-card h3 em{font-style:italic;color:var(--red)}
.pillar-tag{font:600 .7rem/1 'Inter',sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--steel);margin-bottom:18px}
.pillar-list{list-style:none;margin:22px 0 24px;border-top:1px solid var(--line)}
.pillar-list li{border-bottom:1px solid var(--line)}
.pillar-list a{display:flex;justify-content:space-between;align-items:center;padding:13px 0;font-size:.95rem;color:var(--ink)}
.pillar-list a::after{content:"→";color:var(--steel)}
.pillar-list a:hover{color:var(--red)}
.pillar-list a:hover::after{color:var(--red)}
.pillar-more{margin-top:auto;font:600 .82rem/1 'Inter',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--red);border-bottom:2px solid var(--red);padding-bottom:6px;align-self:flex-start}
.pillar-more:hover{color:var(--ink);border-color:var(--ink)}
.card .pillar-more{margin-top:18px}

/* --- metrics -------------------------------------------------------------- */
.metrics-band{padding:56px 0}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.metric{border-left:1px solid rgba(255,255,255,.14);padding-left:24px}
.metric:first-child{border-left:0;padding-left:0}
.metric-num{font-family:'Playfair Display',Georgia,serif;font-size:2.6rem;color:#fff;display:block;line-height:1}
.metric-num em{font-style:normal;color:var(--red-bright)}
.metric-label{font:500 .72rem/1.4 'Inter',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--steel);display:block;margin-top:10px}

/* --- testimonial ---------------------------------------------------------- */
.testimonial{max-width:820px;margin:0 auto;text-align:center}
.testimonial p{font-family:'Playfair Display',Georgia,serif;font-size:clamp(1.3rem,2.6vw,1.75rem);line-height:1.45;color:var(--ink)}
.testimonial p em{font-style:italic;color:var(--red)}
.testimonial p::before{content:"\201C";display:block;font-family:'Playfair Display',Georgia,serif;font-size:3rem;color:var(--red);line-height:.6;margin-bottom:18px}
.testimonial cite{display:block;margin-top:26px;font:600 .78rem/1.6 'Inter',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);font-style:normal}
.testimonial cite span{display:block;font-weight:400;letter-spacing:.1em;color:var(--steel)}
.testimonial-band .verify-note{margin:36px auto 0}

/* --- forms ---------------------------------------------------------------- */
.hidden-field{position:absolute;left:-9999px}

@media(max-width:960px){
  .metrics{grid-template-columns:repeat(2,1fr);gap:32px 24px}
  .metric:nth-child(3){border-left:0;padding-left:0}
}
@media(max-width:860px){
  .home-work{grid-template-columns:1fr;height:auto}
  .home-work .ph-img,.home-work .img-ph{height:260px}
  .proj-stack{grid-template-rows:auto auto}
}
@media(max-width:640px){
  .home-hero{padding:72px 0 64px}
  .ph-img{height:230px}
  .ph-img--wide{height:250px}
  .home-work{gap:16px}
  .home-work .ph-img,.home-work .img-ph{height:210px}
  .metrics{grid-template-columns:1fr}
  .metric{border-left:0;padding-left:0}
  .proj-stack{gap:16px}
}

/* --- FAQ accordions (native <details>, no JS) ----------------------------- */
details.faq-item{border-top:1px solid var(--line);padding:0}
details.faq-item:last-child{border-bottom:1px solid var(--line)}
details.faq-item>summary{list-style:none;cursor:pointer;display:flex;align-items:flex-start;gap:20px;padding:22px 0}
details.faq-item>summary::-webkit-details-marker{display:none}
details.faq-item>summary h3{margin:0;flex:1;transition:color .15s ease}
details.faq-item>summary::after{content:"";flex:0 0 11px;width:11px;height:11px;margin-top:5px;border-right:2px solid var(--red);border-bottom:2px solid var(--red);transform:rotate(45deg);transition:transform .2s ease}
details.faq-item[open]>summary::after{transform:rotate(-135deg);margin-top:9px}
details.faq-item>summary:hover h3{color:var(--red)}
details.faq-item>summary:focus-visible{outline:2px solid var(--red);outline-offset:4px}
details.faq-item>p{margin:0;padding:0 31px 24px 0}

/* --- owner portrait on /about/ ------------------------------------------- */
.owner-photo{max-width:340px;margin:0}
.owner-photo .ph-img{height:auto;aspect-ratio:1/1;object-fit:cover}
.owner-photo .img-ph{min-height:340px}
.owner-photo figcaption{color:var(--slate);font-size:.9rem;margin-top:12px}

/* --- careers page: prose lists, file input, application form column ------- */
.prose ul{margin:0 0 1.15em 0;padding-left:22px;list-style:disc}
.prose li{margin-bottom:.5em;line-height:1.65}
.prose li::marker{color:var(--red)}
.form-col{max-width:640px}
.bid-form input[type=file]{padding:10px 12px;background:var(--ph-bg);border:1px dashed #C9CBD3;cursor:pointer}
.bid-form input[type=file]::file-selector-button{font:600 .82rem/1 'Inter',sans-serif;margin-right:12px;padding:9px 14px;border:0;border-radius:2px;background:var(--ink);color:var(--white);cursor:pointer}
.bid-form input[type=file]::file-selector-button:hover{background:var(--red)}

/* --- brand logo (replaces the old text mark) -----------------------------
   NOTE: framework.css resets with `.page-body,.page-body *{padding:0}`, which
   is specificity (0,1,1) and therefore beats any single-class rule. That is
   why .header-in and .topbar-in padding never applied and the header sat at
   43px. These are scoped one level deeper to actually win. Root cause is the
   reset itself, left over from when this CSS was injected into Breakdance. */
.page-body .header-in{padding-top:13px;padding-bottom:13px}
.page-body .topbar-in{padding-top:8px;padding-bottom:8px}
.brand{align-items:center}
.brand-logo{display:block;height:58px;width:auto;max-width:none}
.brand-logo--footer{height:56px;margin-bottom:18px}
@media (max-width:860px){
  .brand-logo{height:44px}
  .page-body .header-in{padding-top:11px;padding-bottom:11px}
}

/* --- project gallery ------------------------------------------------------ */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.gallery .ph-img,.gallery .img-ph{width:100%;height:280px;object-fit:cover;min-height:0;margin:0}
.gallery .img-ph{align-items:center;justify-content:center;padding:20px}
@media (max-width:900px){
  .gallery{grid-template-columns:repeat(2,1fr);gap:14px}
  .gallery .ph-img,.gallery .img-ph{height:220px}
}
@media (max-width:560px){
  .gallery{grid-template-columns:1fr}
  .gallery .ph-img,.gallery .img-ph{height:240px}
}

/* --- objection block above the bid form ----------------------------------- */
.objection{border-left:3px solid var(--red);background:var(--concrete);padding:22px 24px;margin-bottom:28px}
.objection h3{font:600 1.02rem/1.4 'Inter',sans-serif;color:var(--ink);margin-bottom:8px}
.objection p{font-size:.94rem;margin:0}

/* --- WHITE HEADER --------------------------------------------------------
   The header bar is white and carries the real full-colour logo. The topbar
   stays dark navy as a thin utility strip, and the footer stays dark, so the
   footer keeps the knockout logo. Everything below re-colours the nav that
   chrome.css painted for a dark bar. */
.page-body .siteheader{background:#fff;border-bottom:1px solid var(--line);
  box-shadow:0 1px 3px rgba(15,21,48,.05)}
.page-body .navlist>li>a:not(.btn){color:var(--ink)}
.page-body .navlist>li>a:not(.btn):hover{color:var(--red)}
/* the rule above is (0,2,2) and outranks a.btn--red (0,1,1), so the red CTA
   needs its white text restated or it renders navy on red at 3.33:1 */
.page-body .navlist>li>a.btn--red{color:var(--white)}
/* dropdowns: white card instead of the dark one */
.page-body .subnav{background:#fff;border:1px solid var(--line);
  box-shadow:0 12px 28px rgba(15,21,48,.10)}
.page-body .subnav a{color:var(--slate)}
.page-body .subnav a:hover{background:var(--concrete);color:var(--red)}
/* hamburger bars have to flip too or they vanish on white */
.page-body .navtoggle span{background:var(--ink)}
@media (max-width:860px){
  .page-body .mainnav{background:#fff;border-bottom:1px solid var(--line)}
  .page-body .navlist>li>a:not(.btn){border-bottom:1px solid var(--line)}
}

/* --- owner bio beside the portrait on /about/ ----------------------------- */
.owner-grid{display:grid;grid-template-columns:340px 1fr;gap:52px;align-items:start}
.owner-grid .owner-photo{max-width:none}
.owner-grid .prose h3{margin-top:0}
@media (max-width:860px){
  .owner-grid{grid-template-columns:1fr;gap:32px}
  .owner-grid .owner-photo{max-width:340px}
}
