/* A photograph-led portfolio with the existing Green Square identity. */
:root { --forest:#123c2e; --muted:#53645b; }
header { background-color:#fafbf6; background-image:var(--patina); background-blend-mode:normal; color:var(--forest); border-bottom:1px solid #dce5d9; }
.topbar { display:none; }
nav { height:88px; gap:18px; }
.brand small { color:#547446; letter-spacing:.09em; }
.nav-actions .btn-ghost,.menu-toggle { color:var(--forest); border-color:#b8c9bd; }
.nav-actions .btn-primary { background-color:var(--forest); color:white; }
.links { gap:15px; font-size:.875rem; }
.links.is-open { color:white; }
.hero { background:#0d291f; }
.hero::before { display:none; }
.hero-grid { min-height:600px; grid-template-columns:1fr 1fr; }
.hero-copy { padding:62px 0; max-width:570px; }
h1 { font-size:clamp(2.2rem,3.4vw,3.5rem); line-height:1.45; }
.hero-copy p { font-size:1rem; line-height:1.95; }
.hero-visual { width:100%; }
.hero-frame img { object-fit:cover; object-position:center 64%; }
.hero-frame::after { background:linear-gradient(90deg,#0b211a00 10%,#0b211a44 40%,#0b211aeb 67%,#0b211a 100%); }
[dir="ltr"] .hero-frame::after { background:linear-gradient(270deg,#0b211a00 10%,#0b211a44 40%,#0b211aeb 67%,#0b211a 100%); }
.hero-meta { margin-top:24px; padding-top:18px; }
.hero-actions { max-width:480px; }
.year-card { display:none; }
.project-tag { bottom:25px; left:28px; padding:10px 18px; }
.project-section { background-color:#fafbf6; padding:60px 0 48px; }
.section-head { margin-bottom:28px; }
.section-head h2 { font-size:clamp(1.8rem,2.6vw,2.5rem); }
.project-intro { grid-template-columns:1fr 2fr; padding-top:20px; margin-bottom:24px; }
.project-intro h3 { font-size:1.6rem; }
.project-details div { padding:12px 16px; }
.project-details small { font-size:.875rem; }
.project-filters { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:22px; }
.filter { font:inherit; font-size:.9rem; border:1px solid #d5dfd2; border-radius:5px; padding:8px 20px; background:#edf1e8; color:#304e3d; cursor:pointer; }
.filter.active { background:#174a37; border-color:#174a37; color:white; }
.project-gallery { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:none; gap:18px; }
.project-gallery figure,.project-gallery figure:first-child,.project-gallery figure:last-child { grid-column:auto; grid-row:auto; background:#eef1e8; box-shadow:none; border:1px solid #dbe2d5; }
.project-gallery figure[hidden] { display:none; }
.project-gallery img,.project-gallery figure:first-child img { aspect-ratio:4/3; height:auto; object-fit:cover; object-position:center; }
.project-gallery figure:last-child img { aspect-ratio:4/3; height:auto; object-fit:contain; background:#17382c; }
.project-gallery figcaption { padding:13px; font-weight:700; text-align:center; font-size:.9375rem; }
.quote-section { padding:0 0 64px; background:#fafbf6; }
.quote-card { padding:36px; background-color:#e7eee2; background-image:var(--patina); border:1px solid #d6e2d0; border-radius:12px; }
.quote-card .section-head { align-items:center; }
.quote-card h2 { margin-top:4px; }
.quote-card fieldset { padding:0; margin:0 0 24px; border:0; min-width:0; }
.quote-card legend { margin-bottom:12px; font-weight:bold; }
.court-options { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.court-option { display:flex; align-items:center; gap:10px; min-height:70px; padding:14px; border:1px solid #d0dccb; border-radius:7px; background:#fafbf7; cursor:pointer; font-weight:700; }
.court-option:has(input:checked) { border-color:#245a3f; background:#f1f8e8; box-shadow:inset 0 0 0 1px #245a3f; }
.court-option input { accent-color:#245a3f; width:19px; height:19px; flex-shrink:0; }
.quote-fields { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.quote-fields label { display:grid; gap:6px; font-size:.9375rem; font-weight:700; }
.quote-fields input { width:100%; min-width:0; border:1px solid #bbccba; border-radius:5px; background:#fff; color:#173d2c; padding:12px; font:inherit; font-size:1rem; min-height:48px; }
.quote-submit { width:100%; margin-top:22px; background-color:#154b37; }
.quote-note { font-size:.875rem; margin:10px 0 0; color:#4b6051; text-align:center; }
.services { border-top:1px solid #d7e3d1; padding:64px 0; }
.service { min-height:230px; }
@media (max-width:1100px) { .project-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:980px) {
.hero-copy { width:70%; }.hero-grid { min-height:580px; }.hero-frame::after { background:linear-gradient(90deg,#0b211a33,#0b211ae8 66%,#0b211a); }
.project-intro { grid-template-columns:1fr; gap:16px; }.court-options { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:680px) {
nav { height:76px; }.hero-grid { display:flex; flex-direction:column; min-height:0; gap:0; width:100%; }
.hero-copy { order:2; width:100%; max-width:none; padding:25px 18px 32px; background:#0d291f; }
.hero-visual { order:1; position:relative; inset:auto; width:100%; min-height:260px; margin:0; }
.hero-frame img { object-position:center 65%; }.hero-frame::after,[dir="ltr"] .hero-frame::after { background:linear-gradient(0deg,#0d291f,transparent 50%); }
.project-tag,[dir="ltr"] .project-tag { bottom:16px; left:18px; right:auto; }
h1 { font-size:2rem; margin:12px 0 16px; }.hero-copy p { line-height:1.9; }.hero-actions { max-width:none; gap:9px; }.hero-actions .btn { font-size:.875rem; }
.hero-meta { gap:14px; font-size:.8rem; }.project-section { padding:38px 0; }.project-gallery { gap:12px; }
.project-gallery figcaption { padding:10px 6px; font-size:.875rem; }.project-details { grid-template-columns:1fr; }
.project-filters { gap:6px; }.filter { padding:8px 12px; }.quote-section { padding-bottom:38px; }
.quote-card { padding:24px 18px; }.quote-fields { grid-template-columns:1fr; gap:14px; }.court-option { padding:12px 8px; font-size:.875rem; min-height:64px; gap:7px; }
.quote-card .section-head { margin-bottom:24px; }.quote-submit { white-space:normal; padding:12px; line-height:1.6; }
}
@media (max-width:360px) { .project-gallery { grid-template-columns:1fr; }.brand { font-size:.875rem; }.brand-logo { width:40px; height:40px; flex-basis:40px; } }

/* Category choices precede the named projects within each selection. */
.project-entry[hidden],.project-empty[hidden] { display:none; }
.project-empty { padding:32px 20px; border:1px solid #d5dfd2; border-radius:7px; background:#f0f4eb; color:#425c49; text-align:center; }
.project-filters .filter { line-height:1.6; min-height:46px; }
@media (max-width:680px) {
 .project-filters { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
 .project-filters .filter { white-space:normal; padding:10px; }
 .project-filters .filter:first-child { grid-column:1/-1; }
}

/* A direct WhatsApp action next to language selection, including on mobile. */
.header-whatsapp { display:inline-flex; align-items:center; justify-content:center; flex:0 0 46px; width:46px; height:50px; border:1px solid #b8c9bd; border-radius:6px; color:#147b3d; background:#f4faf0; }
.header-whatsapp:hover { background:#e2f5da; color:#095d2b; }
.header-whatsapp svg { display:block; flex-shrink:0; }
.nav-actions { flex-shrink:0; }
@media (max-width:680px) {
 nav .brand { min-width:0; font-size:.9rem; }
 nav .brand > span { line-height:1.45; }
 .header-whatsapp { flex-basis:44px; width:44px; }
}
@media (max-width:380px) {
 header .shell { width:calc(100% - 24px); gap:8px; }
 nav .brand { font-size:.8rem; gap:6px; }
 nav .brand-logo { width:40px; height:40px; flex-basis:40px; }
 .nav-actions { gap:5px; }
 .nav-actions .lang { min-width:44px; padding:0 7px; }
 .menu-toggle { width:44px; }
}
