
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Outfit:wght@500;600;700;800&display=swap');
:root{--blue:#1474c8;--cyan:#05a3d1;--teal:#10c99a;--navy:#153957;--ink:#183b55;--muted:#52718a;--bg:#eaf5fb;--panel:#d9edf8;--line:#c5dfed}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;line-height:1.55}a{color:inherit}h1,h2,h3{font-family:Outfit,Arial,sans-serif;line-height:1.14}h1{font-size:clamp(37px,5vw,62px);margin:12px 0 18px}h2{font-size:clamp(27px,3vw,38px);margin:8px 0 16px}.container{max-width:1120px;margin:auto;padding:0 24px}.topline{height:7px;background:linear-gradient(90deg,var(--blue) 38%,var(--cyan) 38% 72%,var(--teal) 72%)}header{background:#e4f2fa;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:77px}.brand{font:700 21px Outfit,sans-serif;text-decoration:none;color:var(--blue);line-height:1.12}.brand small{display:block;font:600 11px 'DM Sans',sans-serif;letter-spacing:2px;color:var(--muted)}nav{display:flex;gap:26px}nav a{text-decoration:none;font-weight:700;font-size:14px}nav a:hover,nav a[aria-current=page]{color:var(--blue)}.menu-toggle{display:none;border:0;background:transparent;font-size:28px;cursor:pointer}.eyebrow{text-transform:uppercase;letter-spacing:2px;color:#087c95;font-size:12px;font-weight:800}.lead{font-size:18px;color:var(--muted);max-width:580px}.btn{display:inline-block;background:var(--blue);color:white;text-decoration:none;font-weight:700;border-radius:9px;padding:13px 22px}.btn:hover{background:#0c5fa9}.btn.secondary{background:#d7f0fa;color:var(--navy);border:1px solid #99cde2}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.hero{padding:64px 0 62px;background:linear-gradient(125deg,#d9eef9,#c6e6f6)}.hero-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:42px;align-items:center}.hero-visual{min-height:315px;border-radius:22px;background:linear-gradient(135deg,#1474c8,#05a3d1);position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:30px;color:white;box-shadow:0 15px 35px #1a6e9d26}.hero-visual:before{content:'';position:absolute;width:280px;height:280px;border:55px solid #ffffff30;transform:rotate(45deg);right:-100px;top:-90px}.hero-visual:after{content:'';position:absolute;width:140px;height:140px;background:var(--teal);transform:rotate(45deg);right:-75px;bottom:-75px}.hero-visual strong{font:700 30px Outfit,sans-serif;max-width:250px;position:relative;z-index:1}.hero-visual span{position:relative;z-index:1;opacity:.9}.section{padding:48px 0}.section.alt{background:#dceef8}.section-intro{color:var(--muted);max-width:670px;margin:0 0 24px}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.tile{background:#f0f9fd;border:1px solid var(--line);border-radius:15px;padding:25px;box-shadow:0 5px 16px #1247690b}.tile h3{margin:10px 0 9px;font-size:23px}.tile p{color:var(--muted);margin:0}.tile a{color:#086db7;font-weight:700;text-decoration:none}.service-icon{width:48px;height:48px;border-radius:13px;background:#c7e8f7;display:grid;place-items:center;color:#086cae;font-size:25px}.feature-strip{display:flex;gap:16px;flex-wrap:wrap;margin-top:22px}.feature-strip span{background:#c8e8f6;border-radius:100px;padding:8px 14px;font-size:13px;font-weight:700;color:#245a79}.page-heading{padding:48px 0 34px;background:linear-gradient(120deg,#cbe8f7,#e3f4fb)}.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.placeholder{min-height:210px;border:2px dashed #9dcbe1;background:#d8edf8;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#537b95;padding:22px}.placeholder svg{width:37px;height:37px;margin-bottom:10px}.contact-card{max-width:750px}.contact-line{padding:20px 0;border-bottom:1px solid var(--line)}.contact-line strong{display:block;margin-bottom:5px}.contact-line a{color:#086db7;font-size:19px;font-weight:700;overflow-wrap:anywhere}.note{font-size:14px;color:var(--muted)}.cta{background:linear-gradient(110deg,#176eaf,#0999bd);color:white;padding:42px 0}.cta h2{margin:0 0 10px}.cta p{margin:0;color:#e5f7ff}.cta .btn.secondary{background:#e3f5fc;border-color:#e3f5fc}.cta .actions{margin-top:20px}footer{background:#153957;color:#d8e9f4;padding:28px 0;font-size:14px}.footer-inner{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}footer a{color:white}.compact{padding:30px 0}.mini-link{display:inline-block;margin-top:16px}
@media(max-width:760px){.brand{font-size:17px}.menu-toggle{display:block}nav{display:none;position:absolute;top:83px;left:0;right:0;background:#e4f2fa;border-bottom:1px solid var(--line);padding:20px 24px;flex-direction:column;align-items:flex-start}nav.open{display:flex}.hero{padding:44px 0}.hero-layout{grid-template-columns:1fr;gap:26px}.hero-visual{min-height:215px}.grid,.gallery-grid{grid-template-columns:1fr}.section{padding:36px 0}.page-heading{padding:35px 0 26px}}

html{scroll-behavior:smooth}.about-teaser{display:grid;grid-template-columns:1.6fr .4fr;gap:28px;align-items:center}.about-art{min-height:145px;border-radius:18px;background:linear-gradient(135deg,#1474c8,#10c99a);display:flex;align-items:center;justify-content:center;color:white;font:800 46px Outfit,sans-serif;letter-spacing:-4px}.about-art span{color:#d7f5ff}.detail-layout{display:grid;grid-template-columns:1.4fr .8fr;gap:22px;align-items:start}.detail-main p{color:var(--muted);font-size:17px}.detail-main h2:not(:first-child){margin-top:30px}.detail-side{display:grid;gap:20px}.photo-prompt{background:#d4eaf7;border:2px dashed #9dcbe1;border-radius:17px;min-height:265px;padding:28px;display:flex;flex-direction:column;justify-content:center;text-align:center}.photo-prompt span{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}.photo-prompt strong{font:700 29px Outfit,sans-serif;margin-top:8px}.photo-prompt p{color:var(--muted)}.back-link{color:#086db7;font-weight:700;text-decoration:none}.tile .mini-link{display:inline-block;padding-top:14px}.tile:hover{border-color:#9dcbe1}@media(max-width:760px){.about-teaser,.detail-layout{grid-template-columns:1fr}.about-art{min-height:115px}}

/* Official logo integration */
.brand{display:inline-flex;align-items:center;gap:12px}.brand-mark{width:54px;height:54px;object-fit:contain;flex-shrink:0}.brand span{display:block}.hero-visual.hero-logo{padding:0;min-height:0;aspect-ratio:1;background:#0b1e33;box-shadow:0 15px 35px #1a6e9d26;display:flex;align-items:center;justify-content:center}.hero-visual.hero-logo:before,.hero-visual.hero-logo:after{display:none}.hero-logo img{display:block;width:100%;height:100%;object-fit:contain}.owner-brand{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px}.owner-brand img{display:block;width:min(100%,250px);height:auto;aspect-ratio:1;object-fit:contain}.owner-brand p{text-align:center;margin:0}@media(max-width:760px){.brand-mark{width:44px;height:44px}.brand{gap:8px}.hero-visual.hero-logo{max-width:420px;width:100%;margin:auto}}

/* Project gallery */
.gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.gallery-photo{display:block;width:100%;padding:0;border:0;border-radius:13px;overflow:hidden;cursor:zoom-in;background:#c7e3f3;box-shadow:0 5px 18px #123c5920;aspect-ratio:4/3}.gallery-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .2s}.gallery-photo:hover img{transform:scale(1.04)}.gallery-photo:focus-visible{outline:3px solid #1474c8;outline-offset:3px}.lightbox[hidden]{display:none}.lightbox{position:fixed;inset:0;background:#071b2cf2;z-index:100;display:flex;align-items:center;justify-content:center;padding:55px 65px}.lightbox-image{max-width:100%;max-height:calc(100vh - 110px);object-fit:contain;border-radius:6px}.lightbox-close,.lightbox-prev,.lightbox-next{position:absolute;border:0;color:white;background:#ffffff24;cursor:pointer;border-radius:50%;width:44px;height:44px;font-size:30px}.lightbox-close{top:12px;right:15px}.lightbox-prev{left:12px}.lightbox-next{right:12px}.lightbox-count{position:absolute;bottom:12px;color:white;font-size:13px}body.lightbox-open{overflow:hidden}@media(max-width:760px){.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.lightbox{padding:65px 10px}.lightbox-prev,.lightbox-next{bottom:12px;top:auto}.lightbox-image{max-height:calc(100vh - 140px)}}

/* v6: high-contrast button labels throughout the site */
a.btn, a.btn:visited, .btn, .btn:visited {color:#ffffff !important;text-shadow:none;}
a.btn.secondary, a.btn.secondary:visited, .btn.secondary, .btn.secondary:visited {color:#102f4a !important;}
.cta a.btn.secondary, .cta a.btn.secondary:visited {color:#102f4a !important;}
a.btn:hover, a.btn:focus-visible {filter:brightness(.94);}
a.btn:focus-visible {outline:3px solid #0b1e33;outline-offset:3px;}

/* Service-page project photography */
.service-photo{margin:0;background:#d4eaf7;border:1px solid #b5d6e7;border-radius:17px;overflow:hidden;box-shadow:0 10px 25px #164c7318}
.service-photo img{display:block;width:100%;height:360px;object-fit:cover}

@media(max-width:760px){.service-photo img{height:270px}}

/* v10: inquiry form */
.inquiry-card{max-width:900px}.inquiry-card label{display:block;font-weight:700;font-size:14px;color:#153957;margin-bottom:17px}.inquiry-card input,.inquiry-card select,.inquiry-card textarea{display:block;width:100%;margin-top:7px;padding:12px 13px;font:inherit;font-weight:400;color:#153957;background:#fff;border:1px solid #a8cddd;border-radius:9px}.inquiry-card input:focus,.inquiry-card select:focus,.inquiry-card textarea:focus{outline:2px solid #1474c8;outline-offset:1px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.form-submit{border:0;font:700 15px 'DM Sans',sans-serif;cursor:pointer}.form-submit:disabled{opacity:.55;cursor:not-allowed}.honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important}.inquiry-section{padding-top:0}@media(max-width:760px){.form-grid{grid-template-columns:1fr}}

.form-error{color:#9e2433;font-weight:700}

/* v12: cleaner footer, prominent contact form */
.footer-links{display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px}.footer-links a{text-decoration:none}.footer-links a:hover{text-decoration:underline}
.contact-main-section{padding-top:30px}.contact-layout{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.25fr);gap:22px;align-items:start}.contact-layout .contact-card,.contact-layout .inquiry-card{max-width:none;width:100%;min-width:0}.contact-layout .contact-line{padding:14px 0}.contact-layout .contact-line a{font-size:16px}.contact-layout .inquiry-card .section-intro{margin-bottom:16px}.contact-layout .form-grid{grid-template-columns:1fr 1fr}.contact-layout .tile{padding:24px}.contact-layout .contact-card h2{font-size:27px}.contact-layout .inquiry-card h2{font-size:29px}.contact-layout .actions{gap:10px}.contact-layout .actions .btn{padding:11px 14px;font-size:14px}
@media(max-width:950px){.contact-layout{grid-template-columns:1fr}.contact-layout .form-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.contact-layout .form-grid{grid-template-columns:1fr}.footer-links{gap:8px 15px}.contact-main-section{padding-top:20px}}

/* v13: softer, low-glare surfaces; preserve brand blues and accessible contrast */
:root{--bg:#e3eff5;--panel:#d8e9f1;--line:#bfd6e2;--muted:#47667c;}
body{background:var(--bg)}
header,nav{background:#dcebf3}
.section.alt{background:#d4e6ef}
.page-heading{background:linear-gradient(120deg,#c9e1ed,#deedf4)}
.hero{background:linear-gradient(125deg,#d1e7f1,#c3dfe9)}
.tile{background:#e6f1f6;border-color:#bad5e2;box-shadow:0 5px 16px #12476909}
.contact-layout .contact-card{background:#deecf3}
.contact-layout .inquiry-card{background:#dceaf2}
.inquiry-card input,.inquiry-card select,.inquiry-card textarea{background:#eef5f8;border-color:#acc9d7;color:#153957}
.inquiry-card input::placeholder,.inquiry-card textarea::placeholder{color:#617c8e}
.inquiry-card input:focus,.inquiry-card select:focus,.inquiry-card textarea:focus{background:#f4f9fb}
.btn.secondary{background:#d5eaf3;border-color:#9ac5d9}


/* v14: balanced navy + muted teal, less bright surface area */
:root{--blue:#24658f;--cyan:#247f91;--teal:#168d79;--navy:#102c43;--ink:#19384a;--muted:#4c6877;--bg:#cfdee5;--panel:#c4d7e0;--line:#a9c4d0}
body{background:var(--bg)}
header,nav{background:#142f45;border-color:#31536a}
.brand,.brand small,nav a{color:#e9f1f3}
.brand small{color:#a8c9cd}
nav a:hover,nav a[aria-current=page]{color:#5cdbc3}
.menu-toggle{color:#e9f1f3}
.topline{height:5px;background:linear-gradient(90deg,#1b5278 0 53%,#168d79 53% 100%)}
.hero{background:linear-gradient(125deg,#b8cfdc,#cfdee5)}
.page-heading{background:linear-gradient(110deg,#173b56,#24546a);color:#f1f7f8}
.page-heading .lead{color:#d3e4e9}
.page-heading .eyebrow{color:#6ee1c8}
.section.alt{background:#bdcfda}
.tile{background:#d9e6eb;border-color:#a7c4d0;box-shadow:0 6px 20px #0c293014}
.tile:hover{border-color:#529b9a}
.eyebrow{color:#08766b}
.btn{background:#195c79;color:#fff}
.btn:hover{background:#11445f}
.btn.secondary{background:#b6d9dc;border:1px solid #70aeb1;color:#123c4d}
.service-icon{background:#b2dcd7;color:#0e6e64}
.tile a,.back-link,.contact-line a{color:#126b73}
.about-art{background:linear-gradient(135deg,#153b56,#157d73)}
.cta{background:linear-gradient(110deg,#143c57,#145e68);border-top:4px solid #168d79}
.cta .btn.secondary{background:#c2e3df;border-color:#c2e3df}
footer{background:#0c2639;border-top:3px solid #168d79}
footer a:hover{color:#8ae5d0}
/* Contact: substantial dark surface alongside a calmer, tinted form */
.contact-main-section{background:#c9d9e1}
.contact-layout .contact-card{background:#173c55;color:#f2f7f8;border-color:#315b6e}
.contact-layout .contact-card h2,.contact-layout .contact-card strong{color:#f2f7f8}
.contact-layout .contact-card .contact-line{border-color:#426579}
.contact-layout .contact-card .contact-line a{color:#9ee6d8}
.contact-layout .contact-card .btn{background:#148674}
.contact-layout .contact-card .btn.secondary{background:#d2e8e8;color:#173c55!important;border-color:#d2e8e8}
.contact-layout .inquiry-card{background:#d7e4e9;border-color:#a8c2ce}
.inquiry-card input,.inquiry-card select,.inquiry-card textarea{background:#c7d9e1;border-color:#91b0bf;color:#18394d}
.inquiry-card input:focus,.inquiry-card select:focus,.inquiry-card textarea:focus{background:#e0ecef;outline-color:#168d79}
.inquiry-card .form-submit{background:#147e70}
.inquiry-card .form-submit:hover{background:#0f6259}
/* Teal accents on important interactive elements */
.hero .actions .btn:first-child{background:#147e70}
.hero .actions .btn:first-child:hover{background:#0e6257}
a.btn:focus-visible{outline-color:#168d79}
.gallery-photo:focus-visible{outline-color:#168d79}
@media(max-width:760px){nav{background:#142f45;border-color:#31536a}}

/* v15: owner portrait and mobile refinement */
.owner-portrait{margin:0;overflow:hidden;border-radius:17px;background:#173c55;border:1px solid #a7c4d0;box-shadow:0 6px 20px #0c293014}
.owner-portrait img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;object-position:center top}
.owner-portrait figcaption{padding:15px 18px;color:#f2f7f8;font:700 18px Outfit,Arial,sans-serif}
.owner-portrait figcaption span{display:block;margin-top:3px;color:#b9dcd9;font:400 13px 'DM Sans',Arial,sans-serif}
@media(max-width:760px){.owner-portrait{max-width:430px;width:100%;margin:0 auto}.footer-inner{align-items:flex-start}.footer-links{flex-wrap:wrap}}
@media(max-width:420px){.container{padding-left:17px;padding-right:17px}.brand{font-size:15px}.brand-mark{width:40px;height:40px}.actions .btn{max-width:100%}.contact-layout .tile{padding:19px}}

/* v16: clear, centered call-to-action layouts on narrow screens. Desktop unchanged. */
@media (max-width: 760px) {
  .hero .actions,
  .cta .actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    width: 100%;
  }
  .hero .actions .btn,
  .cta .actions .btn {
    display: block;
    width: 100%;
    max-width: 440px;
    text-align: center;
    margin: 0;
    padding: 15px 18px;
  }
  .cta .container { text-align: center; }
  .about-teaser > div:first-child,
  .section.alt.compact:has(a[href="gallery.html"]) > .container {
    text-align: center;
  }
  .about-teaser .section-intro,
  .section.alt.compact:has(a[href="gallery.html"]) .section-intro {
    margin-left: auto;
    margin-right: auto;
  }
  .about-teaser a.btn[href="about.html"],
  .section.alt.compact a.btn[href="gallery.html"] {
    display: block;
    width: 100%;
    max-width: 440px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 15px 18px;
  }
}
