/*
Theme Name: DC Demo and Construction
Description: Plain WordPress theme (no page builder). Content is edited with the normal WordPress editor; menus in Appearance > Menus; phone, email and address in Appearance > Customize > Business details.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.0
Text Domain: dc-theme
*/

@font-face{font-family:"Barlow Condensed";font-weight:600;src:url(fonts/barlow-condensed-latin-600-normal.ttf) format("truetype");font-display:swap}
@font-face{font-family:"Barlow Condensed";font-weight:700;src:url(fonts/barlow-condensed-latin-700-normal.ttf) format("truetype");font-display:swap}
@font-face{font-family:"Work Sans";font-weight:400;src:url(fonts/work-sans-latin-400-normal.ttf) format("truetype");font-display:swap}
@font-face{font-family:"Work Sans";font-weight:500;src:url(fonts/work-sans-latin-500-normal.ttf) format("truetype");font-display:swap}
@font-face{font-family:"Work Sans";font-weight:600;src:url(fonts/work-sans-latin-600-normal.ttf) format("truetype");font-display:swap}
:root{--teal:#0B4A47;--bronze:#A8703F;--bronze-deep:#8A5A2E;--amber:#E0A458;--tint:#F2F5F4;--sand:#F4EEE6;--white:#fff;
--s2:8px;--s3:16px;--s4:24px;--s5:32px;--s6:48px;--s7:64px;--s8:96px;
--sec:clamp(48px,7vw,96px);--col:min(1200px,92vw)}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;overflow-x:clip}body{overflow-x:clip}
body{font:400 17px/1.6 "Work Sans",system-ui,sans-serif;color:var(--teal);background:var(--white);-webkit-font-smoothing:antialiased}
h1,h2,h3,.kick,nav a,:is(.btn,.wp-block-button__link){font-family:"Barlow Condensed","Work Sans",sans-serif}
h1,h2,h3{font-weight:700;color:var(--teal)}
img{display:block;max-width:100%}
a{color:inherit}
.wrap{width:var(--col);margin-inline:auto}
:is(.btn,.wp-block-button__link){display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:10px 24px;border-radius:3px;background:var(--amber);color:var(--teal);font-weight:700;font-size:22px;line-height:1;text-decoration:none;border:2px solid var(--amber);cursor:pointer;letter-spacing:.01em;transition:transform .2s ease-out}
:is(.btn,.wp-block-button__link):hover{background:#D39A47;border-color:#D39A47}
:is(.btn.alt,.is-style-outline .wp-block-button__link){background:transparent;border-color:var(--teal)}
:is(.btn.alt,.is-style-outline .wp-block-button__link):hover{background:var(--teal);color:#fff}
:is(.btn.on-dark.alt,.is-style-outline .wp-block-button__link){border-color:#fff;color:#fff}
:is(.btn.on-dark.alt,.is-style-outline .wp-block-button__link):hover{background:#fff;color:var(--teal)}
:focus-visible{outline:3px solid var(--teal);outline-offset:2px;box-shadow:0 0 0 2px #fff}
.kick{margin-bottom:8px;font-weight:600;font-size:18px;letter-spacing:.14em;text-transform:uppercase;color:var(--bronze-deep)}
/* header */
header{position:sticky;top:0;z-index:20;background:var(--sand);border-bottom:4px solid var(--bronze)}
header .wrap{display:flex;align-items:center;gap:var(--s5);min-height:76px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font:700 26px/1 "Barlow Condensed";text-transform:uppercase;letter-spacing:.02em}
.brand img{height:48px;width:auto}
nav{display:flex;gap:var(--s5);margin-left:auto}
nav a{text-decoration:none;font-weight:600;font-size:21px}
nav a:hover{text-decoration:underline;text-decoration-color:var(--bronze);text-underline-offset:6px}
.tel{font:600 22px/1 "Barlow Condensed";text-decoration:none;white-space:nowrap}
header :is(.btn,.wp-block-button__link){min-height:46px;font-size:20px;padding:8px 20px}
/* hero */
.hero{background:var(--teal);color:#fff;padding-block:var(--sec) 0}
.hero .wrap{display:grid;grid-template-columns:1.25fr 1fr;column-gap:var(--s7);row-gap:var(--s4);align-items:end}
.hero .wrap>.kick,.hero .wrap>.photo{grid-column:1/-1}
.hero .wrap>h1{grid-column:1}.hero .wrap>.lead{grid-column:2;padding-bottom:var(--s2)}
.hero .kick{color:var(--amber)}
.hero h1{color:#fff;font-size:clamp(2.75rem,8vw,6rem);line-height:.95;text-transform:uppercase}
.hero p.lead{font-size:20px;max-width:46ch;color:#e6efee}
.hero .photo{margin-top:var(--s5);border-radius:3px 3px 0 0;overflow:hidden;aspect-ratio:21/8;border-bottom:0}
.hero .photo img{width:100%;height:100%;object-fit:cover}
.hero-bar{background:var(--sand);padding-block:var(--sec)}
.hero-bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);flex-wrap:wrap}
.hero-bar p{max-width:44ch}
.hero-bar .acts{display:flex;gap:var(--s3);flex-wrap:wrap;align-items:center}
.hero-bar :is(.btn,.wp-block-button__link){font-size:24px;min-height:56px;padding-inline:32px}
/* trust beam */
.trust{background:var(--white);padding-block:var(--sec)}
.beam{background:var(--teal);border-radius:3px;padding:var(--s4);display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s4)}
.plate{background:var(--amber);color:var(--teal);border-radius:3px;padding:var(--s5) var(--s4);text-align:center;font:700 clamp(1.8rem,3.4vw,3rem)/1 "Barlow Condensed";text-transform:uppercase;box-shadow:inset 0 0 0 3px rgba(11,74,71,.18)}
/* services */
.services{background:var(--tint);padding-block:var(--sec)}
.head{display:flex;align-items:end;justify-content:space-between;gap:var(--s5);flex-wrap:wrap;margin-bottom:var(--s6)}
.head h2{font-size:clamp(2.5rem,6vw,4.5rem);line-height:.95;text-transform:uppercase}
.head p{max-width:44ch;margin-top:var(--s3)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);align-items:end}
.card{display:flex;flex-direction:column;background:var(--teal);border-radius:3px;padding:var(--s3);text-decoration:none;color:#fff}
.card:nth-child(2){padding-top:var(--s3)}
.card img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:2px}
.card:nth-child(2) img{aspect-ratio:4/4.2}
.card .lbl{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);margin-top:var(--s3);background:var(--amber);color:var(--teal);border-radius:3px;padding:12px 16px;font:700 28px/1 "Barlow Condensed";text-transform:uppercase}
.card:hover .lbl{background:#D39A47}
.card p{margin-top:var(--s4);padding-bottom:var(--s2);color:#dbe8e7;font-size:16px;line-height:1.55;padding-inline:4px}
.more{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s4);margin-top:var(--s6)}
.more a{display:flex;justify-content:space-between;align-items:center;text-decoration:none;font:600 26px/1 "Barlow Condensed";padding:var(--s3) 0;border-bottom:4px solid var(--bronze)}
.more a span{color:var(--bronze-deep)}
.more a:hover{border-color:var(--teal)}
/* projects */
.projects{background:var(--sand);padding-block:var(--sec)}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4)}
.gallery .fig{background:#fff;border-radius:3px;overflow:hidden}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover}
.gallery .cap{padding:var(--s3) var(--s4) var(--s4);font-size:16px;line-height:1.5}
.gallery strong{display:block;font:700 24px/1.1 "Barlow Condensed";text-transform:uppercase;margin-bottom:4px}
/* steps */
.steps{padding-block:var(--sec);background:var(--white)}
.steps .stepgrid{list-style:none;padding:0;counter-reset:s;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s5)}
.steps .step{counter-increment:s;border-top:4px solid var(--bronze);padding-top:var(--s4)}
.steps .step::before{content:"0" counter(s);display:block;font:700 44px/1 "Barlow Condensed";color:var(--bronze-deep);margin-bottom:var(--s2)}
.steps h3{font-size:28px;line-height:1.1;text-transform:uppercase;margin-bottom:var(--s2)}
/* quote */
.quote{background:var(--teal);color:#fff;padding-block:var(--sec)}
.quote .wrap{display:grid;grid-template-columns:1fr 1fr;gap:var(--s7);align-items:center}
.quote h2{color:#fff;font-size:clamp(2.75rem,7vw,6rem);line-height:.95;text-transform:uppercase;margin-bottom:var(--s4)}
.quote .tel{display:inline-block;margin-top:var(--s4);font-size:38px;color:var(--amber)}.qf{background:#fff;color:var(--teal);border-radius:3px;padding:var(--s5);display:grid;gap:var(--s3);grid-template-columns:1fr 1fr}
.qf .full{grid-column:1/-1}
label{display:grid;gap:6px;font-weight:600;font-size:15px}
input,select,textarea{font:400 16px/24px "Work Sans";min-height:48px;padding:10px 14px;border:1.5px solid #6f8f8d;border-radius:3px;color:var(--teal);background:#fff;width:100%}
textarea{min-height:96px;resize:vertical}
form :is(.btn,.wp-block-button__link){width:100%;font-size:24px;min-height:56px}
.note{font-size:14px;line-height:20px}
/* footer */
footer{background:#08302e;color:#fff;padding-block:var(--s6)}
footer .wrap{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:var(--s6)}
footer h3{color:var(--amber);font-size:22px;text-transform:uppercase;margin-bottom:var(--s2)}
footer ul{list-style:none;padding:0;display:grid;gap:6px}
footer a{text-decoration:none}footer a:hover{text-decoration:underline}
footer .legal{grid-column:1/-1;border-top:1px solid #2f5c59;padding-top:var(--s3);font-size:14px;color:#c4d6d4}
.callbar{display:none}
@media (max-width:1024px){
 nav{display:none}header .tel{margin-left:auto}
 .cards{grid-template-columns:1fr 1fr}
 .cards .card:nth-child(3){grid-column:1/-1}
 .steps .stepgrid{grid-template-columns:1fr 1fr}
 .hero .wrap{grid-template-columns:1fr;row-gap:var(--s2)}.hero .photo{margin-top:var(--s3)}.hero .wrap>h1,.hero .wrap>.lead{grid-column:1}
 .quote .wrap{grid-template-columns:1fr;gap:var(--s6)}
 .more{grid-template-columns:1fr 1fr;margin-top:var(--s5)}
 footer .wrap{grid-template-columns:1fr 1fr}
}
@media (min-width:769px) and (max-width:1024px){.more{margin-top:var(--s6)}.services,.projects{padding-bottom:calc(var(--sec) + 12px)}}
@media (max-width:640px){
 body{padding-bottom:64px}
 header .tel,header :is(.btn,.wp-block-button__link){display:none}
 .brand{font-size:22px}
 .hero .photo{aspect-ratio:4/3}
 .hero .wrap{row-gap:var(--s2)}
 .beam{grid-template-columns:1fr;padding:var(--s3)}
 .plate{padding:var(--s4) var(--s3)}
 .cards,.gallery,.steps .stepgrid,.more{grid-template-columns:1fr}
 .cards .card:nth-child(3){grid-column:auto}
 .hero-bar .acts,.hero-bar :is(.btn,.wp-block-button__link){width:100%}.qf{grid-template-columns:1fr;padding:var(--s4)}
 footer .wrap{grid-template-columns:1fr}
 .callbar{display:flex;position:fixed;inset:auto 0 0 0;z-index:30;background:var(--amber);padding:8px 16px;gap:10px}
 .callbar a{flex:1;min-height:48px;display:flex;align-items:center;justify-content:center;font:700 24px/1 "Barlow Condensed";text-decoration:none;color:var(--teal);text-transform:uppercase}
 .callbar a+a{border-left:2px solid rgba(11,74,71,.35)}
}

/* stage 10 motion */
.mo .beam[data-mo=hook]:not(.mo-in) .plate{opacity:0;transform:translate3d(0,40px,0) scale(.94)}
.mo .beam .plate{transition:opacity 1.4s var(--mo-ease),transform 1.4s var(--mo-ease-settle)}
.mo .beam .plate:nth-child(2){transition-delay:300ms}.mo .beam .plate:nth-child(3){transition-delay:600ms}
.mo .cards[data-mo=hook]:not(.mo-in) .card{opacity:0;transform:translate3d(0,32px,0)}
.mo .cards .card{transition:opacity 1.4s var(--mo-ease),transform 1.4s var(--mo-ease)}
.mo .cards .card:nth-child(2){transition-delay:200ms}.mo .cards .card:nth-child(3){transition-delay:400ms}
.mo .cards .card.mo-live{transition:transform .2s var(--mo-ease)}
.card img{transition:transform .5s var(--mo-ease)}.card:hover img{transform:scale(1.04)}.card{overflow:hidden}
.mo .gallery[data-mo=hook]:not(.mo-in) figure{opacity:0;transform:translate3d(0,32px,0)}
.mo .gallery .fig{transition:opacity 1.4s var(--mo-ease),transform 1.4s var(--mo-ease)}
.mo .gallery .fig:nth-child(2){transition-delay:200ms}.mo .gallery .fig:nth-child(3){transition-delay:400ms}
.gallery img{transition:transform .5s var(--mo-ease)}.gallery .fig:hover img{transform:scale(1.04)}
.steps .step{border-top:0;position:relative}
.steps .step::after{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--bronze);transform-origin:0 50%}
.mo .steps [data-mo=hook]:not(.mo-in) li::after{transform:scaleX(0)}
.mo .steps [data-mo=hook]:not(.mo-in) li::before{opacity:0;transform:translate3d(0,20px,0)}
.mo .steps [data-mo=hook]:not(.mo-in) li h3,.mo .steps [data-mo=hook]:not(.mo-in) li p{opacity:0;transform:translate3d(0,12px,0)}
.mo .steps .step::after{transition:transform 1.4s var(--mo-ease) 200ms}
.mo .steps .step::before{transition:opacity .9s var(--mo-ease-settle) 1250ms,transform .9s var(--mo-ease-settle) 1250ms}
.mo .steps .step h3,.mo .steps .step p{transition:opacity .9s var(--mo-ease) 1250ms,transform .9s var(--mo-ease) 1250ms}
.mo .steps .step:nth-child(2)::after{transition-delay:450ms}.mo .steps .step:nth-child(2)::before,.mo .steps .step:nth-child(2) h3,.mo .steps .step:nth-child(2) p{transition-delay:1550ms}
.mo .steps .step:nth-child(3)::after{transition-delay:700ms}.mo .steps .step:nth-child(3)::before,.mo .steps .step:nth-child(3) h3,.mo .steps .step:nth-child(3) p{transition-delay:1850ms}
.mo .steps .step:nth-child(4)::after{transition-delay:950ms}.mo .steps .step:nth-child(4)::before,.mo .steps .step:nth-child(4) h3,.mo .steps .step:nth-child(4) p{transition-delay:2150ms}
@media (hover:hover) and (pointer:fine){:is(.btn,.wp-block-button__link){transition:transform .2s var(--mo-ease)}:is(.btn,.wp-block-button__link):hover{transform:translate3d(0,-2px,0)}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}:is(.btn,.wp-block-button__link){transition:none}}

/* ---- WordPress block adaptations (generated theme) ---- */
:where(.wp-block-group,.wp-block-buttons,.wp-block-image,.wp-block-heading,.wp-block-button){margin:0}
.wp-block-image img{height:auto}
.wp-block-buttons{display:flex;flex-wrap:wrap;gap:var(--s3)}
.wp-block-button__link.wp-element-button{box-shadow:none;word-break:normal}
body.admin-bar header{top:32px}
@media (max-width:782px){body.admin-bar header{top:46px}}
.wp-block-button.is-style-outline>.wp-block-button__link:not(.has-text-color){color:inherit}
.wp-block-button.is-style-outline>.wp-block-button__link:not(.has-background){background:transparent}
.wp-block-button.is-style-outline>.wp-block-button__link{border-width:2px;border-style:solid}
.qf .full{grid-column:1/-1}
.qf-msg{grid-column:1/-1;margin:0;padding:12px 14px;border-radius:3px;font-weight:600;background:#e8f3ee;border:1.5px solid #2b7a5b}
.qf-msg.err{background:#fdecec;border-color:#b3261e}
.qf .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.site-main-page{width:var(--col);margin-inline:auto;padding-block:var(--sec)}
.site-main-page h1{font-size:clamp(2rem,5vw,3.5rem);margin-bottom:var(--s4)}
.site-main-page p{margin-bottom:var(--s3)}
.site-main-page>*:where(h2,h3){margin-block:var(--s4) var(--s2)}
.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:8px;top:8px;z-index:100;background:#fff;padding:8px 12px}

/* ---- background loops (hero + process reel): video with its still as poster; JS plays it only when allowed and on screen ---- */
.bgv{position:relative;overflow:hidden}
.bgv>.wp-block-video{position:absolute;inset:0;margin:0}
.bgv>.wp-block-video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.bgv.reel{aspect-ratio:16/9;max-width:960px;margin:0 auto var(--s6);border-radius:8px}

/* DC specifics */
.hero .wrap>.photo{margin-bottom:0}
.hero .photo{margin-bottom:0}
.hero .photo img{height:100%}
.card figure{margin:0}
.card .lbl a{text-decoration:none;color:inherit}
.card .lbl::after{content:"\2197";font-size:26px}
.card .lbl{display:flex;margin-top:var(--s3);padding-bottom:12px}
.card>p:not(.lbl){margin-top:var(--s4)}
.card:hover .lbl{background:#D39A47}
.more p{display:flex;justify-content:space-between;align-items:center;font:600 26px/1 "Barlow Condensed";padding:var(--s3) 0;border-bottom:4px solid var(--bronze)}
.more p::after{content:"\2192";color:var(--bronze-deep)}
.more p a{text-decoration:none;flex:1}
.more p:hover{border-color:var(--teal)}
.gallery .fig .wp-block-image img{width:100%;aspect-ratio:4/3;object-fit:cover}
.gallery .cap{padding:var(--s3) var(--s4) var(--s4);font-size:16px;line-height:1.5}
.step h3{font-size:28px;line-height:1.1;text-transform:uppercase;margin-bottom:var(--s2)}
.plate{margin:0}
.hero-bar p{max-width:44ch}
.hero-bar .wp-block-buttons .wp-block-button__link{font-size:24px;min-height:56px;padding-inline:32px}
.head .wp-block-buttons{align-self:end}
.quote p.tel{display:inline-block}
.quote .qf{padding:var(--s5)}
.qf{background:#fff;color:var(--teal);border-radius:3px;display:grid;gap:var(--s3);grid-template-columns:1fr 1fr}
.qf label{display:grid;gap:6px;font-weight:600;font-size:15px}
.qf :is(.btn,.wp-block-button__link){width:100%;font-size:24px;min-height:56px}
@media (max-width:640px){.hero-bar .acts,.hero-bar .wp-block-button,.hero-bar .wp-block-button__link{width:100%}.qf{grid-template-columns:1fr}}
footer ul{list-style:none;padding:0;display:grid;gap:6px;margin:0}
footer p+p{margin-top:8px}
footer .menu-plain{list-style:none;padding:0}