/* ==========================================================================
   TEMPLATE LA TUA CASA — agenzia di quartiere.
   Petrolio e girasole, forme morbide, testo molto leggibile; foto a profilo di tetto.
   ========================================================================== */
.t-latuacasa {
    --bg: #ffffff; --surface: #ffffff; --soft: color-mix(in srgb, var(--c1) 9%, #fff); --ink: #1b2a2a; --muted: #536362; --line: color-mix(in srgb, var(--c1) 16%, #fff);
    --radius: 14px; --radius-lg: 24px;
    --font-head: "Bricolage Grotesque", system-ui, sans-serif; --font-body: "Atkinson Hyperlegible", system-ui, sans-serif;
    --btn-bg: var(--c2); --btn-ink: var(--c2-ink);
}
.t-latuacasa h1, .t-latuacasa h2, .t-latuacasa h3 { font-weight: 800; letter-spacing: -.015em; }
.t-latuacasa .hd { border-bottom: 0; box-shadow: 0 1px 0 var(--line); }
.t-latuacasa .logo-txt { font-weight: 800; color: var(--c1-text, var(--c1)); font-size: 24px; }
.t-latuacasa .nav a { font-weight: 700; color: var(--ink); }
.t-latuacasa .nav a:hover { background: var(--soft); }
.t-latuacasa .nav a[aria-current="page"] { background: var(--soft); color: var(--c1-text, var(--c1)); }
.t-latuacasa .hd-tel { background: var(--c1); color: var(--c1-ink); padding: 10px 16px; border-radius: 999px; font-size: 15px; }
.t-latuacasa .btn, .t-latuacasa .btn-ghost { border-radius: 999px; font-weight: 700; }

/* Hero diviso: testo e ricerca a sinistra, casa a destra */
.t-latuacasa .hero { background: var(--soft); }
.t-latuacasa .hero-in { display: grid; grid-template-columns: 1.08fr .92fr; gap: 56px; align-items: center; padding-block: 56px 64px; }
.t-latuacasa .hero h1 { font-size: clamp(40px, 5.6vw, 72px); line-height: 1.02; color: var(--c1-text, var(--c1)); margin-bottom: 16px; }
.t-latuacasa .hero-sub { font-size: 19px; max-width: 46ch; color: var(--ink); }
.t-latuacasa .search-card { background: #fff; border-radius: var(--radius-lg); padding: 20px; box-shadow: 0 18px 40px rgba(30, 90, 90, .14); margin-top: 26px; }
.t-latuacasa .search-card .search { grid-template-columns: 1fr 1fr; }
.t-latuacasa .search-card .search .btn { grid-column: 1 / -1; }
.t-latuacasa .hero-call { margin: 16px 0 0; font-size: 16px; }
.t-latuacasa .hero-call a { font-weight: 700; color: var(--c1-text, var(--c1)); }
.t-latuacasa .hero-pic img, .t-latuacasa .hero-pic .ph-empty { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.t-latuacasa .roof { clip-path: polygon(50% 0, 100% 24%, 100% 100%, 0 100%, 0 24%); border-radius: 0 0 var(--radius-lg) var(--radius-lg); }

.t-latuacasa .card-imm { border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; }
.t-latuacasa .card-media { border-radius: 0; }
.t-latuacasa .card-body { padding: 16px 18px 20px; }
.t-latuacasa .card-title { font-size: 20px; }
.t-latuacasa .card-price, .t-latuacasa .imm-price { color: var(--c1-text, var(--c1)); font-size: 21px; font-family: var(--font-head); font-weight: 800; }
.t-latuacasa .sec-title { color: var(--c1-text, var(--c1)); }
.t-latuacasa .more { color: var(--c1-text, var(--c1)); }

.t-latuacasa .sell { background: var(--c1); color: var(--c1-ink); }
.t-latuacasa .sell-in { display: grid; grid-template-columns: .9fr 1.1fr; gap: 56px; align-items: start; }
.t-latuacasa .sell h2 { font-size: clamp(32px, 4.4vw, 52px); color: var(--c1-ink); }
.t-latuacasa .sell p { font-size: 19px; opacity: .92; margin-bottom: 26px; }
.t-latuacasa .sell-steps { list-style: none; counter-reset: s; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.t-latuacasa .sell-steps li { counter-increment: s; background: color-mix(in srgb, var(--c1-ink) 8%, var(--c1)); border-radius: var(--radius-lg); padding: 22px; display: flex; flex-direction: column; gap: 6px; }
.t-latuacasa .sell-steps li::before { content: counter(s); width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--c2); color: var(--c2-ink); font: 800 18px var(--font-head); margin-bottom: 6px; }
.t-latuacasa .sell-steps strong { font: 800 20px var(--font-head); }
.t-latuacasa .sell-steps span { opacity: .88; }

.t-latuacasa .service { background: var(--soft); border-radius: var(--radius-lg); padding: 24px; }
.t-latuacasa .service h3 { color: var(--c1-text, var(--c1)); }
.t-latuacasa .visit { display: grid; grid-template-columns: .8fr 1.2fr; gap: 48px; align-items: center; }
.t-latuacasa .visit p { display: flex; gap: 10px; align-items: center; }
.t-latuacasa .visit .ic { color: var(--c1-text, var(--c1)); }
.t-latuacasa .visit-addr { font-size: 20px; font-weight: 700; }
.t-latuacasa .map { border-radius: var(--radius-lg); }
.t-latuacasa .page-head { background: var(--soft); padding-bottom: 40px; margin-bottom: 32px; max-width: none; width: 100%; padding-inline: max(16px, calc((100% - 1200px) / 2)); }
.t-latuacasa .page-head h1 { color: var(--c1-text, var(--c1)); }
.t-latuacasa .contact-box { background: var(--soft); border: 0; }
.t-latuacasa .contact-box input, .t-latuacasa .contact-box select, .t-latuacasa .contact-box textarea { background: #fff; }
.t-latuacasa .imm-price { color: var(--c1-text, var(--c1)); }
.t-latuacasa .gallery .g-item { border-radius: var(--radius); }

.t-latuacasa .ft { background: color-mix(in srgb, var(--c1) 50%, #0a1010); color: #dbe5e4; }
.t-latuacasa .ft-name { font: 800 26px var(--font-head); color: #fff; margin-bottom: 6px !important; }
.t-latuacasa .ft-slogan { color: color-mix(in srgb, var(--c2) 75%, #fff); }
.t-latuacasa .ft h2 { color: color-mix(in srgb, var(--c2) 75%, #fff); }

@media (max-width: 1080px) {
    .t-latuacasa .hero-in, .t-latuacasa .sell-in, .t-latuacasa .visit { grid-template-columns: 1fr; gap: 32px; }
    .t-latuacasa .hero-pic { max-width: 420px; }
}
@media (max-width: 680px) {
    .t-latuacasa .search-card .search, .t-latuacasa .sell-steps { grid-template-columns: 1fr; }
    .t-latuacasa .hero-pic { display: none; }
    .t-latuacasa .hd-tel { display: none; }
}
