/* ═══════════════════════════════════════════════════════════════
   Giada Pet Sitter & Store — Main Stylesheet
   Palette: blu (servizi) + arancione (store)
   Mobile-first, Nunito headings + Inter body
   ═══════════════════════════════════════════════════════════════ */

/* --- Reset --- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:'Inter','Nunito',system-ui,sans-serif;font-size:16px;line-height:1.6;color:#202020;background:#fff}
img,video{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
button,input,select,textarea{font:inherit;border:none;background:none}
button{cursor:pointer}

/* --- CSS Variables --- */
:root{
  --orange-cta:#E14D25;
  --orange-dark:#B8421A;
  --blue-primary:#00527C;
  --blue-navy:#1B4F72;
  --blue-accent:#0080AC;
  --blue-light:#5BC8E8;
  --blue-text:#3BADD4;
  --text-body:#202020;
  --text-secondary:#7A7A7A;
  --text-caption:#4A5568;
  --bg-white:#FFFFFF;
  --bg-light:#F0F7FC;
  --bg-dark:#071C2C;
  --footer-bg:#262626;
  --border:#E5E5E5;
  --whatsapp:#25D366;
  --facebook:#3B5998;
  --success:#69B92D;
  --error:#B9312D;
  --radius:8px;
  --radius-lg:12px;
  --shadow:0 2px 8px rgba(0,0,0,.08);
  --shadow-lg:0 8px 24px rgba(0,0,0,.12);
  --transition:all .2s ease;
  --container:1200px;
  --header-h:72px;
}

/* --- Typography --- */
h1,h2,h3,h4,h5,h6{font-family:'Nunito',sans-serif;font-weight:800;line-height:1.2;color:var(--blue-primary)}
h1{font-size:clamp(1.75rem,4vw,2.5rem)}
h2{font-size:clamp(1.5rem,3vw,2rem)}
h3{font-size:clamp(1.25rem,2.5vw,1.5rem)}
h4{font-size:1.125rem}
p+p{margin-top:.75em}

/* --- Container --- */
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 1rem}
@media(min-width:768px){.container{padding:0 1.5rem}}

/* --- Grid --- */
.grid{display:grid;gap:1.5rem}
.grid-2{grid-template-columns:1fr}
.grid-3{grid-template-columns:1fr}
.grid-4{grid-template-columns:repeat(2,1fr)}
@media(min-width:576px){.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(2,1fr)}}
@media(min-width:768px){.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(3,1fr)}}
@media(min-width:992px){.grid-4{grid-template-columns:repeat(4,1fr)}}

/* ═══════════════════════════════════════
   HEADER
   ═══════════════════════════════════════ */
