
:root{--navy:#071f3d;--navy2:#0e3159;--gold:#cba766;--cream:#f8f7f3;--ink:#152842;--muted:#5d6a77}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:#fff}a{text-decoration:none;color:inherit}.wrap{max-width:1180px;margin:auto;padding:0 36px}.top{background:#061b35;color:#fff}.top .wrap{display:flex;align-items:center;justify-content:space-between;min-height:76px;gap:25px}.brand{display:flex;gap:13px;align-items:center}.mark{border:2px solid var(--gold);color:var(--gold);font-size:25px;width:46px;height:46px;display:grid;place-items:center;font-weight:900}.brand strong{font:700 22px Georgia,serif;letter-spacing:.5px}.brand small{display:block;font-size:9px;letter-spacing:2.2px;color:#d8c3a0;margin-top:4px}.nav{display:flex;align-items:center;gap:24px;font-size:12px;font-weight:700}.nav a:hover{color:var(--gold)}.lang{border:1px solid #53708b;border-radius:4px;padding:9px 11px}.lang a.active{color:var(--gold)}.btn{display:inline-block;background:var(--gold);color:#071d35;padding:15px 22px;border-radius:3px;font-weight:800;font-size:12px}.btn.secondary{background:transparent;border:1px solid #aebed0;color:white}.hero{background:var(--navy);color:white}.hero-grid{min-height:580px;display:grid;grid-template-columns:51% 49%;align-items:stretch}.hero-copy{padding:74px 28px 55px 0;display:flex;flex-direction:column;justify-content:center}.eyebrow{font-size:11px;font-weight:800;letter-spacing:3.4px;color:var(--gold)}h1,h2,h3,p{margin-top:0}h1{font:700 clamp(40px,5.1vw,68px)/1.07 Georgia,serif;letter-spacing:-1.6px;margin:22px 0}h1 em{font-style:normal;color:var(--gold)}.hero p{color:#d9e2ed;font-size:16px;line-height:1.7;max-width:475px}.actions{display:flex;gap:12px;margin:23px 0 36px}.trust{border-top:1px solid #31506c;padding-top:22px;display:flex;gap:20px;flex-wrap:wrap;font-size:11px;color:#dbe7f2}.trust span:before{content:'◆';color:var(--gold);margin-right:7px}.hero-photo{padding:24px 0 24px 22px;min-width:0}.hero-photo img{width:100%;height:100%;max-height:570px;object-fit:contain;display:block;background:#143e68}.photo-note{font-size:10px;color:#9db6ce;letter-spacing:1.3px;margin-top:8px}.section{padding:74px 0}.center{text-align:center}.kicker{font-size:11px;letter-spacing:3px;font-weight:800;color:#98733a;margin-bottom:12px}h2{font:700 39px/1.12 Georgia,serif;letter-spacing:-.6px;margin-bottom:15px}.lead{color:var(--muted);line-height:1.65;font-size:15px}.services{background:var(--cream)}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:38px}.service{background:white;box-shadow:0 8px 25px #081b2b0b}.service img{width:100%;height:210px;object-fit:contain;background:#e7e9e9;display:block}.service div{padding:21px}.service h3{font:700 21px Georgia,serif;margin-bottom:9px}.service p{font-size:13px;line-height:1.55;color:var(--muted);margin-bottom:0}.portfolio{background:var(--navy);color:white}.portfolio .kicker{color:var(--gold)}.portfolio .lead{color:#c6d4e0}.work-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;margin-top:32px}.work{grid-column:span 4;background:#103353;border:1px solid #244965}.work.wide{grid-column:span 6}.work img{width:100%;height:280px;object-fit:contain;background:#09253f;display:block}.work figcaption{padding:15px 17px 18px;font-weight:700;font-size:15px}.work figcaption small{display:block;color:#c1d0dd;font-weight:400;font-size:12px;margin-top:5px}.about{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.about img{width:100%;height:400px;object-fit:contain;background:#e6e6e6}.bullets{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:25px}.bullets div{border-left:3px solid var(--gold);padding-left:15px;font-size:13px;line-height:1.5}.contact{background:#092b4d;color:white;padding:60px 0}.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:70px}.contact h2{color:white}.contact p{color:#d1deea}.contact-panel{background:white;color:var(--navy);padding:30px;border-top:5px solid var(--gold)}.contact-panel a{display:block;font-weight:800;font-size:20px;margin:16px 0;overflow-wrap:anywhere}.contact-panel .btn{font-size:13px;margin-top:12px}.footer{background:#061b35;color:#d5e1ec;padding:32px 0;font-size:12px}.footer .wrap{display:flex;justify-content:space-between;gap:20px}.disclaimer{font-size:11px;color:#a9c0d3}.menu{display:none}
@media(max-width:800px){.wrap{padding:0 20px}.top .wrap{min-height:72px}.brand strong{font-size:16px}.nav{gap:10px}.nav>a:not(.lang){display:none}.menu{display:inline}.hero-grid{grid-template-columns:1fr}.hero-copy{padding:50px 0 25px}.hero-photo{padding:0 0 30px}.hero-photo img{height:480px}.service-grid{grid-template-columns:repeat(2,1fr)}.work{grid-column:span 6}.work.wide{grid-column:span 6}.about,.contact-grid{grid-template-columns:1fr;gap:30px}.footer .wrap{display:block}.footer .wrap>*{display:block;margin:8px 0}}@media(max-width:540px){h1{font-size:42px}h2{font-size:32px}.service-grid{grid-template-columns:1fr}.work,.work.wide{grid-column:span 12}.service img{height:240px}.work img{height:330px}.hero-photo img{height:440px}.actions{flex-wrap:wrap}.nav .btn{display:none}.bullets{grid-template-columns:1fr}.contact-panel a{font-size:17px}}

/* Original logo mark and photo viewer additions */
.brand-icon{width:59px;height:52px;object-fit:contain;flex-shrink:0}.brand{gap:9px}.brand strong{font-size:19px}.brand small{font-size:9px;letter-spacing:1.5px}.about-brand{margin:0 0 20px;max-width:270px}.about-brand img{width:100%;height:auto;object-fit:contain;display:block}.phone-entry{margin:14px 0}.phone-entry a{margin:3px 0 0}.phone-name{display:block;color:#627388;font-size:13px;font-weight:800}.photo-link{display:block;cursor:zoom-in}.photo-link img{transition:filter .15s}.photo-link:hover img{filter:brightness(.94)}.hero-photo .photo-link,.about>.photo-link{height:100%;min-height:0}.hero-photo .photo-link{height:calc(100% - 20px)}.about>.photo-link img{width:100%;height:400px;object-fit:contain;background:#e6e6e6}.lightbox[hidden]{display:none!important}.lightbox{position:fixed;inset:0;z-index:9999;background:rgba(2,12,25,.96);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:50px 20px 62px}.lightbox>img{max-width:100%;max-height:calc(100vh - 145px);width:auto;height:auto;object-fit:contain}.lightbox-close{position:absolute;top:8px;right:18px;color:white;background:transparent;border:0;font-size:44px;cursor:pointer}.lightbox-bottom{position:absolute;bottom:20px}.lightbox-bottom a{display:inline-block;color:#f1d5a2;border:1px solid #d5ae71;padding:9px 15px;border-radius:3px;font-weight:700;font-size:13px}.lightbox-bottom a:hover{background:#d5ae71;color:#071f3d}body.lightbox-open{overflow:hidden}@media(max-width:800px){.brand-icon{width:46px;height:44px}.brand strong{font-size:14px}.brand small{font-size:7px;letter-spacing:.8px}.about-brand{max-width:220px}.hero-photo .photo-link{height:auto}.about>.photo-link img{height:350px}}

/* The brand mark includes the original WE ARE 5HM LLC lettering. Do not duplicate the name as HTML text. */
.brand-full{display:block;width:260px;max-width:100%;height:auto;object-fit:contain}.brand{flex-shrink:0}.about-brand{max-width:320px}.about-brand img{width:100%;height:auto;object-fit:contain;background:transparent}@media(max-width:980px){.brand-full{width:205px}.top .wrap{gap:10px}.nav{gap:12px}}@media(max-width:540px){.brand-full{width:185px}}

/* Functional photo directory and mobile navigation */
.gallery-cta{margin:14px 0 4px;background:var(--gold)}
.photo-link{cursor:pointer}.photo-link:hover img{filter:brightness(.92)}
.gallery-main{background:#f8f7f3;min-height:75vh;padding:45px 0 75px}
.gallery-top{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.gallery-top .btn{flex-shrink:0}
.gallery-viewer{background:#071f3d;color:#fff;margin:25px 0 28px;padding:16px;border-radius:6px}
.gallery-viewer img{display:block;width:100%;max-height:650px;height:auto;object-fit:contain;background:#071f3d}
.gallery-tools{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:14px}
.gallery-tools button,.gallery-tools a{border:1px solid #b59a67;border-radius:4px;background:transparent;color:white;font-weight:700;padding:10px 13px;cursor:pointer;font-size:13px}
.gallery-tools button:hover,.gallery-tools a:hover{background:#cba766;color:#071f3d}
.gallery-count{color:#d9e2ed;font-size:13px}
.gallery-directory{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.gallery-tile{border:2px solid transparent;background:#fff;padding:5px;border-radius:5px;cursor:pointer;box-shadow:0 3px 15px #071f3d13}
.gallery-tile.selected{border-color:#cba766}
.gallery-tile img{display:block;width:100%;height:155px;object-fit:contain;background:#e9e9e9}
.gallery-tile span{display:block;font-size:12px;padding:7px;color:#152842}
@media(max-width:900px){.gallery-directory{grid-template-columns:repeat(3,minmax(0,1fr))}.top .wrap{flex-wrap:wrap;padding-top:12px;padding-bottom:12px}.nav{flex-wrap:wrap;justify-content:center}.nav>a:not(.lang){display:inline-block}}
@media(max-width:600px){.gallery-directory{grid-template-columns:repeat(2,minmax(0,1fr))}.gallery-tile img{height:130px}.gallery-tools{justify-content:center}.top .wrap{justify-content:center}.nav{gap:10px;font-size:11px}.nav>a:not(.lang){display:inline-block}.nav .btn{display:none}}

/* Quote request form, bilingual and Netlify Forms ready */
.contact-grid{grid-template-columns:1.1fr .9fr}
.estimate-form-wrap{grid-column:1/-1;background:#fff;color:var(--navy);border-top:5px solid var(--gold);padding:clamp(22px,4vw,42px);margin-top:8px;border-radius:3px;scroll-margin-top:30px}
.estimate-form-wrap h3{font:700 clamp(24px,3vw,32px) Georgia,serif;margin:0 0 8px}
.form-intro{color:#536475!important;margin-bottom:26px}
.estimate-form{display:grid;gap:19px}
.estimate-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.estimate-form label{display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:700;color:#203852}
.estimate-form label span{color:#9c6930}
.estimate-form input,.estimate-form select,.estimate-form textarea{width:100%;font:400 15px Arial,sans-serif;border:1px solid #b8c5d1;border-radius:4px;padding:13px 14px;color:#172d44;background:#fff}
.estimate-form input:focus,.estimate-form select:focus,.estimate-form textarea:focus{outline:2px solid #cba766;outline-offset:1px}
.estimate-form textarea{resize:vertical;min-height:115px}
.estimate-form .hidden-field{position:absolute;left:-99999px;top:auto;width:1px;height:1px;overflow:hidden}
.estimate-form .form-submit{border:0;cursor:pointer;justify-self:start;font-size:14px}
.estimate-form .form-note{font-size:12px;color:#667686!important;margin:0}
.footer a{text-decoration:underline;text-decoration-color:#cba766;text-underline-offset:4px}
@media(max-width:700px){.estimate-form .form-row{grid-template-columns:1fr}.estimate-form-wrap{padding:22px}}

/* Original job-site video */
.site-video{margin:48px 0 10px;background:#fff;padding:clamp(18px,3vw,32px);border-top:4px solid #cba766;border-radius:4px}
.site-video h2{margin:0 0 10px;color:#071f3d;font:700 28px Georgia,serif}
.site-video p{color:#40566c}
.site-video video{display:block;width:100%;max-width:460px;max-height:610px;object-fit:contain;background:#071f3d;margin:20px auto;border-radius:4px}
.site-video a{color:#143d6d;text-decoration:underline}

/* Portfolio refresh: original images always retain their proportions. */
.hero-photo img,.service img,.work img,.gallery-tile img,.gallery-viewer>img{object-fit:contain!important}
.hero-photo .photo-link{background:#0d2d4d;border:1px solid #2e5170;border-radius:6px;overflow:hidden}
.service{border-radius:7px;overflow:hidden;transition:transform .2s,box-shadow .2s}.service:hover{transform:translateY(-3px);box-shadow:0 14px 35px #081b2b18}
.work{border-radius:7px;overflow:hidden}.work img{background:#102e49}
.gallery-filterbar{display:flex;gap:9px;flex-wrap:wrap;margin:24px 0 16px}
.gallery-filterbar button{border:1px solid #bec9d2;background:white;color:#15314b;border-radius:22px;padding:10px 15px;font-weight:700;cursor:pointer;font-size:13px}
.gallery-filterbar button.active,.gallery-filterbar button:hover{background:#0c2c4b;color:white;border-color:#0c2c4b}
.gallery-tile span{font-size:12px;line-height:1.35;white-space:normal;min-height:38px;display:block}
.gallery-viewer{scroll-margin-top:15px}
@media(max-width:800px){.top .wrap{flex-wrap:wrap;padding-top:10px;padding-bottom:10px}.nav{flex-wrap:wrap;justify-content:flex-end}.hero-photo img{height:min(480px,65vh)}.gallery-filterbar{gap:7px}.gallery-filterbar button{font-size:12px;padding:8px 11px}}

/* New mobile hero: portrait tree photo beside the headline, not below the entire introduction. */
@media(max-width:800px){
 .hero-grid{display:grid;grid-template-columns:minmax(0, 1.12fr) minmax(0, .88fr);align-items:center;column-gap:12px;row-gap:0;min-height:0;padding-top:26px;padding-bottom:32px}
 .hero-copy{display:contents}
 .hero-copy .eyebrow{grid-column:1/-1;grid-row:1;margin-bottom:14px;font-size:9px;letter-spacing:1.7px}
 .hero-copy h1{grid-column:1;grid-row:2;font-size:clamp(27px,5.2vw,42px);line-height:1.11;letter-spacing:-.8px;margin:0;padding:8px 0;align-self:center}
 .hero-photo{grid-column:2;grid-row:2;padding:0;margin:0;align-self:stretch;display:flex;flex-direction:column;justify-content:center}
 .hero-photo .photo-link{height:100%;min-height:230px;display:flex;align-items:center;justify-content:center;background:transparent;border:0;border-radius:5px}
 .hero-photo img{width:100%;height:270px;max-height:290px;object-fit:contain!important;background:transparent}
 .hero-photo .photo-note{display:none}
 .hero-copy>p{grid-column:1/-1;grid-row:3;max-width:none;margin:22px 0 0;font-size:15px}
 .hero-copy .actions{grid-column:1/-1;grid-row:4;margin:20px 0 25px}
 .hero-copy .trust{grid-column:1/-1;grid-row:5;margin:0}
}
@media(max-width:430px){
 .hero-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);column-gap:9px}
 .hero-copy h1{font-size:clamp(26px,7.8vw,34px)}
 .hero-photo .photo-link{min-height:245px}
 .hero-photo img{height:255px}
 .hero-copy .actions{gap:9px}
 .hero-copy .actions .btn{font-size:11px;padding:13px 14px}
}
