*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:85px}body{margin:0;background:#f6f7fb;color:#18264b;font-family:Arial,Helvetica,sans-serif;font-size:16px;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}img{display:block;width:100%;height:100%;object-fit:cover}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #5c83ce;outline-offset:6px}.skip{position:fixed;top:-80px;background:#fff;padding:20px;z-index:100}.skip:focus{top:0}.header{height:100px;position:absolute;top:0;left:0;width:100%;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:0 5%;color:white;border-bottom:1px solid #ffffff35}.brand{font-size:29px;font-weight:800;letter-spacing:-1.5px;line-height:1}.brand span{display:block;font-size:10px;letter-spacing:3px;font-weight:400;margin-top:10px}nav{display:flex;gap:32px;align-items:center;font-size:14px}nav a:hover{opacity:.65}.nav-contact{border-bottom:1px solid #fff;padding:12px 0;margin-left:28px}.nav-contact span{margin-left:30px}.menu{display:none}.hero{height: min(960px,100svh);min-height:700px;position:relative;color:#fff;background:#14234d}.hero>img{object-position:50% 46%}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.58),rgba(0,0,0,.05)),linear-gradient(0deg,rgba(0,0,0,.65),transparent 40%,rgba(0,0,0,.25))}.hero-content{position:absolute;left:5%;right:5%;bottom:135px}.eyebrow,.section-label{font-size:12px;letter-spacing:1.6px;font-weight:500;margin:0 0 36px}.hero h1{font-size:clamp(60px,7.8vw,125px);font-weight:400;letter-spacing:-.065em;line-height:.98;margin:0 0 32px}.hero-bottom{display:flex;align-items:center;gap:100px}.hero-bottom p{font-size:22px;line-height:1.35;margin:0}.round-link{display:flex;gap:30px;align-items:center;font-size:14px}.round-link span{display:grid;place-items:center;border:1px solid #ffffff80;border-radius:50%;height:48px;width:48px;font-size:23px}.round-link:hover span{background:#fff;color:#222}.hero-caption{position:absolute;bottom:0;left:5%;right:5%;border-top:1px solid #ffffff55;height:75px;display:flex;align-items:center;justify-content:space-between;font-size:12px;letter-spacing:1px}.section{padding:110px 6%}h2{font-size:clamp(38px,4.4vw,68px);font-weight:400;letter-spacing:-.055em;line-height:1.08;margin:0}em{font-family:Georgia,'Times New Roman',serif;font-weight:400}p{line-height:1.7}.intro{display:grid;grid-template-columns:1fr 2.2fr;gap:60px}.intro>.section-label{padding-top:12px}.intro-bottom{display:flex;align-items:flex-end;gap:80px;margin-top:30px}.intro-bottom p{max-width:520px;color:#586780;margin:0}.text-link{font-size:14px;display:flex;justify-content:space-between;min-width:145px;gap:24px;padding-bottom:12px;border-bottom:1px solid}.text-link span{font-size:20px}.projects{padding-top:40px}.section-top{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:55px}.section-top .section-label{margin-bottom:20px}.small-note{font-size:14px;color:#647089}.period{color:#ed1c35}.project-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:65px 55px;align-items:start}.project-photo{height:430px;position:relative;overflow:hidden;background:#e2e7f1}.project img{transition:transform .65s}.project:hover img{transform:scale(1.035)}.project.offset{margin-top:100px}.project.offset .project-photo{height:380px}.project-meta{display:flex;align-items:center;justify-content:space-between;padding-top:20px;gap:10px}.project-meta h3{font-size:23px;font-weight:400;letter-spacing:-.6px;margin:0}.project-meta>span{font-size:10px;letter-spacing:1px;color:#647089}.project-arrow{position:absolute;right:16px;bottom:16px;width:40px;height:40px;display:grid;place-items:center;background:#f6f7fb;color:#222;font-size:23px}.wide{grid-column:1/-1}.wide .project-photo{height:390px}.wide img{object-position:50% 50%}.services{background:#101b56;color:#f6f7fb;display:grid;grid-template-columns:1fr 1.2fr;gap:100px}.service-intro{max-width:340px;color:#c3cfe8;margin-top:30px}.service-list details{border-bottom:1px solid #ffffff30;padding:24px 0}.service-list details:first-child{border-top:1px solid #ffffff30}.service-list summary{list-style:none;display:flex;align-items:center;cursor:pointer;font-size:25px;letter-spacing:-.5px}.service-list summary::-webkit-details-marker{display:none}.service-list summary span{font-size:12px;color:#bdcdef;letter-spacing:0;margin-right:30px}.service-list summary b{font-size:22px;font-weight:400;margin-left:auto}.service-list details[open] summary b{transform:rotate(45deg)}.service-list details p{color:#c3cfe8;margin:20px 35px 0 45px;font-size:15px;max-width:450px}.bucku{margin:0 6%;padding:35px 0;border-top:1px solid #dce3ef;border-bottom:1px solid #dce3ef;display:grid;grid-template-columns:1fr 2.2fr;gap:60px;align-items:center}.bucku>span{font-size:12px;letter-spacing:1px}.bucku p{margin:0;color:#586780;max-width:610px}.bucku a{color:#173777;border-bottom:1px solid #ed1c35}.contact{padding-bottom:25px}.contact-head{display:block;font-size:clamp(40px,5.8vw,90px);line-height:1.05;letter-spacing:-.05em;position:relative;padding-right:60px}.contact-head>span{position:absolute;right:0;top:0}.contact-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr .8fr;gap:40px;margin-top:95px;padding-top:45px;border-top:1px solid #dce3ef}.contact-grid h3{font-size:12px;letter-spacing:1px;font-weight:500;margin:0 0 20px}.contact-grid p,.contact-grid>div>a{font-size:14px;line-height:1.8;color:#586780;margin:0}.contact-grid .brand span{font-size:8px;letter-spacing:1.5px}.footer-bottom{margin-top:65px;padding-top:25px;border-top:1px solid #dce3ef;display:flex;justify-content:space-between;gap:20px;font-size:10px;letter-spacing:.6px;color:#647089}.detail-page .header{position:relative;background:#101b56}.detail-content{padding-top:60px}.detail-content h1{font-size:clamp(50px,7vw,100px);font-weight:400;letter-spacing:-.055em;margin:35px 0}.detail-hero{height:65vh;min-height:380px}.detail-overview{display:grid;grid-template-columns:1fr 2fr;gap:60px;padding:65px 0}.detail-overview p{max-width:620px;margin-top:0;color:#586780}.detail-gallery{display:grid;grid-template-columns:1fr 1fr;gap:25px}.detail-gallery figure{margin:0}.detail-gallery img{height:420px}.detail-gallery figcaption{padding:15px 0;font-size:14px}.detail-end{margin-top:65px;display:flex;justify-content:space-between;border-top:1px solid #ccc;padding-top:25px}.detail-end a{border-bottom:1px solid}
@media(min-width:1600px){.section{padding-left:max(6%,calc((100vw - 1450px)/2));padding-right:max(6%,calc((100vw - 1450px)/2))}}@media(max-width:800px){.header{height:80px}.brand{font-size:25px}.menu{display:flex;gap:20px;background:none;color:inherit;border:0;padding:10px;font-size:14px}nav{display:none;position:absolute;top:80px;left:0;right:0;background:#101b56;padding:25px 6%;flex-direction:column;align-items:stretch;gap:24px}nav.open{display:flex}.nav-contact{margin:0}.hero{min-height:650px;height:90svh}.hero-content{bottom:140px}.hero h1{font-size:clamp(51px,10vw,80px)}.hero-bottom{gap:35px;justify-content:space-between}.hero-bottom p{font-size:20px}.eyebrow{font-size:10px;letter-spacing:.7px}.hero-caption{font-size:9px;letter-spacing:.3px;gap:15px}.section{padding:65px 6%}.intro,.services{grid-template-columns:1fr;gap:35px}.intro-bottom{gap:25px;align-items:start;flex-direction:column}.intro .section-label{margin-bottom:0}.small-note{display:none}.project-grid{grid-template-columns:1fr;gap:35px}.project.offset{margin:0}.project-photo,.project.offset .project-photo,.wide .project-photo{height:350px}.project-meta h3{font-size:22px}.project-meta>span{font-size:10px}.services{gap:30px}.service-list summary{font-size:22px}.bucku{grid-template-columns:1fr;gap:15px}.contact-head{font-size:clamp(36px,7vw,58px);padding-right:25px}.contact-grid{grid-template-columns:1fr 1fr;gap:35px;margin-top:55px}.contact-grid>.brand{grid-column:1/-1}.footer-bottom{flex-wrap:wrap;line-height:1.5}.footer-bottom>span:nth-child(2){display:none}.detail-overview{grid-template-columns:1fr;gap:0}.detail-gallery{grid-template-columns:1fr}.detail-gallery img{height:350px}.detail-hero{min-height:300px;height:45vh}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* Original PLUSLINE logo, displayed without recoloring or cropping. */
.brand{display:block;flex-shrink:0;width:98px;height:76px;background:transparent;padding:0;line-height:0;letter-spacing:normal}.brand img{width:100%;height:100%;object-fit:contain}.contact-grid{grid-template-columns:1.2fr 1.4fr 1fr}.contact-grid .brand{width:155px;height:121px;padding:0}.bucku{margin-top:65px}@media(max-width:800px){.header .brand{width:79px;height:62px}.contact-grid{grid-template-columns:1fr 1fr}.bucku{margin-top:45px}}

.gallery-heading{display:flex;align-items:end;justify-content:space-between;gap:25px;margin:0 0 35px}.gallery-heading h2{font-size:38px}.gallery-heading p{font-size:14px;color:#586780;margin:0}.detail-gallery img{object-fit:contain;background:#edf1f8}.detail-gallery figcaption{display:flex;justify-content:space-between;gap:15px}.detail-gallery figcaption span{color:#586780;font-size:12px}@media(max-width:800px){.gallery-heading{align-items:start;flex-direction:column;gap:15px}}

/* Preserve complete photos at every screen size. */
.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.project.wide{grid-column:auto}
.project-photo,.project.offset .project-photo,.wide .project-photo{height:auto;aspect-ratio:3/4;background:#edf1f8}
.project-photo img{object-fit:contain;object-position:center}
.project:hover img{transform:none}
.detail-gallery{align-items:start}
.detail-gallery figure{min-width:0;align-self:start}
.detail-gallery figure>a{display:block}
.detail-gallery img{width:100%;height:auto;object-fit:contain;background:transparent}
.detail-hero{height:auto;min-height:0}
.detail-hero img{width:100%;height:auto;object-fit:contain}
@media(max-width:800px){.project-grid{grid-template-columns:minmax(0,1fr)}}

/* Compact project thumbnails: complete image remains visible and opens full size. */
.detail-gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 18px}
.detail-gallery figure>a{height:300px;display:grid;place-items:center;background:#edf1f8;overflow:hidden}
.detail-gallery figure img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;background:transparent}
@media(max-width:1050px){.detail-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.detail-gallery{grid-template-columns:1fr}.detail-gallery figure>a{height:260px}}

/* Selected Work cards fill their portrait frame without blank bands. */
.project-photo img{width:100%;height:100%;object-fit:cover;object-position:center}

/* Header navigation sits on the right when the logo is omitted. */
.header{justify-content:flex-end}
.footer-bottom>a{padding-bottom:4px;border-bottom:1px solid currentColor}

/* Gallery thumbnails fill the frame; the linked original remains uncropped. */
.detail-gallery figure img{width:100%;height:100%;max-width:none;max-height:none;object-fit:cover;object-position:center}

/* Deter ordinary image saving and dragging in the browser. */
img{pointer-events:none;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.detail-gallery .gallery-image{height:300px;display:grid;place-items:center;background:#edf1f8;overflow:hidden}
.detail-gallery figcaption{justify-content:flex-end}
@media(max-width:650px){.detail-gallery .gallery-image{height:260px}}

/* Arrange project photos according to their original orientation. */
.detail-gallery{grid-template-columns:repeat(12,minmax(0,1fr));align-items:start}
.detail-gallery figure{grid-column:span 4}
.detail-gallery figure.is-landscape{grid-column:span 6}
.detail-gallery .gallery-image{height:auto;aspect-ratio:1/1}
.detail-gallery figure.is-landscape .gallery-image{aspect-ratio:4/3}
.detail-gallery figure.is-portrait .gallery-image{aspect-ratio:3/4}
@media(max-width:900px){.detail-gallery figure,.detail-gallery figure.is-landscape{grid-column:span 6}}
@media(max-width:650px){.detail-gallery figure,.detail-gallery figure.is-landscape{grid-column:1/-1}}

/* Header logo is rendered solid white over dark photography. */
.header{justify-content:space-between}
.header-logo img{filter:brightness(0) invert(1)}

/* Keep the project cover compact, centred, and inside one viewport. */
.detail-hero{
  width:min(720px,100%);
  height:min(70svh,720px);
  min-height:0;
  margin-inline:auto;
  overflow:hidden;
  background:#edf1f8;
}
.detail-hero img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
@media(max-width:650px){
  .detail-hero{
    width:100%;
    height:min(58svh,520px);
  }
}

/* A calmer, compact scale for the Selected Work cards. */
.projects .project-grid{
  width:100%;
  max-width:820px;
  margin-inline:auto;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:48px 42px;
}
.projects .project.offset{margin-top:60px}
.projects .project-photo,
.projects .project.offset .project-photo,
.projects .wide .project-photo{
  width:100%;
  height:auto;
  aspect-ratio:3/4;
}
@media(max-width:800px){
  .projects .project-grid{
    max-width:440px;
    grid-template-columns:minmax(0,1fr);
    gap:36px;
  }
  .projects .project.offset{margin-top:0}
  .projects .project-photo,
  .projects .project.offset .project-photo,
  .projects .wide .project-photo{
    aspect-ratio:4/5;
    max-height:520px;
  }
}

/* Company profile download in the main navigation. */
.nav-compro{
  display:inline-flex;
  align-items:center;
  gap:14px;
  padding:0;
}
@media(max-width:800px){
  .nav-compro{
    justify-content:space-between;
    width:100%;
  }
}

/* PLUSLINE solar calculator, within the company-profile website. */
.nav-plts{display:inline-flex;align-items:center;gap:12px;border:1px solid #ffffff70;padding:10px 15px}.project-header-links{display:flex;align-items:center;gap:25px}@media(max-width:800px){.nav-plts{align-self:flex-start}.project-header-links{font-size:12px;gap:18px}}

/* PLUSLINE brand palette shared with the solar calculator. */
:root{--plusline-blue:#101b56;--plusline-red:#ed1c35}
body{background:#f6f7fb;color:#18264b}
.header{background:rgba(16,27,86,.82);border-bottom-color:#ffffff30}
.hero{background:#101b56}.hero-shade{background:linear-gradient(90deg,rgba(10,22,66,.64),rgba(10,22,66,.06)),linear-gradient(0deg,rgba(10,22,66,.72),transparent 45%,rgba(10,22,66,.2))}
.nav-contact,.nav-plts{background:#ed1c35;border:1px solid #ed1c35;color:#fff;padding:11px 16px}.nav-contact{margin-left:8px}.nav-contact span{margin-left:18px}
.header nav a:hover{opacity:1;color:#d7e3ff}.header nav .nav-contact:hover,.header nav .nav-plts:hover{background:#d71630;border-color:#d71630;color:#fff}
.section-label{color:#244886}.hero .eyebrow,.hero-caption{color:#f1f5ff}.period{color:#ed1c35}
.intro h2,.projects h2,.contact-head,.project-meta h3,.detail-content h1,.gallery-heading h2{color:#101b56}
.text-link{color:#173777;border-color:#ed1c35}.text-link span{color:#ed1c35}.round-link span{background:#ed1c35;border-color:#ed1c35;color:#fff}.round-link:hover span{background:#fff;color:#101b56}
.project-arrow{background:#ed1c35;color:#fff}.project:hover .project-arrow{background:#101b56}
.services{background:#101b56;color:#fff}.services .section-label{color:#bbcefa}.services h2{color:#fff}.service-intro,.service-list details p{color:#c3cfe8}.service-list summary span{color:#aec5f6}.service-list summary b{color:#ff586d}.service-list details{border-color:#ffffff30}
.bucku>span{color:#244886}.bucku a{color:#173777;border-color:#ed1c35}.contact-head>span{color:#ed1c35}.contact-grid h3{color:#244886}.contact-grid>div>a:hover,.footer-bottom>a:hover{color:#ed1c35}.footer-bottom>a{border-color:#b7c8e8}
.detail-page .header{background:#101b56}.detail-end a{color:#173777;border-color:#ed1c35}.project-header-links a:first-child{background:#ed1c35;color:#fff;padding:10px 15px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline-color:#5c83ce}
@media(max-width:800px){.header nav{background:#101b56}.nav-contact{margin-left:0}.nav-plts{align-self:flex-start}}

/* White buttons with PLUSLINE blue text and icons. */
.header .nav-contact,.header .nav-plts,.project-header-links a:first-child{background:#fff;border:1px solid #fff;color:#101b56}
.header nav .nav-contact:hover,.header nav .nav-plts:hover,.project-header-links a:first-child:hover{background:#f0f4fc;border-color:#f0f4fc;color:#101b56}
.round-link span,.project-arrow{background:#fff;border:1px solid #fff;color:#101b56}
.round-link:hover span,.project:hover .project-arrow{background:#f0f4fc;color:#101b56}
.menu{background:#fff;color:#101b56;border:1px solid #fff;padding:10px 14px}
.hero-shade{background:linear-gradient(90deg,rgba(10,22,66,.27),rgba(10,22,66,.015)),linear-gradient(0deg,rgba(10,22,66,.38),transparent 40%,rgba(10,22,66,.06))}
