
/* Stella Placidia - custom theme
   Palette extracted from provided schema:
   Navy #1B1E67, Indigo #33407D, Azure #3B6DA3, Sky #ACCCE3, Slate #72829E, Mist #97AFBD, Gold #FFE8A2, Cream #F2E5C2
*/
:root{
  --sp-navy:#1B1E67;
  --sp-indigo:#33407D;
  --sp-azure:#3B6DA3;
  --sp-sky:#ACCCE3;
  --sp-slate:#72829E;
  --sp-mist:#97AFBD;
  --sp-gold:#FFE8A2;
  --sp-cream:#F2E5C2;
  --sp-white:#FFFFFF;

  --sp-bg: #0f153b;
  --sp-text: #0e1224;
  --sp-muted: #5b6680;

  --sp-radius: 18px;
  --sp-shadow: 0 18px 55px rgba(15,21,59,.22);
}

html, body { height: 100%; }
body{
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--sp-text);
  background: linear-gradient(180deg, #ffffff 0%, #f7f9ff 35%, #ffffff 100%);
}

h1,h2,h3,h4,h5{
  font-family: "Cinzel", Georgia, serif;
  letter-spacing: .2px;
}

a { color: var(--sp-indigo); }
a:hover { color: var(--sp-navy); }

.navbar{
  backdrop-filter: blur(10px);
  background: rgba(255,255,255,.88);
  border-bottom: 1px solid rgba(51,64,125,.12);
}

.navbar .navbar-brand{
  display:flex; align-items:center; gap:.65rem;
}
.brand-mark{
  width: 40px; height:40px; border-radius: 12px;
  background: radial-gradient(circle at 30% 30%, var(--sp-gold), var(--sp-sky));
  box-shadow: 0 10px 24px rgba(27,30,103,.18);
  overflow:hidden;
  display:flex; align-items:center; justify-content:center;
}
.brand-mark img{ width: 38px; height:38px; object-fit: contain; }
.brand-title{ line-height:1.05; }
.brand-title .it{ font-weight: 700; }
.brand-title .en{ font-family: "Inter", sans-serif; font-size:.82rem; color: var(--sp-muted); }

.nav-link{ color: rgba(15,18,36,.82); }
.nav-link:hover, .nav-link:focus{ color: var(--sp-navy); }
.navbar .btn{
  border-radius: 999px;
}

.btn-sp{
  color: #0f153b;
  background: linear-gradient(135deg, var(--sp-gold), #fff3c6);
  border: 1px solid rgba(255,232,162,.65);
  box-shadow: 0 14px 32px rgba(255,232,162,.25);
}
.btn-sp:hover{
  color: #0f153b;
  background: linear-gradient(135deg, #fff1bf, var(--sp-gold));
}

.btn-sp-outline{
  color: var(--sp-white);
  background: transparent;
  border: 1px solid rgba(255,255,255,.55);
}
.btn-sp-outline:hover{
  color: var(--sp-white);
  background: rgba(255,255,255,.12);
}

.section{
  padding: 86px 0;
}
.section-sm{
  padding: 64px 0;
}
.section-title{
  margin-bottom: 1.25rem;
}
.kicker{
  display:inline-flex;
  gap:.45rem;
  align-items:center;
  color: var(--sp-azure);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: .78rem;
}

.hero{
  position: relative;
  min-height: 92vh;
  display:flex;
  align-items:center;
  color: var(--sp-white);
  overflow:hidden;
}
.hero::before{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(120deg, rgba(27,30,103,.82), rgba(59,109,163,.58)),
    url("/assets/img/landing_01.png") center/cover no-repeat;
  transform: scale(1.03);
}
.hero::after{
  content:"";
  position:absolute; inset:-80px -80px;
  background: radial-gradient(circle at 75% 20%, rgba(255,232,162,.32), transparent 45%),
              radial-gradient(circle at 20% 70%, rgba(172,204,227,.22), transparent 55%);
  pointer-events:none;
}
.hero .container{
  position: relative;
  z-index: 2;
}
.hero-card{
  border-radius: var(--sp-radius);
  background: rgba(15,21,59,.45);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 30px 80px rgba(10,12,30,.35);
}

.hero-badges{
  display:flex; flex-wrap:wrap; gap:.6rem;
}
.badge-soft{
  padding:.55rem .85rem;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.18);
  font-weight: 600;
  font-size: .9rem;
}

.card{
  border: 1px solid rgba(51,64,125,.10);
  border-radius: var(--sp-radius);
  box-shadow: 0 10px 35px rgba(15,21,59,.08);
}
.card-soft{
  background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(255,255,255,.88));
}