.site-header{position:sticky;top:0;z-index:100;background:#fff;border-bottom:1px solid var(--border);height:var(--header-h)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:var(--header-h);gap:1rem}
.logo{display:flex;align-items:center;gap:.5rem;font-family:'Nunito',sans-serif;font-size:1.125rem;font-weight:700;color:var(--blue-primary);white-space:nowrap}
.logo-icon{font-size:1.5rem}
.logo strong{font-weight:800}
.main-nav ul{display:flex;gap:1.5rem;align-items:center}
.main-nav a{font-family:'Nunito',sans-serif;font-weight:600;font-size:.9375rem;color:var(--text-body);transition:var(--transition);position:relative;padding:.25rem 0}
.main-nav a:hover,.main-nav a.active{color:var(--blue-accent)}
.main-nav a.active::after{content:'';position:absolute;bottom:-2px;left:0;right:0;height:2px;background:var(--blue-accent);border-radius:1px}
.header-actions{display:flex;align-items:center;gap:.75rem}
.btn-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;color:var(--text-body);transition:var(--transition);position:relative}
.btn-icon:hover{background:var(--bg-light);color:var(--blue-accent)}
.cart-badge{position:absolute;top:2px;right:2px;background:var(--orange-cta);color:#fff;font-size:.6875rem;font-weight:700;width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.menu-toggle{display:none;flex-direction:column;gap:5px;width:28px;padding:4px 0}
.menu-toggle span{display:block;height:2px;background:var(--text-body);border-radius:1px;transition:var(--transition)}

@media(max-width:767px){
  .main-nav{position:fixed;top:var(--header-h);left:0;right:0;background:#fff;border-bottom:1px solid var(--border);padding:1rem;transform:translateY(-120%);transition:transform .3s ease;z-index:99}
  .main-nav.open{transform:translateY(0)}
  .main-nav ul{flex-direction:column;gap:.5rem}
  .main-nav a{display:block;padding:.75rem 0;font-size:1.0625rem;border-bottom:1px solid var(--border)}
  .menu-toggle{display:flex}
}

/* ═══════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;border-radius:var(--radius);font-family:'Nunito',sans-serif;font-weight:700;font-size:.9375rem;transition:var(--transition);white-space:nowrap;text-align:center}
.btn-sm{padding:.5rem 1rem;font-size:.8125rem}
.btn-lg{padding:1rem 2rem;font-size:1.0625rem}
.btn-block{display:flex;width:100%}
.btn-primary{background:var(--blue-accent);color:#fff}
.btn-primary:hover{background:var(--blue-navy)}
.btn-store{background:var(--orange-dark);color:#fff}
.btn-store:hover{background:var(--orange-cta)}
.btn-whatsapp{background:var(--orange-cta);color:#fff}
.btn-whatsapp:hover{background:#c7401e}
.btn-outline{background:transparent;color:var(--blue-navy);border:2px solid var(--blue-navy)}
.btn-outline:hover{background:var(--blue-navy);color:#fff}
.btn-outline-store{background:transparent;color:var(--orange-dark);border:2px solid var(--orange-dark)}
.btn-outline-store:hover{background:var(--orange-dark);color:#fff}
.btn-secondary{background:var(--bg-light);color:var(--blue-navy)}
.btn-secondary:hover{background:#dbeaf5}
.btn-ghost{background:transparent;color:var(--blue-accent);padding:.5rem}
.btn-ghost:hover{text-decoration:underline}
.btn:disabled,.btn.disabled{opacity:.5;pointer-events:none}

/* ═══════════════════════════════════════
   CARDS
   ═══════════════════════════════════════ */
.card{background:#fff;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);transition:var(--transition)}
.card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}
.card-img{position:relative;overflow:hidden;aspect-ratio:1/1;background:var(--bg-light)}
.card-img img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
.card:hover .card-img img{transform:scale(1.05)}
.card-body{padding:1rem}
.card-brand{font-size:.75rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:.25rem}
.card-title{font-family:'Nunito',sans-serif;font-weight:700;font-size:1rem;color:var(--text-body);margin-bottom:.5rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card-price{font-family:'Nunito',sans-serif;font-weight:800;font-size:1.125rem;color:var(--orange-dark)}
.card-actions{padding:0 1rem 1rem;display:flex;gap:.5rem}

/* ═══════════════════════════════════════
   HERO
   ═══════════════════════════════════════ */
.hero{background:linear-gradient(135deg,var(--bg-dark) 0%,var(--blue-primary) 100%);color:#fff;padding:4rem 0;position:relative;overflow:hidden}
.hero::after{content:'';position:absolute;top:0;right:0;bottom:0;width:40%;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" opacity="0.05"><circle cx="50" cy="50" r="40" fill="white"/></svg>') center/cover no-repeat;opacity:.1}
.hero h1{color:#fff;margin-bottom:1rem;font-size:clamp(2rem,5vw,3rem)}
.hero p{font-size:clamp(1rem,2vw,1.25rem);opacity:.9;max-width:600px;margin-bottom:1.5rem}
.hero-content{position:relative;z-index:1;max-width:640px}
.hero-buttons{display:flex;flex-wrap:wrap;gap:.75rem}
@media(min-width:768px){.hero{padding:5rem 0}}

/* ═══════════════════════════════════════
   SECTIONS
   ═══════════════════════════════════════ */
.section{padding:3rem 0}
.section-light{background:var(--bg-light)}
.section-dark{background:var(--bg-dark);color:#fff}
.section-dark h2,.section-dark h3{color:#fff}
.section-header{text-align:center;margin-bottom:2.5rem}
.section-header h2{margin-bottom:.5rem}
.section-header p{color:var(--text-secondary);max-width:600px;margin:0 auto}
@media(min-width:768px){.section{padding:4rem 0}}

/* ═══════════════════════════════════════
   SERVICES
   ═══════════════════════════════════════ */
.service-card{background:#fff;border-radius:var(--radius-lg);padding:2rem;text-align:center;box-shadow:var(--shadow);transition:var(--transition);border-top:3px solid var(--blue-accent)}
.service-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-3px)}
.service-icon{font-size:2.5rem;margin-bottom:1rem}
.service-card h3{color:var(--blue-primary);margin-bottom:.75rem}
.service-card p{color:var(--text-secondary);font-size:.9375rem}

/* ═══════════════════════════════════════
   TESTIMONIALS
   ═══════════════════════════════════════ */
.testimonial-card{background:#fff;border-radius:var(--radius-lg);padding:1.5rem;box-shadow:var(--shadow);position:relative}
.testimonial-card::before{content:'\201C';font-size:3rem;color:var(--blue-light);font-family:Georgia,serif;position:absolute;top:.5rem;left:1rem;line-height:1}
.testimonial-text{padding-top:1.5rem;font-style:italic;color:var(--text-caption);margin-bottom:1rem}
.testimonial-author{font-family:'Nunito',sans-serif;font-weight:700;font-size:.875rem;color:var(--text-body)}
.testimonial-stars{color:#f59e0b;font-size:.875rem;margin-bottom:.25rem}

/* ═══════════════════════════════════════
   STORE SECTION (homepage)
   ═══════════════════════════════════════ */
.store-section h2{color:var(--orange-dark)}
.store-section .btn-primary{background:var(--orange-dark)}
.store-section .btn-primary:hover{background:var(--orange-cta)}

/* ═══════════════════════════════════════
   CATALOG
   ═══════════════════════════════════════ */
.catalog-layout{display:grid;gap:2rem}
@media(min-width:768px){.catalog-layout{grid-template-columns:240px 1fr}}
.catalog-sidebar{display:none}
@media(min-width:768px){.catalog-sidebar{display:block}}
.filter-group{margin-bottom:1.5rem}
.filter-group h4{font-size:.875rem;color:var(--text-caption);text-transform:uppercase;letter-spacing:.5px;margin-bottom:.75rem}
.filter-group select,.filter-group input{width:100%;padding:.625rem .75rem;border:1px solid var(--border);border-radius:var(--radius);font-size:.875rem;transition:var(--transition)}
.filter-group select:focus,.filter-group input:focus{outline:none;border-color:var(--blue-accent);box-shadow:0 0 0 3px rgba(0,128,172,.15)}
.catalog-toolbar{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;margin-bottom:1.5rem}
.catalog-count{font-size:.875rem;color:var(--text-secondary)}
.catalog-sort select{padding:.5rem .75rem;border:1px solid var(--border);border-radius:var(--radius);font-size:.875rem}
.mobile-filter-btn{display:inline-flex}
@media(min-width:768px){.mobile-filter-btn{display:none}}
.product-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
@media(min-width:576px){.product-grid{grid-template-columns:repeat(2,1fr);gap:1.25rem}}
@media(min-width:768px){.product-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1200px){.product-grid{grid-template-columns:repeat(4,1fr)}}

/* Pagination */
.pagination{display:flex;justify-content:center;gap:.5rem;margin-top:2rem}
.pagination a,.pagination span{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius);font-weight:600;font-size:.875rem;transition:var(--transition)}
.pagination a{color:var(--text-body);border:1px solid var(--border)}
.pagination a:hover{background:var(--bg-light);border-color:var(--blue-accent)}
.pagination .active{background:var(--orange-dark);color:#fff;border:1px solid var(--orange-dark)}

/* ═══════════════════════════════════════
   PRODUCT DETAIL
   ═══════════════════════════════════════ */
.product-detail{display:grid;gap:2rem;padding:2rem 0}
@media(min-width:768px){.product-detail{grid-template-columns:1fr 1fr;gap:3rem}}
.product-gallery{position:relative;border-radius:var(--radius-lg);overflow:hidden;background:var(--bg-light);aspect-ratio:1/1}
.product-gallery img{width:100%;height:100%;object-fit:cover}
.product-info h1{color:var(--orange-dark);margin-bottom:.5rem}
.product-brand{font-size:.875rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:1rem}
.product-price{font-family:'Nunito',sans-serif;font-weight:800;font-size:1.75rem;color:var(--orange-dark);margin-bottom:1.5rem}
.product-description{color:var(--text-caption);line-height:1.8;margin-bottom:1.5rem}
.qty-control{display:flex;align-items:center;gap:0;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;width:fit-content;margin-bottom:1.5rem}
.qty-control button{width:40px;height:40px;font-size:1.25rem;display:flex;align-items:center;justify-content:center;color:var(--text-body);transition:var(--transition)}
.qty-control button:hover{background:var(--bg-light)}
.qty-control input{width:50px;height:40px;text-align:center;border:none;border-left:1px solid var(--border);border-right:1px solid var(--border);font-weight:600}
.qty-control input:focus{outline:none}
.product-meta{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--border)}
.product-meta-item{display:flex;gap:.5rem;font-size:.875rem;color:var(--text-secondary);margin-bottom:.5rem}
.product-meta-item strong{color:var(--text-body)}

/* ═══════════════════════════════════════
   CART PAGE
   ═══════════════════════════════════════ */
.cart-table{width:100%;border-collapse:collapse}
.cart-table th{text-align:left;padding:.75rem;font-size:.75rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;border-bottom:2px solid var(--border)}
.cart-table td{padding:.75rem;border-bottom:1px solid var(--border);vertical-align:middle}
.cart-item-info{display:flex;align-items:center;gap:1rem}
.cart-item-img{width:60px;height:60px;border-radius:var(--radius);overflow:hidden;background:var(--bg-light);flex-shrink:0}
.cart-item-img img{width:100%;height:100%;object-fit:cover}
.cart-item-name{font-weight:600;font-size:.9375rem}
.cart-item-price{font-weight:600;color:var(--orange-dark)}
.cart-item-remove{color:var(--error);font-size:.875rem;cursor:pointer;transition:var(--transition)}
.cart-item-remove:hover{text-decoration:underline}
.cart-summary{background:var(--bg-light);border-radius:var(--radius-lg);padding:1.5rem;margin-top:1.5rem}
.cart-summary-row{display:flex;justify-content:space-between;padding:.5rem 0;font-size:.9375rem}
.cart-summary-total{font-family:'Nunito',sans-serif;font-weight:800;font-size:1.25rem;border-top:2px solid var(--border);padding-top:.75rem;margin-top:.5rem}

/* ═══════════════════════════════════════
   CHECKOUT
   ═══════════════════════════════════════ */
.checkout-layout{display:grid;gap:2rem;padding:2rem 0}
@media(min-width:768px){.checkout-layout{grid-template-columns:1fr 360px}}
.progress-bar{display:flex;gap:0;margin-bottom:2rem}
.progress-step{flex:1;text-align:center;padding:.75rem .5rem;font-family:'Nunito',sans-serif;font-weight:700;font-size:.8125rem;color:var(--text-secondary);background:var(--bg-light);position:relative;transition:var(--transition)}
.progress-step:first-child{border-radius:var(--radius) 0 0 var(--radius)}
.progress-step:last-child{border-radius:0 var(--radius) var(--radius) 0}
.progress-step.active{background:var(--orange-dark);color:#fff}
.progress-step.done{background:var(--success);color:#fff}
.checkout-step{display:none}
.checkout-step.active{display:block}

/* ═══════════════════════════════════════
   FORMS
   ═══════════════════════════════════════ */
.form-group{margin-bottom:1.25rem}
.form-group label{display:block;font-family:'Nunito',sans-serif;font-weight:700;font-size:.875rem;color:var(--text-body);margin-bottom:.375rem}
.form-control{width:100%;padding:.75rem 1rem;border:1px solid var(--border);border-radius:var(--radius);font-size:.9375rem;transition:var(--transition);background:#fff}
.form-control:focus{outline:none;border-color:var(--blue-accent);box-shadow:0 0 0 3px rgba(0,128,172,.15)}
.form-control.error{border-color:var(--error)}
.form-error{color:var(--error);font-size:.75rem;margin-top:.25rem}
.form-row{display:grid;gap:1rem;grid-template-columns:1fr}
@media(min-width:576px){.form-row{grid-template-columns:1fr 1fr}}
.form-help{font-size:.75rem;color:var(--text-secondary);margin-top:.25rem}
textarea.form-control{resize:vertical;min-height:100px}

/* ═══════════════════════════════════════
   ACCOUNT / AUTH
   ═══════════════════════════════════════ */
.auth-page{max-width:440px;margin:3rem auto;padding:0 1rem}
.auth-card{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:2rem}
.auth-card h1{text-align:center;margin-bottom:1.5rem;font-size:1.5rem}
.auth-divider{text-align:center;margin:1.5rem 0;color:var(--text-secondary);font-size:.875rem}
.auth-switch{text-align:center;margin-top:1.5rem;font-size:.875rem;color:var(--text-secondary)}
.auth-switch a{color:var(--blue-accent);font-weight:600}

/* ═══════════════════════════════════════
   ABOUT / CONTACT
   ═══════════════════════════════════════ */
.about-team{display:grid;gap:2rem}
@media(min-width:576px){.about-team{grid-template-columns:1fr 1fr}}
.team-card{text-align:center;padding:2rem;background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow)}
.team-avatar{width:120px;height:120px;border-radius:50%;background:var(--bg-light);margin:0 auto 1rem;display:flex;align-items:center;justify-content:center;font-size:3rem}
.team-card h3{margin-bottom:.25rem}
.team-card .role{color:var(--text-secondary);font-size:.875rem;margin-bottom:.75rem}
.contact-grid{display:grid;gap:2rem}
@media(min-width:768px){.contact-grid{grid-template-columns:1fr 1fr}}
.contact-info-card{display:flex;gap:1rem;align-items:flex-start;padding:1.25rem;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow)}
.contact-icon{width:48px;height:48px;border-radius:50%;background:var(--bg-light);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--blue-accent);font-size:1.25rem}

/* ═══════════════════════════════════════
   CART DRAWER
   ═══════════════════════════════════════ */
.cart-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:200;opacity:0;pointer-events:none;transition:opacity .3s ease}
.cart-overlay.open{opacity:1;pointer-events:all}
.cart-drawer{position:fixed;top:0;right:0;bottom:0;width:min(400px,90vw);background:#fff;z-index:201;transform:translateX(100%);transition:transform .3s ease;display:flex;flex-direction:column}
.cart-drawer.open{transform:translateX(0)}
.cart-drawer-header{display:flex;align-items:center;justify-content:space-between;padding:1.25rem;border-bottom:1px solid var(--border)}
.cart-drawer-header h3{margin:0;font-size:1.125rem}
.cart-close{font-size:1.5rem;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:var(--transition)}
.cart-close:hover{background:var(--bg-light)}
.cart-drawer-body{flex:1;overflow-y:auto;padding:1rem}
.cart-empty{text-align:center;color:var(--text-secondary);padding:2rem 0}
.cart-drawer-item{display:flex;gap:.75rem;padding:.75rem 0;border-bottom:1px solid var(--border)}
.cart-drawer-item-img{width:56px;height:56px;border-radius:var(--radius);overflow:hidden;background:var(--bg-light);flex-shrink:0}
.cart-drawer-item-img img{width:100%;height:100%;object-fit:cover}
.cart-drawer-item-info{flex:1;min-width:0}
.cart-drawer-item-name{font-weight:600;font-size:.875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cart-drawer-item-price{font-weight:700;color:var(--orange-dark);font-size:.875rem}
.cart-drawer-item-qty{font-size:.75rem;color:var(--text-secondary)}
.cart-drawer-item-remove{font-size:.75rem;color:var(--error);cursor:pointer;margin-top:.25rem}
.cart-drawer-item-remove:hover{text-decoration:underline}
.cart-drawer-footer{padding:1rem 1.25rem;border-top:1px solid var(--border)}
.cart-totals{margin-bottom:1rem}
.cart-total-row{display:flex;justify-content:space-between;padding:.25rem 0;font-size:.875rem}
.cart-total-final{font-family:'Nunito',sans-serif;font-weight:800;font-size:1.0625rem;border-top:1px solid var(--border);padding-top:.5rem;margin-top:.25rem}
.cart-drawer-footer .btn{margin-bottom:.5rem}

/* ═══════════════════════════════════════
   BADGES
   ═══════════════════════════════════════ */
.badge{display:inline-flex;align-items:center;padding:.25rem .625rem;border-radius:20px;font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px}
.badge-success{background:#e8f5e0;color:var(--success)}
.badge-warning{background:#fff3cd;color:#856404}
.badge-error{background:#fde8e7;color:var(--error)}
.badge-info{background:var(--bg-light);color:var(--blue-accent)}

/* ═══════════════════════════════════════
   MODAL
   ═══════════════════════════════════════ */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:300;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s ease}
.modal-overlay.open{opacity:1;pointer-events:all}
.modal{background:#fff;border-radius:var(--radius-lg);padding:2rem;max-width:500px;width:90vw;max-height:85vh;overflow-y:auto;transform:scale(.95);transition:transform .3s ease}
.modal-overlay.open .modal{transform:scale(1)}
.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}
.modal-header h3{margin:0}

/* ═══════════════════════════════════════
   ORDER CONFIRMATION
   ═══════════════════════════════════════ */
.order-success{text-align:center;padding:3rem 0}
.order-success-icon{width:80px;height:80px;border-radius:50%;background:#e8f5e0;color:var(--success);display:flex;align-items:center;justify-content:center;font-size:2.5rem;margin:0 auto 1.5rem}
.order-details{max-width:600px;margin:2rem auto 0;text-align:left;background:var(--bg-light);border-radius:var(--radius-lg);padding:1.5rem}

/* ═══════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════ */
.site-footer{background:var(--footer-bg);color:#ccc;padding:3rem 0 1.5rem}
.footer-grid{display:grid;gap:2rem;grid-template-columns:1fr}
@media(min-width:576px){.footer-grid{grid-template-columns:1fr 1fr}}
@media(min-width:768px){.footer-grid{grid-template-columns:2fr 1fr 1fr 1.5fr}}
.site-footer h4{color:#fff;font-family:'Nunito',sans-serif;font-weight:800;font-size:1rem;margin-bottom:1rem}
.site-footer p{font-size:.875rem;line-height:1.6}
.site-footer ul li{margin-bottom:.5rem;font-size:.875rem}
.site-footer a{color:#ccc;transition:var(--transition)}
.site-footer a:hover{color:var(--blue-light)}
.footer-social{display:flex;gap:.75rem;margin-top:1rem}
.footer-social a{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.1);color:#fff;transition:var(--transition)}
.footer-social a:hover{background:var(--blue-accent)}
.newsletter-form{display:flex;gap:.5rem;margin-top:.75rem}
.newsletter-form input{flex:1;padding:.625rem .75rem;border:1px solid rgba(255,255,255,.2);border-radius:var(--radius);background:rgba(255,255,255,.1);color:#fff;font-size:.875rem}
.newsletter-form input::placeholder{color:rgba(255,255,255,.5)}
.newsletter-form input:focus{outline:none;border-color:var(--blue-accent)}
.footer-bottom{margin-top:2rem;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.1);display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;font-size:.8125rem}
.footer-legal{display:flex;gap:1.5rem}

/* ═══════════════════════════════════════
   WHATSAPP FAB
   ═══════════════════════════════════════ */
.whatsapp-fab{position:fixed;bottom:1.5rem;right:1.5rem;width:56px;height:56px;border-radius:50%;background:var(--whatsapp);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(37,211,102,.4);z-index:50;transition:transform .2s ease}
.whatsapp-fab:hover{transform:scale(1.1)}

/* ═══════════════════════════════════════
   TOAST
   ═══════════════════════════════════════ */
.toast-container{position:fixed;top:calc(var(--header-h) + 1rem);right:1rem;z-index:500;display:flex;flex-direction:column;gap:.5rem}
.toast{padding:.875rem 1.25rem;border-radius:var(--radius);font-size:.875rem;font-weight:600;color:#fff;background:var(--success);box-shadow:var(--shadow-lg);animation:toastIn .3s ease,toastOut .3s ease 2.7s forwards;max-width:320px}
.toast.error{background:var(--error)}
.toast.info{background:var(--blue-accent)}
@keyframes toastIn{from{transform:translateX(100%);opacity:0}to{transform:translateX(0);opacity:1}}
@keyframes toastOut{from{opacity:1}to{opacity:0;transform:translateY(-10px)}}

/* ═══════════════════════════════════════
   BREADCRUMB
   ═══════════════════════════════════════ */
.breadcrumb{display:flex;gap:.5rem;align-items:center;font-size:.8125rem;color:var(--text-secondary);padding:1rem 0;flex-wrap:wrap}
.breadcrumb a{color:var(--blue-accent);transition:var(--transition)}
.breadcrumb a:hover{text-decoration:underline}
.breadcrumb .sep{color:var(--border)}

/* ═══════════════════════════════════════
   LEGAL PAGES
   ═══════════════════════════════════════ */
.legal-page{max-width:800px;margin:0 auto;padding:2rem 1rem}
.legal-page h1{margin-bottom:1.5rem}
.legal-page h2{margin-top:2rem;margin-bottom:.75rem;font-size:1.25rem}
.legal-page p,.legal-page li{line-height:1.8;color:var(--text-caption)}
.legal-page ul{list-style:disc;padding-left:1.5rem;margin:.75rem 0}

/* ═══════════════════════════════════════
   UTILITIES
   ═══════════════════════════════════════ */
.text-center{text-align:center}
.text-right{text-align:right}
.mb-0{margin-bottom:0}
.mb-1{margin-bottom:.5rem}
.mb-2{margin-bottom:1rem}
.mb-3{margin-bottom:1.5rem}
.mb-4{margin-bottom:2rem}
.mt-2{margin-top:1rem}
.mt-3{margin-top:1.5rem}
.mt-4{margin-top:2rem}
.gap-1{gap:.5rem}
.d-flex{display:flex}
.align-center{align-items:center}
.justify-between{justify-content:space-between}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* ═══════════════════════════════════════
   LOADING SKELETON
   ═══════════════════════════════════════ */
.skeleton{background:linear-gradient(90deg,var(--bg-light) 25%,#e8eff5 50%,var(--bg-light) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius)}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.skeleton-text{height:1em;margin-bottom:.5rem}
.skeleton-img{aspect-ratio:1/1}