:root { --navy:#073a63; --deep:#052e4e; --blue:#278ec7; --sky:#eaf5fb; --red:#d92732; --ink:#152b3b; --muted:#607484; --line:#d9e5ec; --white:#fff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--white); font-family:Inter,"Segoe UI",Arial,sans-serif; }
.fill-img { position:absolute; inset:0; width:100%; height:100%; }
a { color:inherit; }
button,input,select,textarea { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
.site-header { height:98px; display:grid; grid-template-columns:250px 1fr auto; align-items:center; gap:30px; padding:0 clamp(24px,5vw,78px); background:rgba(255,255,255,.97); position:relative; z-index:10; border-bottom:1px solid rgba(7,58,99,.09); }
.brand { width:225px; height:82px; display:flex; align-items:center; overflow:hidden; }
.brand img { width:100%; height:auto; }
nav { display:flex; justify-content:center; gap:clamp(18px,2.2vw,38px); }
nav a { text-decoration:none; font-size:.88rem; font-weight:750; color:var(--navy); }
nav a:hover { color:var(--blue); }
.header-cta,.primary-button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; border-radius:4px; padding:0 20px; text-decoration:none; color:white; background:var(--red); font-size:.87rem; font-weight:800; box-shadow:0 10px 24px rgba(217,39,50,.2); }
.header-cta:hover,.primary-button:hover,.submit-button:hover { background:#b91e28; transform:translateY(-1px); }
.menu-button { display:none; background:none; border:0; color:var(--navy); }
.hero { min-height:calc(100vh - 98px); position:relative; display:flex; align-items:center; overflow:hidden; }
.hero-image { object-fit:cover; object-position:center; }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(90deg,rgba(4,38,66,.94) 0%,rgba(4,38,66,.8) 35%,rgba(4,38,66,.14) 68%,rgba(4,38,66,.04) 100%); }
.hero-content { position:relative; z-index:1; width:min(690px,88vw); margin-left:clamp(24px,7vw,110px); padding:70px 0 110px; color:white; }
.kicker { margin:0 0 18px; color:var(--blue); font-size:.75rem; font-weight:850; letter-spacing:.16em; }
.hero .kicker { color:#78c7ef; }
h1,h2 { font-family:Georgia,"Times New Roman",serif; letter-spacing:-.05em; }
h1 { margin:0; font-size:clamp(3.5rem,6.4vw,6.7rem); font-weight:600; line-height:.93; }
h1 span { color:#7bc9ee; }
h2 { margin:0; color:var(--navy); font-size:clamp(2.65rem,4.6vw,5rem); font-weight:600; line-height:1.01; }
.hero-copy { width:min(590px,100%); margin:28px 0 0; font-size:clamp(1rem,1.4vw,1.22rem); line-height:1.65; color:rgba(255,255,255,.88); }
.hero-actions { display:flex; gap:13px; margin-top:32px; }
.secondary-button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; border:1px solid rgba(255,255,255,.55); border-radius:4px; padding:0 20px; text-decoration:none; color:white; font-size:.87rem; font-weight:800; backdrop-filter:blur(8px); }
.secondary-button:hover { background:rgba(255,255,255,.12); }
.hero-proof { position:absolute; z-index:1; right:clamp(24px,5vw,78px); bottom:30px; display:flex; flex-direction:column; gap:4px; border-left:3px solid var(--red); background:rgba(255,255,255,.92); color:var(--navy); padding:14px 18px; }
.hero-proof span { color:var(--muted); font-size:.78rem; }
.service-section,.steps-section { padding:110px clamp(24px,7vw,110px); }
.service-section { background:var(--sky); }
.section-heading { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(280px,.7fr); align-items:end; gap:8vw; margin-bottom:62px; }
.section-heading>p { margin:0 0 6px; color:var(--muted); line-height:1.75; max-width:580px; }
.service-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #bfd3de; border-left:1px solid #bfd3de; }
.service-grid article { position:relative; min-height:330px; padding:36px; border-right:1px solid #bfd3de; border-bottom:1px solid #bfd3de; background:rgba(255,255,255,.55); overflow:hidden; }
.service-grid article.featured { grid-column:span 2; min-height:420px; display:flex; align-items:flex-end; color:white; }
.service-grid article.featured>img { object-fit:cover; }
.service-grid article.featured:after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(4,38,66,.9),rgba(4,38,66,.05) 78%); }
.service-grid article>div { position:relative; z-index:1; }
.service-grid article span { color:var(--blue); font-weight:800; font-size:.72rem; }
.service-grid article h3 { margin:34px 0 13px; color:var(--navy); font:600 clamp(1.65rem,2.3vw,2.35rem)/1.05 Georgia,"Times New Roman",serif; }
.service-grid article.featured h3,.service-grid article.featured p,.service-grid article.featured button { color:white; }
.service-grid article p { margin:0; color:var(--muted); line-height:1.65; }
.service-grid article button,.project-copy button { margin-top:28px; padding:0; border:0; background:none; color:var(--navy); font-weight:800; cursor:pointer; }
.projects-section { padding:110px clamp(24px,7vw,110px); background:var(--deep); color:white; }
.section-heading.inverse h2,.section-heading.inverse>p { color:white; }
.section-heading.inverse>p { color:#bdd2df; }
.project-gallery { display:grid; gap:34px; }
.project-pair { overflow:hidden; border:1px solid rgba(255,255,255,.14); background:#0b3553; box-shadow:0 20px 55px rgba(0,0,0,.18); }
.pair-images { display:grid; grid-template-columns:1fr 1fr; gap:3px; background:rgba(255,255,255,.22); }
.pair-images figure { position:relative; min-height:clamp(360px,48vw,650px); margin:0; overflow:hidden; background:#80909a; }
.pair-images img { width:100%; height:100%; object-fit:cover; }
.pair-images figcaption { position:absolute; z-index:2; top:20px; left:20px; padding:9px 14px; background:rgba(4,38,66,.88); color:white; font-size:.8rem; font-weight:850; letter-spacing:.09em; text-transform:uppercase; box-shadow:0 5px 18px rgba(0,0,0,.22); }
.project-copy { display:flex; justify-content:space-between; align-items:center; gap:30px; padding:24px 28px; }
.project-copy>div { display:flex; flex-direction:column; gap:6px; }.project-copy span { color:#9fb8c8; font-size:.82rem; }.project-copy button { color:white; margin:0; }
.about-section { display:grid; grid-template-columns:1fr 1fr; min-height:760px; }
.about-image { position:relative; min-height:620px; }.about-image img { object-fit:cover; }
.about-copy { padding:110px clamp(30px,7vw,105px); display:flex; flex-direction:column; justify-content:center; }
.about-copy>p:not(.kicker) { color:var(--muted); line-height:1.75; margin:28px 0 0; }
.team-placeholder { margin-top:42px; padding:25px; border:1px dashed #abc5d3; background:var(--sky); }
.team-placeholder span { color:var(--navy); font-weight:800; }.team-placeholder p { margin:5px 0 0; color:var(--muted); font-size:.85rem; }
.steps-section { background:#f9fbfc; text-align:center; }
.steps-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:54px; background:var(--line); border:1px solid var(--line); text-align:left; }
.steps-grid article { padding:42px; background:white; }.steps-grid span { display:grid; place-items:center; width:42px; height:42px; border-radius:50%; color:white; background:var(--navy); font-weight:800; }
.steps-grid h3 { margin:27px 0 10px; color:var(--navy); font-size:1.18rem; }.steps-grid p { margin:0; color:var(--muted); line-height:1.65; }
.inquiry-section { padding:110px clamp(24px,7vw,110px); background:var(--sky); }
.inquiry-form { display:grid; grid-template-columns:minmax(270px,.66fr) minmax(0,1.34fr); gap:8vw; }
.form-heading>p:last-child { color:var(--muted); line-height:1.7; margin-top:25px; }
.form-fields { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.form-fields label { display:flex; flex-direction:column; gap:8px; color:var(--navy); font-size:.82rem; font-weight:750; }
.form-fields .full { grid-column:1/-1; }
.form-fields input,.form-fields select,.form-fields textarea { width:100%; min-height:50px; border:1px solid #b8ccd7; border-radius:3px; background:white; padding:13px 14px; color:var(--ink); outline:none; }
.form-fields textarea { resize:vertical; }.form-fields input:focus,.form-fields select:focus,.form-fields textarea:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(39,142,199,.13); }
.upload-box { position:relative; min-height:128px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px; border:2px dashed #8eb8cc; border-radius:4px; background:rgba(255,255,255,.65); text-align:center; cursor:pointer; }
.upload-box small { color:var(--muted); font-weight:500; }.upload-box input { position:absolute; inset:0; opacity:0; cursor:pointer; }
.file-previews { display:flex; gap:10px; flex-wrap:wrap; }.file-previews div { position:relative; width:120px; height:90px; }.file-previews img { width:100%; height:100%; object-fit:cover; border-radius:3px; }
.file-previews button { position:absolute; right:-7px; top:-7px; width:25px; height:25px; border:0; border-radius:50%; background:var(--red); color:white; cursor:pointer; }
.form-note { margin:0; color:var(--muted); font-size:.8rem; line-height:1.55; }
.submit-button { min-height:55px; border:0; border-radius:4px; background:var(--red); color:white; font-weight:850; cursor:pointer; transition:.2s; }
.submit-button:disabled { opacity:.62; cursor:wait; }.form-message { margin:0; padding:14px; background:white; border-left:3px solid var(--blue); color:var(--navy); }.form-message.error { border-color:var(--red); color:#8e1720; }
.honey { position:absolute!important; left:-9999px!important; width:1px!important; height:1px!important; overflow:hidden!important; }
.contact-section { display:grid; grid-template-columns:1fr 1fr; gap:8vw; padding:110px clamp(24px,7vw,110px); background:var(--navy); color:white; }
.contact-section h2 { color:white; }.contact-section address { display:flex; flex-direction:column; align-items:flex-start; gap:17px; font-style:normal; font-size:1.05rem; }
.contact-section address strong { font-size:1.35rem; }.contact-section address span { color:#bed4e0; line-height:1.7; }.contact-section address a { text-decoration:none; font-weight:750; }.contact-section .route-link { margin-top:7px; color:#7bc9ee; }
footer { position:relative; display:grid; grid-template-columns:1.8fr 1fr 1fr; gap:60px; padding:72px clamp(24px,7vw,110px) 105px; background:#f8fafb; }
.footer-brand img { width:240px; height:auto; }.footer-brand p { max-width:440px; color:var(--muted); font-size:.82rem; }
footer>div:not(.footer-brand) { display:flex; flex-direction:column; align-items:flex-start; gap:11px; } footer strong { color:var(--navy); margin-bottom:7px; } footer a { text-decoration:none; color:var(--muted); font-size:.87rem; } footer small { color:#8799a5; line-height:1.5; }
.copyright { position:absolute; left:clamp(24px,7vw,110px); bottom:30px; margin:0; color:#8799a5; font-size:.75rem; }
.mobile-cta { display:none; }
.legal-page { min-height:100vh; max-width:850px; margin:auto; padding:80px 28px; }.legal-page>a { color:var(--blue); font-weight:800; }.legal-page h1 { margin:50px 0 25px; color:var(--navy); font-size:clamp(3rem,7vw,5.2rem); }.legal-page h2 { margin:38px 0 14px; font-family:Inter,"Segoe UI",Arial,sans-serif; font-size:1.25rem; letter-spacing:0; }.legal-page p,.legal-page address { color:var(--muted); line-height:1.75; font-style:normal; }.legal-note { padding:18px; background:#fff4f4; border-left:3px solid var(--red); }

@media (max-width:1020px) {
  .site-header { height:82px; grid-template-columns:190px 1fr auto; padding-inline:20px; }.brand { width:180px; height:70px; }.site-header nav { gap:16px; }.header-cta { display:none; }
  .hero { min-height:calc(100svh - 82px); }.hero-content { margin-left:7vw; }
  .service-grid { grid-template-columns:1fr 1fr; }.service-grid article.featured { grid-column:span 2; }
}
@media (max-width:780px) {
  .site-header { grid-template-columns:1fr auto; height:76px; padding-inline:16px; }.brand { width:166px; }.menu-button { display:flex; flex-direction:column; align-items:center; gap:4px; cursor:pointer; }.menu-button span { width:24px; height:2px; background:var(--navy); }.menu-button b { font-size:.62rem; margin-top:1px; }
  .site-header nav { display:none; position:absolute; top:76px; left:0; right:0; flex-direction:column; padding:25px; background:white; box-shadow:0 12px 20px rgba(7,58,99,.12); }.site-header nav.open { display:flex; }
  .section-heading,.about-section,.inquiry-form,.contact-section { grid-template-columns:1fr; }.section-heading { gap:25px; }.about-image { min-height:520px; }.about-copy { padding:80px 24px; }
  .steps-grid { grid-template-columns:1fr; }.steps-grid article { padding:30px; }
  footer { grid-template-columns:1fr 1fr; }.footer-brand { grid-column:1/-1; }
}
@media (max-width:620px) {
  body { padding-bottom:66px; }.hero { min-height:720px; align-items:flex-end; }.hero-image { object-position:63% center; }.hero-overlay { background:linear-gradient(0deg,rgba(4,38,66,.97) 0%,rgba(4,38,66,.77) 52%,rgba(4,38,66,.1) 100%); }.hero-content { width:auto; margin:0; padding:230px 20px 130px; }
  h1 { font-size:clamp(3.05rem,14vw,4.55rem); }.hero-copy { font-size:1rem; }.hero-actions { flex-direction:column; align-items:stretch; }.hero-proof { left:20px; right:20px; bottom:22px; }
  .service-section,.projects-section,.steps-section,.inquiry-section,.contact-section { padding:78px 20px; }.service-grid { grid-template-columns:1fr; }.service-grid article,.service-grid article.featured { grid-column:auto; min-height:310px; padding:28px; }.service-grid article.featured { min-height:390px; }
  .pair-images { grid-template-columns:1fr; }.pair-images figure { min-height:520px; }.project-copy { align-items:flex-start; flex-direction:column; }.about-image { min-height:420px; }.form-fields { grid-template-columns:1fr; }.form-fields label,.form-fields .full { grid-column:1; }
  footer { grid-template-columns:1fr; padding:65px 20px 110px; } .footer-brand { grid-column:auto; }.copyright { left:20px; }
  .mobile-cta { position:fixed; z-index:20; left:12px; right:12px; bottom:10px; display:flex; align-items:center; justify-content:center; min-height:50px; border-radius:5px; background:var(--red); color:white; text-decoration:none; font-size:.9rem; font-weight:850; box-shadow:0 10px 30px rgba(7,58,99,.28); }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none!important; } }

/* Floating WhatsApp contact: 70% transparent background, readable foreground. */
.whatsapp-contact{position:fixed;right:20px;bottom:20px;z-index:40;max-width:calc(100vw - 32px);border:1px solid rgba(255,255,255,.65);border-radius:14px;background:rgba(37,211,102,.30);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 6px 24px rgba(4,38,66,.15);color:#052e20}
.whatsapp-contact a{display:flex;align-items:center;gap:12px;padding:13px 18px;color:inherit;text-decoration:none}
.whatsapp-contact svg{flex:none}.whatsapp-contact strong,.whatsapp-contact small{display:block}.whatsapp-contact strong{font-size:14px;line-height:1.4}.whatsapp-contact small{font-size:13px;line-height:1.5}.whatsapp-contact a:focus-visible{outline:3px solid #073a63;outline-offset:4px;border-radius:14px}
@media(max-width:600px){.whatsapp-contact{right:12px;bottom:calc(76px + env(safe-area-inset-bottom,0px))}.whatsapp-contact a{padding:10px 14px}}
/* Executed work: authentic source photos shown through clean photo-only windows. */
.works-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}.work-card{overflow:hidden;background:#fff;color:var(--ink);border-radius:8px}.work-pair{display:grid;grid-template-columns:1fr 1fr;gap:3px;background:#fff;align-items:start}.work-pair figure{position:relative;margin:0;min-width:0}.work-photo{position:relative;overflow:hidden;background:#dce6ea;width:100%}.work-photo img{position:absolute;max-width:none;object-fit:fill}.work-pair figcaption{position:absolute;left:10px;bottom:10px;padding:6px 10px;border-radius:4px;background:rgba(5,46,78,.9);color:white;font-size:.78rem;font-weight:750}.work-pair figure+figure figcaption{background:#fff;color:var(--navy)}.work-copy{padding:24px}.work-copy p{margin:0 0 8px;font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.work-copy h3{margin:0 0 18px;font-size:1.3rem}.work-copy button{border:0;background:none;color:var(--navy);padding:0;font-weight:750;cursor:pointer;text-align:left}.works-more{margin-top:30px;border:1px solid #52718a;border-radius:8px;padding:22px}.works-more summary{cursor:pointer;font-size:1.1rem;font-weight:750;color:white}.works-more summary span{display:inline-block;margin-left:12px;color:#aed2e7;font-size:.8rem;font-weight:400}.works-more[open] summary{margin-bottom:26px}.work-intro{color:#d1e1ec}.work-insights{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.work-insights figure{margin:0;color:white}.work-insights figcaption{padding:12px 0;font-size:.88rem}.works-more summary:focus-visible,.work-copy button:focus-visible{outline:3px solid #278ec7;outline-offset:5px}
@media(max-width:780px){.works-grid{grid-template-columns:1fr;gap:24px}.work-insights{grid-template-columns:repeat(2,minmax(0,1fr))}.works-more{padding:16px}.work-copy{padding:20px}.works-more summary span{display:block;margin:8px 0 0}}
.works-grid{align-items:start}