.media-frame{
  border-radius: calc(var(--sp-radius) + 6px);
  overflow:hidden;
  box-shadow: var(--sp-shadow);
  border: 1px solid rgba(51,64,125,.10);
  background: #fff;
}
.media-frame img{
  width:100%;
  height:auto;
  display:block;
}

.icon-pill{
  width: 46px; height:46px;
  border-radius: 16px;
  display:flex; align-items:center; justify-content:center;
  background: linear-gradient(135deg, rgba(172,204,227,.55), rgba(255,232,162,.35));
  border: 1px solid rgba(51,64,125,.10);
  color: var(--sp-navy);
}

.feature-list{
  display:grid;
  grid-template-columns: 1fr;
  gap: .75rem;
}
.feature{
  display:flex; gap:.75rem; align-items:flex-start;
}
.feature i{ font-size: 1.1rem; color: var(--sp-azure); margin-top:.15rem;}
.feature .lbl{ font-weight: 600; }
.feature .sub{ color: var(--sp-muted); font-size: .95rem;}

.gallery-grid{
  display:grid;
  gap: 14px;
  grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 768px){
  .gallery-grid{ grid-template-columns: repeat(4, 1fr); }
}
.gallery-item{
  position:relative;
  border-radius: 16px;
  overflow:hidden;
  cursor:pointer;
  border: 1px solid rgba(51,64,125,.12);
  box-shadow: 0 18px 45px rgba(15,21,59,.10);
}
.gallery-item img{
  width:100%;
  height: 190px;
  object-fit: cover;
  display:block;
  transform: scale(1.02);
  transition: transform .45s ease;
}
.gallery-item:hover img{ transform: scale(1.08); }
.gallery-item .cap{
  position:absolute; left:0; right:0; bottom:0;
  padding: .75rem .85rem;
  background: linear-gradient(180deg, transparent, rgba(15,21,59,.78));
  color:#fff;
  font-weight: 600;
  font-size:.92rem;
}

.mosaic-band{
  position: relative;
  overflow:hidden;
  border-radius: calc(var(--sp-radius) + 10px);
  border: 1px solid rgba(51,64,125,.10);
  background: linear-gradient(135deg, rgba(27,30,103,.06), rgba(172,204,227,.10));
}
.mosaic-band::before{
  content:"";
  position:absolute; inset:0;
  background: url("../img/mosaico_big.png") center/cover no-repeat;
  opacity: .10;
  filter: saturate(1.15);
}
.mosaic-band > * { position:relative; }

.location-card{
  border-radius: calc(var(--sp-radius) + 10px);
  overflow:hidden;
  border: 1px solid rgba(51,64,125,.10);
  box-shadow: var(--sp-shadow);
}
.map-frame{
  width:100%;
  height: 360px;
  border:0;
  display:block;
}

.form-control, .form-select{
  border-radius: 14px;
  border: 1px solid rgba(51,64,125,.14);
  padding: .85rem .95rem;
}
.form-control:focus, .form-select:focus{
  border-color: rgba(59,109,163,.55);
  box-shadow: 0 0 0 .2rem rgba(59,109,163,.18);
}

.footer{
  padding: 42px 0;
  color: rgba(255,255,255,.82);
  background: linear-gradient(135deg, var(--sp-navy), #0c1030);
}
.footer a{ color: rgba(255,232,162,.95); text-decoration:none; }
.footer a:hover{ color: #fff; text-decoration:underline; }

.small-note{
  color: var(--sp-muted);
  font-size: .92rem;
}

.divider{
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(51,64,125,.18), transparent);
}

