:root {
    --ci-navy: #0b3158;
    --ci-sea: #087e9d;
    --ci-green: #3f7051;
    --ci-sand: #f5f0e7;
    --ci-coral: #c95f45;
    --ci-ink: #14273d;
    --ci-muted: #607083;
    --ci-line: #dce5ec;
    --ci-radius-sm: .75rem;
    --ci-radius-md: 1.15rem;
    --ci-radius-lg: 1.75rem;
    --ci-shadow-sm: 0 8px 24px rgba(11, 49, 88, .07);
    --ci-shadow-md: 0 18px 46px rgba(11, 49, 88, .13);
}

html { scroll-behavior: smooth; }
body { color: var(--ci-ink); background: #fff; }
a, button, input, select, textarea { outline-offset: 3px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
    outline: 3px solid rgba(8, 126, 157, .45) !important;
}
.btn { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; font-weight: 700; }
.btn-sm { min-height: 38px; }
.form-control, .form-select { min-height: 48px; border-radius: var(--ci-radius-sm); border-color: #cbd8e3; }
.form-control:focus, .form-select:focus { border-color: var(--ci-sea); box-shadow: 0 0 0 .2rem rgba(8, 126, 157, .14); }
.badge { border-radius: 999px; }
.ci-section { padding: clamp(3.5rem, 7vw, 6rem) 0; }
.ci-section--soft { background: #f7fafc; }
.ci-section--sand { background: var(--ci-sand); }
.ci-kicker { color: var(--ci-sea); font-size: .78rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.ci-section-heading { max-width: 760px; margin-bottom: 2rem; }
.ci-section-heading h2 { color: var(--ci-navy); font-size: clamp(1.8rem, 3vw, 2.65rem); }
.ci-panel { background: #fff; border: 1px solid var(--ci-line); border-radius: var(--ci-radius-lg); box-shadow: var(--ci-shadow-sm); }
.ci-icon {
    width: 2.9rem; height: 2.9rem; display: inline-grid; place-items: center; border-radius: 50%;
    background: rgba(8, 126, 157, .1); color: var(--ci-sea); flex: 0 0 auto;
}
.ci-icon svg { width: 1.45rem; height: 1.45rem; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }

/* Home hero */
.ci-home-hero {
    position: relative; min-height: 560px; display: flex; align-items: center; isolation: isolate; overflow: hidden;
    background: #123a5c url("/Assets/Brand/cilento-hero.jpg") center 52% / cover no-repeat;
    background-image: url("/Assets/Brand/cilento-hero.webp");
}
.ci-home-hero::before {
    content: ""; position: absolute; inset: 0; z-index: -1;
    background: linear-gradient(90deg, rgba(4, 24, 43, .86) 0%, rgba(4, 30, 51, .63) 48%, rgba(4, 30, 51, .3) 100%);
}
.ci-home-hero__inner { width: 100%; padding: clamp(5rem, 11vw, 8rem) 0 8.5rem; }
.ci-home-hero__copy { max-width: 720px; color: #fff; text-shadow: 0 2px 18px rgba(0,0,0,.25); }
.ci-home-hero__copy h1 { color: #fff; font-size: clamp(2.35rem, 5vw, 4.5rem); line-height: 1.02; letter-spacing: -.035em; }
.ci-home-hero__copy p { max-width: 650px; font-size: clamp(1.08rem, 2vw, 1.35rem); }
.ci-home-search {
    position: relative; z-index: 4; max-width: 1120px; margin: -5.2rem auto 0; padding: 1.25rem;
    background: rgba(255,255,255,.97); border: 1px solid rgba(255,255,255,.8); border-radius: var(--ci-radius-lg);
    box-shadow: 0 24px 60px rgba(7, 34, 58, .24); backdrop-filter: blur(12px);
}
.ci-home-search__grid { display: grid; grid-template-columns: 1.3fr 1fr auto auto; gap: .8rem; align-items: end; }
.ci-home-search label { color: var(--ci-navy); font-weight: 700; font-size: .9rem; }

/* Visual categories */
.ci-category-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.1rem; }
.ci-category-card {
    position: relative; min-height: 230px; overflow: hidden; isolation: isolate; display: flex; align-items: end;
    padding: 1.35rem; color: #fff; text-decoration: none; border-radius: var(--ci-radius-md);
    background: #183b67 url("/Assets/Brand/cilento-hero.jpg") center / cover no-repeat; background-image:url("/Assets/Brand/cilento-hero.webp"); box-shadow: var(--ci-shadow-sm);
    transition: transform .2s ease, box-shadow .2s ease;
}
.ci-category-card::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(4,25,45,.06),rgba(4,25,45,.9)); }
.ci-category-card:nth-child(2) { background-position: 25% 55%; }
.ci-category-card:nth-child(3) { background-position: 62% 55%; }
.ci-category-card:nth-child(4) { background-position: 82% 55%; }
.ci-category-card:nth-child(5) { background-position: 42% 55%; }
.ci-category-card:nth-child(6) { background-position: 95% 55%; }
.ci-category-card:hover { color:#fff; transform:translateY(-4px); box-shadow:var(--ci-shadow-md); }
.ci-category-card__content { position: relative; z-index: 1; }
.ci-category-card h3 { color:#fff; font-size:1.25rem; margin:.8rem 0 .35rem; }
.ci-category-card p { margin:0; color:rgba(255,255,255,.9); font-size:.94rem; }
.ci-category-card .ci-icon { background:rgba(255,255,255,.92); color:var(--ci-navy); }

/* Map */
.ci-map-shell { overflow:hidden; background:#fff; border:1px solid var(--ci-line); border-radius:var(--ci-radius-lg); box-shadow:var(--ci-shadow-md); }
.ci-map-toolbar { display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; padding:1rem 1.1rem; border-bottom:1px solid var(--ci-line); }
.ci-map-pills { display:flex; gap:.5rem; flex-wrap:wrap; }
.ci-map-pill { min-height:38px; padding:.45rem .85rem; border:1px solid #c9d8e4; border-radius:999px; color:var(--ci-navy); background:#fff; text-decoration:none; font-weight:700; font-size:.86rem; }
.ci-map-pill:hover { background:#eef7f8; color:var(--ci-sea); }
.ci-map-frame { display:block; width:100%; min-height:520px; border:0; background:linear-gradient(90deg,#eef3f6 25%,#f8fafb 37%,#eef3f6 63%); background-size:400% 100%; }

/* Editorial cards */
.ci-today-grid { display:grid; grid-template-columns:1.3fr .85fr .85fr; grid-auto-flow:row; gap:1rem; }
.ci-story-card { overflow:hidden; display:flex; flex-direction:column; min-width:0; background:#fff; border:1px solid var(--ci-line); border-radius:var(--ci-radius-md); box-shadow:var(--ci-shadow-sm); }
.ci-story-card:first-child { grid-row:span 2; }
.ci-story-card__image, .ci-story-card img { width:100%; height:190px; object-fit:cover; background:linear-gradient(135deg,#dbeaf0,#f4eee2); }
.ci-story-card:first-child .ci-story-card__image, .ci-story-card:first-child img { height:320px; }
.ci-story-card__body { padding:1.2rem; display:flex; flex-direction:column; flex:1; }
.ci-story-card h3 { color:var(--ci-navy); font-size:1.14rem; }
.ci-story-card:first-child h3 { font-size:1.5rem; }
.ci-story-card p { color:var(--ci-muted); }
.ci-story-card__meta { color:var(--ci-sea); font-size:.8rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }

/* Localities */
.ci-locality-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; }
.ci-locality-card {
    position:relative; min-height:245px; overflow:hidden; isolation:isolate; display:flex; align-items:end; padding:1.2rem;
    color:#fff; text-decoration:none; border-radius:var(--ci-radius-md); background:#173b5d url("/Assets/Brand/cilento-hero.jpg") center/cover no-repeat;background-image:url("/Assets/Brand/cilento-hero.webp");
    box-shadow:var(--ci-shadow-sm); transition:transform .2s ease,box-shadow .2s ease;
}
.ci-locality-card::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(3,24,42,.08),rgba(3,24,42,.88)); }
.ci-locality-card:nth-child(2n){background-position:28% 50%}.ci-locality-card:nth-child(3n){background-position:68% 50%}.ci-locality-card:nth-child(4n){background-position:88% 50%}
.ci-locality-card:hover { color:#fff; transform:translateY(-3px); box-shadow:var(--ci-shadow-md); }
.ci-locality-card h3 { color:#fff; font-size:1.2rem; margin:0 0 .3rem; }
.ci-locality-card p { color:rgba(255,255,255,.86); margin:0; font-size:.88rem; }

/* Request and partner */
.ci-request-card { padding:clamp(1.5rem,4vw,2.6rem); display:grid; grid-template-columns:auto 1fr auto; gap:1.4rem; align-items:center; background:linear-gradient(135deg,#eef8f6,#fff); }
.ci-partner { overflow:hidden; display:grid; grid-template-columns:1.15fr .85fr; background:var(--ci-navy); color:#fff; border-radius:var(--ci-radius-lg); box-shadow:var(--ci-shadow-md); }
.ci-partner__copy { padding:clamp(2rem,5vw,4rem); }
.ci-partner__copy h2,.ci-partner__copy p { color:#fff; }
.ci-partner__media { min-height:340px; background:url("/Uploads/sponsor/offerte/acb9d6c71ffb4cda83997157308b6c2b.jpg") center/cover no-repeat; }

/* Transport */
.ci-transport-hero, .ci-search-hero { background:linear-gradient(135deg,#eef7f8,#f8f3ea); }
.transport-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.transport-card {
    position:relative; overflow:hidden; padding:1.5rem; height:100%; background:#fff; border:1px solid var(--ci-line);
    border-radius:var(--ci-radius-md); box-shadow:var(--ci-shadow-sm); transition:transform .2s ease,box-shadow .2s ease;
}
.transport-card:hover { transform:translateY(-3px); box-shadow:var(--ci-shadow-md); }
.transport-card::before { content:""; position:absolute; top:0; left:0; right:0; height:5px; background:var(--ci-sea); }
.transport-card:nth-child(2)::before { background:var(--ci-green); }
.transport-card:nth-child(3)::before { background:var(--ci-coral); }
.transport-card ul { list-style:none; padding:0; display:grid; gap:.7rem; }
.transport-card li { position:relative; padding-left:1.35rem; }
.transport-card li::before { content:""; position:absolute; left:0; top:.55em; width:.48rem; height:.48rem; border-radius:50%; background:currentColor; opacity:.35; }
.transport-map, .home-map-frame { border-radius:0; }

/* Search */
.search-card, .search-result-card { background:#fff; border:1px solid var(--ci-line); border-radius:var(--ci-radius-md); box-shadow:var(--ci-shadow-sm); }
.search-toolbar { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:1rem; }
.search-view-switch { display:inline-flex; padding:.25rem; background:#edf3f6; border-radius:999px; }
.search-view-switch button { min-height:38px; border:0; border-radius:999px; padding:.4rem .9rem; background:transparent; color:var(--ci-muted); font-weight:700; }
.search-view-switch button.active { background:#fff; color:var(--ci-navy); box-shadow:0 3px 12px rgba(11,49,88,.1); }
.search-result-card { overflow:hidden; transition:transform .2s ease,box-shadow .2s ease; }
.search-result-card:hover { transform:translateY(-2px); box-shadow:var(--ci-shadow-md); }
.search-result-card__media { height:150px; background:linear-gradient(135deg,#dcecf0,#f4eee2); display:grid; place-items:center; color:var(--ci-navy); }
.search-result-card__body { padding:1.2rem; }

/* SEO municipality and POI templates */
.seo-landing-page { max-width:1180px; }
.ci-landing-hero { position:relative; overflow:hidden; border-radius:var(--ci-radius-lg); background:linear-gradient(135deg,#eff7f8,#f6f1e8); box-shadow:var(--ci-shadow-sm); }
.ci-landing-hero--visual { min-height:430px; color:#fff; background:#173b5d url("/Assets/Brand/cilento-hero.jpg") center/cover no-repeat;background-image:url("/Assets/Brand/cilento-hero.webp"); }
.ci-landing-hero--visual::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(3,25,44,.86),rgba(3,25,44,.25)); }
.ci-landing-hero--visual > .row { position:relative; z-index:1; min-height:430px; }
.ci-landing-hero--visual h1,.ci-landing-hero--visual p { color:#fff!important; }
.seo-landing-page .cs-panel { border-radius:var(--ci-radius-md); border-color:var(--ci-line); box-shadow:var(--ci-shadow-sm); }
.seo-landing-page .article-cover img { width:100%; min-height:320px; object-fit:cover; border-radius:var(--ci-radius-md)!important; }
.seo-landing-page .article-body { max-width:780px; margin:auto; }
.ci-mobile-actions { display:none; }

@media (max-width: 1199.98px) {
    .ci-locality-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width: 991.98px) {
    .ci-home-hero { min-height:480px; }
    .ci-home-search__grid { grid-template-columns:1fr 1fr; }
    .ci-category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .ci-today-grid { grid-template-columns:1fr 1fr; }
    .ci-story-card:first-child { grid-column:1/-1; grid-row:auto; }
    .ci-locality-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .ci-partner { grid-template-columns:1fr; }
    .ci-partner__media { min-height:270px; }
    .transport-grid { grid-template-columns:1fr; }
}
@media (max-width: 767.98px) {
    .ci-section { padding:3.5rem 0; }
    .ci-home-hero { min-height:70vh; align-items:flex-end; background-position:58% center; }
    .ci-home-hero__inner { padding:5.5rem 0 7.5rem; }
    .ci-home-search { margin-top:-4.5rem; padding:1rem; }
    .ci-home-search__grid { grid-template-columns:1fr; }
    .ci-home-search .btn { width:100%; }
    .ci-category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }
    .ci-category-card { min-height:210px; padding:1rem; }
    .ci-category-card p { font-size:.82rem; }
    .ci-map-toolbar { align-items:flex-start; }
    .ci-map-frame { min-height:60vh; }
    .ci-today-grid { grid-template-columns:1fr; }
    .ci-story-card:first-child { grid-column:auto; }
    .ci-story-card:first-child .ci-story-card__image,.ci-story-card:first-child img { height:230px; }
    .ci-locality-grid { grid-template-columns:1fr 1fr; gap:.75rem; }
    .ci-locality-card { min-height:210px; padding:1rem; }
    .ci-request-card { grid-template-columns:1fr; text-align:center; }
    .ci-request-card .ci-icon { margin:auto; }
    .ci-partner__media { min-height:220px; }
    .search-toolbar { align-items:flex-start; flex-direction:column; }
    .ci-landing-hero--visual,.ci-landing-hero--visual > .row { min-height:360px; }
    .ci-mobile-actions {
        position:fixed; left:.75rem; right:.75rem; bottom:78px; z-index:1035; display:flex; gap:.5rem;
        padding:.6rem; background:rgba(255,255,255,.96); border:1px solid var(--ci-line); border-radius:1rem; box-shadow:var(--ci-shadow-md);
    }
    .ci-mobile-actions .btn { flex:1; }
}
@media (max-width: 420px) {
    .ci-category-grid,.ci-locality-grid { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior:auto; }
    *,*::before,*::after { transition:none!important; animation:none!important; }
}

.cs-bottom-nav__icon svg{width:1.15rem;height:1.15rem;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:767.98px){
  .ci-poi-mobile-actions{position:fixed;left:.75rem;right:.75rem;bottom:78px;z-index:1035;padding:.6rem;background:rgba(255,255,255,.97);border:1px solid var(--ci-line);border-radius:1rem;box-shadow:var(--ci-shadow-md)}
  .ci-poi-mobile-actions .btn{flex:1 1 0}
}