/* ===================================================
   INDICE CSS CUSTOM
   ===================================================

1. GLOBALI
   1.1 Reset e base
   1.2 Tipografia
   1.3 Link e colori generali
   1.4 Utility classes

2. HEADER / NAVIGATION
   2.1 Header principale
   2.2 Navbar e brand
   2.3 Menu attivo / hover

3. HOME PAGE
   3.1 Slider / Hero
   3.2 Blocchi informativi / Card
   3.3 Call to action

4. CHI SIAMO (Minisito-chi)
   4.1 Page title / hero
   4.2 About / testo e immagini
   4.3 Partner / valori
   4.4 Call to action

5. OFFERTE (Minisito-casa / Minisito-vision)
   5.1 Page title
   5.2 Pricing table / grid
   5.3 Pricing item / dettagli
   5.4 Bottone e link

6. FORM E MODAL
   6.1 Contenitore form
   6.2 Campi input e select
   6.3 Pulsanti submit e invio
   6.4 Validazione HTML5
   6.5 Prefisso telefono (+39)

7. FOOTER
   7.1 Sfondo e colori
   7.2 Menu footer
   7.3 Copyright

8. VARIE / UTILITY
   8.1 Speedtest / bottoni speciali
   8.2 Overlay, margini, max-width, text-align
   8.3 Media queries principali
   8.4 Responsività immagini e layout



/************************************************************
 * CSS GENERALE / BASE
 ************************************************************/
html {scroll-behavior: smooth;}
body {margin:0;padding:0;font-family:'Poppins',sans-serif;}
p {font-size:17px;color:rgba(29,29,29,1);}
h1 {text-transform:none;}
h2 {margin:0 0 14px 0;font-size:28px;line-height:28px;font-weight:700;color:rgba(8,22,119,1);}
h3 {margin:0 0 8px 0;font-size:24px;line-height:24px;font-weight:700;color:rgba(0,51,161,1);}
.container-small {width: 100%;max-width: 720px;margin: 0 auto;}
a {color:blue;text-decoration:underline;}
.text-left {text-align:left;}
.cursor {cursor:pointer;}
.intero {display:inline-block;}
.fluid {width:100%;height:auto;}
.max-w-220 {max-width:220px;height:auto;}
.max-w-280 {max-width:280px;height:auto;}
.max-w-520 {max-width:520px;height:auto;}
.mb-60 {margin-bottom:60px;}
.mt-60 {margin-top:60px;}
.red {color:rgba(235,0,40,0.99);}
.scroll-to-top {position:fixed;bottom:30px;right:30px;width:50px;height:50px;background-color:rgba(0,51,161,0.8);border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;z-index:9999;}
.scroll-to-top::after {content:"↑";color:#fff;font-size:24px;font-weight:bold;}
.scroll-to-top:hover {background-color:rgba(0,51,161,1);}

/************************************************************
 * HEADER / NAVBAR (tutte le pagine)
 ************************************************************/
header {}
.navigation {margin:0!important;padding:0!important;background-color:rgba(255,255,255,1);}
.navigation a {text-decoration:none;}
.navigation .navbar {padding:0 16px;}
.navigation .navbar .navbar-nav > li > a {margin-bottom:1px;}
.navigation .navbar-brand {width:100%;max-width:270px;margin-right:0;}
.navigation .navbar .navbar-nav {padding-top:0;}


/************************************************************
 * ACTIVE STATE *
 ************************************************************/
.b-Minisito-home .navbar-nav li a {display:block;padding:10px 15px 6px;}
.b-Minisito-home .navbar-nav li a:hover {background-color:rgba(255,196,0,0.2)!important;}

/* PAGE SPECIFIC ACTIVE LINKS */
.b-Minisito-home 						a.m-mini-home {border-bottom:6px solid rgba(255,196,0,0.99);}
.b-Minisito-chi 						a.m-mini-chi {border-bottom:6px solid rgba(255,196,0,0.99);}

.b-Minisito-casa 						a.m-mini-offerte {border-bottom:6px solid rgba(255,196,0,0.99);}
.b-Minisito-casa-WiFiCasa		a.m-mini-offerte {border-bottom:6px solid rgba(255,196,0,0.99);}
.b-Minisito-casa-FWA				a.m-mini-offerte {border-bottom:6px solid rgba(255,196,0,0.99);}

.b-Minisito-Timvision 					a.m-mini-timvision {border-bottom:6px solid rgba(255,196,0,0.99);}
.b-Minisito-Timvision-Fam-S			a.m-mini-timvision {border-bottom:6px solid rgba(255,196,0,0.99);}
.b-Minisito-Timvision-Fam-M			a.m-mini-timvision {border-bottom:6px solid rgba(255,196,0,0.99);}
.b-Minisito-Timvision-Fam-L			a.m-mini-timvision {border-bottom:6px solid rgba(255,196,0,0.99);}

/************************************************************
 * SLIDER / HERO (tutte le pagine)
 ************************************************************/
.slider {position:relative;padding:400px 0 50px;background:url("/images/backgrounds/home.webp") center top no-repeat;background-size:cover;}
.page-title .block h1,
.slider .block h1 {font-size:40px;line-height:42px;margin:0;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,1);}
.slider .block p {color:rgba(255,255,255,1);}
.btn-main {background:rgba(235,0,40,1);text-decoration:none;}
.btn-small {background:rgba(235,0,40,1);}
.btn-transparent {background:rgba(235,0,40,1);}
.overly:before,.slider:before,.page-title:before {background:linear-gradient(180deg, rgba(2,0,36,0) 30%, rgba(2,0,36,0.7) 100%);}
.logo-tim {width:100%;max-width:520px;height:auto;margin:0 auto 20px;}

/************************************************************
 * PAGINA HOME
 ************************************************************/
.page-title {position:relative;display:flex;align-items:flex-end;justify-content:center;min-height:580px;padding:0;}
.page-title .block {width:100%;text-align:center;padding:30px 0;}
.page-title .block p {font-size:20px;}
.page-title h1 strong {font-size:80px;line-height: 80px; font-weight: 900;}


/************************************************************
 * PAGINA "CHI SIAMO"
 ************************************************************/
.about-img img {max-width:100%;height:auto;}
.bg-chi-action {padding:70px 0;text-align:center;background-color:rgba(0,51,161,0.7);}
.bg-chi-action p,.bg-chi-action ul {color:rgba(255,255,255,1);}
.bg-chi-action h2 {color:rgba(255,255,255,1);}
.bg-chi-action ul {margin-bottom:20px;}
.call-to-action.bg-1 {padding:50px 0;}
.call-to-action h2 {color:rgba(0,51,161,1);}
.call-to-action p {font-size:20px;line-height:24px;color:rgba(0,0,0,1);}
.call-to-action ul {margin:0 0 20px 0;}
.call-to-action ul li {color:#fff;}


/************************************************************
 * SFONDI HERO
 ************************************************************/
.b-Minisito-home 					.page-title {background:url("/images/backgrounds/home.webp") center top no-repeat;background-size:cover;}
.b-Minisito-chi 					.page-title {background:url("/images/backgrounds/match-new-generation.webp") center top no-repeat;background-size:cover;}
.b-Minisito-casa 					.page-title {background:url("/images/backgrounds/offerte-tim-casa.webp") center top no-repeat;background-size:cover;}
.b-Minisito-casa-WiFiCasa .page-title {background:url("/images/backgrounds/offerte-tim-casa.webp") center top no-repeat;background-size:cover;}
.b-Minisito-casa-FWA			.page-title {background:url("/images/backgrounds/offerte-tim-casa.webp") center top no-repeat;background-size:cover;}

.b-Minisito-Timvision				.page-title {background:url("/images/backgrounds/offerte-timvision.webp") center center no-repeat;background-size:cover;}
.b-Minisito-Timvision-Fam-S .page-title {background:url("/images/backgrounds/offerte-timvision.webp") center center no-repeat;background-size:cover;}
.b-Minisito-Timvision-Fam-M .page-title {background:url("/images/backgrounds/offerte-timvision.webp") center center no-repeat;background-size:cover;}
.b-Minisito-Timvision-Fam-L .page-title {background:url("/images/backgrounds/offerte-timvision.webp") center center no-repeat;background-size:cover;}



/************************************************************
 * SEZIONE TARGET / FORM COMPATTO
 ************************************************************/

.target .indecisi {padding-left:20px;border-left:solid 1rem red}

.form-cont-pagina {background:rgba(255,255,255,0.95);padding:20px;border-radius:8px;box-shadow:0 8px 15px rgba(5,57,106,0.16);}
.form-cont-pagina h3 {font-size:28px;line-height:28px;color:rgba(235,0,40,1);margin-bottom:10px;}
.form-cont-pagina p {font-size:16px;line-height:20px;color:rgba(29,29,29,1);margin-bottom:15px;}
.form-cont-pagina fieldset {display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;border:none;}
.form-cont-pagina fieldset > div {flex:0 0 calc(50% - 5px);box-sizing:border-box;} /* div principali affiancati, considera gap */
.form-cont-pagina fieldset label {flex:0 0 120px;display:flex;align-items:center;font-size:14px;margin:0;}
.form-cont-pagina fieldset input[type=text], .form-cont-pagina fieldset input[type=email], .form-cont-pagina fieldset input[type=tel], .form-cont-pagina fieldset select, .form-cont-pagina fieldset textarea {flex:1;width:100%;padding:6px 10px;border:1px solid #ccc;height:36px;border-radius:6px;font-size:14px;box-sizing:border-box;}
.form-cont-pagina .policy {flex:0 0 100%;margin-top:10px;}
.form-cont-pagina .policy label {display:flex;align-items:flex-start;gap:8px;flex-wrap:wrap;}
.form-cont-pagina .policy label input.check {margin-top:3px;flex-shrink:0;}
.form-cont-pagina .policy label p {margin:0;flex:1;font-size:12px; line-height: 15px;}
.form-cont-pagina input[type=submit], .form-cont-pagina button {width:100%;padding:12px;background-color:rgba(235,0,40,1);color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:700;cursor:pointer;transition:0.3s;margin-top:10px;}
.form-cont-pagina input[type=submit]:hover, .form-cont-pagina button:hover {background-color:rgba(0,51,161,1);}
.form-cont-pagina p.prefix {margin-bottom:14px;position:absolute;left:0;}
.form-cont-pagina select {-webkit-appearance:none;-moz-appearance:none;appearance:none;}
.form-cont-pagina .select {padding:12px 8px 12px 16px;color:#888;background:#FFF url(/assets/img/select-arrow.png) no-repeat 97% 50%;cursor:pointer;}


/************************************************************
 * PAGINA "VANTAGGI"
 ************************************************************/
.benefits {padding:50px 0;}
.benefits__grid {display:flex;flex-wrap:wrap;justify-content:center;text-align:center;}
.benefits__grid .col-md-3 {display:flex;}
.card-benefit {display:flex;flex-direction:column;flex:1;border-top:6px solid rgba(235,0,40,0.99);border-radius:8px;box-shadow:0 8px 15px rgba(5,57,106,0.16);padding:20px;text-align:center;}
.card-title {margin:0 0 6px 0;font-size:20px;line-height:24px;font-weight:700;color:rgba(8, 22, 119, 1);}
.card-text {font-size:16px;line-height:20px;color:rgba(0,0,0,1.00);}
.benefits-cta .btn {margin-top:20px;}

/************************************************************
 * PAGINA "OFFERTE CASA/VISION"
 ************************************************************/
.pricing-table .pricing-grid {display:grid;grid-template-columns:repeat(3,max-content);gap:30px;justify-content:center;}
.pricing-table .pricing-item {display:flex;flex-direction:column;padding:0 0 30px 0;text-align:center!important;box-shadow:0 8px 15px rgba(5,57,106,0.16);border-top:6px solid rgba(235,0,40,0.99);border-bottom:6px solid rgba(235,0,40,0.99);border-radius:8px;width:350px;}
.pricing-table .pricing-label {width:100%;max-width:260px;margin:-20px auto 0;padding:4px;background-color:rgba(8,22,119,1);color:#fff;border-radius:8px;}
.pricing-table .price-title {padding:30px 10px 10px;flex:0 0 auto;}
.pricing-table .pricing-item ul {margin:0 0 24px 0;padding:0 15px;flex:0 0 auto;text-align:left;}
.pricing-table .pricing-item li {padding:0;font-weight:400;color:rgba(8,22,119,1);text-align:center!important;}
.pricing-table .price-title h3 {margin:0;font-size:24px;line-height:24px;font-weight:400;text-transform:none;color:rgba(0,51,161,1);}
.pricing-table .price-title h3 strong {font-size:36px!important;line-height:36px!important;font-weight:800;color:rgba(235,0,40,1);}
.pricing-table .btn-primary {width:100%;max-width:220px;margin:0 auto;margin-top:auto;color:#fff;background-color:rgba(0,51,161,1);border-color:rgba(0,51,161,1);}
.pricing-table a {text-decoration: none;}
.pricing-item-link {text-decoration:none;color:inherit;display:block;}
.pricing-item-link:hover {text-decoration:none;}
/** service arrow **/
.bg-fisso {background-color:rgba(0,51,161,1.00);border-bottom: 1px solid rgba(255,255,255,1.00);opacity:0.9;}
.bg-fisso:hover {opacity: 1.0}
.bg-timvision {background-color:rgba(8,22,119,1.00); border-bottom: 1px solid rgba(255,255,255,1.00);opacity:0.9;}
.bg-timvision:hover {opacity: 1.0}


.section__header .price {margin:0 0 14px 0;font-size:2rem;line-height: 2rem;font-weight:400; color:#d9230f;border-bottom:#d9230f solid 1px;}
.section__header .price strong {font-size:3rem;line-height: 1rem;font-weight:900;}

.logos {display:flex; justify-content:flex-start; gap:5px; flex-wrap:wrap; margin-bottom:25px!important;}
.logos img {max-width:15%; height:auto; display:block;}
.pricing-table .logos {justify-content:center;}



.section__list {list-style:none;padding-left:0;margin:0 0 20px 0;}
.section__list li {position:relative;padding-left:25px;margin-bottom:1px;}
.section__list li::before {content:"✔";position:absolute;left:0;color:#28a745;font-weight:bold;}
.section__list li .red {color:#d9230f;font-weight:bold;}



/************************************************************
 * FORM
 ************************************************************/
.form-cont form {width:100%;background-color:rgba(255,255,255,0.5);padding:20px;border-radius:8px;}
.form-cont fieldset label {float:left;text-align:left!important;}
.form-cont fieldset div {position:relative;float:left;width:50%;margin:0 0 18px 0;padding:0 15px;}
.form-cont fieldset input,fieldset select {width:100%;padding:16px 8px 16px 16px;font-size:12px;background-color:rgba(255,255,255,1);
}
.form-cont fieldset input:focus,fieldset select:focus {background-color:#FDF8E3;border:none;outline:none;}
.form-cont select {-webkit-appearance:none;-moz-appearance:none;appearance:none;}
.form-cont .select {padding:12px 8px 12px 16px;color:#888;background:#FFF url(/assets/img/select-arrow.png) no-repeat 97% 50%;cursor:pointer;}
.form-cont fieldset .policy {width:100%;}
.form-cont fieldset .policy input {float:left;width:20px;}
.form-cont fieldset .policy p {padding:0 0 0 40px;font-size:12px!important;}
.form-cont .invio {width:100%;max-width:280px;margin:0 auto;}
.form-cont input[type=submit],.form-cont button {width:100%;padding:12px 20px 12px!important;border:none;font-family:'Poppins',sans-serif;font-size:18px;font-weight:600;text-transform:uppercase;color:rgba(255,255,255,1);border-radius:10px;cursor:pointer;}
.form-cont input[type=submit] {background-color:rgba(255,0,0,1);}
.form-cont input[type=submit]:hover {background-color:rgba(0,102,0,1);color:rgba(255,255,255,1);}
.form-cont button {background-color:rgba(0,102,0,1);color:rgba(255,255,255,1);}

.autorizzo {overflow:hidden;width:100%;padding:20px 0 0 0;}
.autorizzo p {padding:0 10px 10px 10px;font-size:12px;text-align:center;color:rgba(92,92,92,1);}
.autorizzo a {color:#FFFFFF;}
.telefono {position:relative;}

p.prefix {position:absolute;bottom:-17px;width:50px;padding:11px 0 11px 16px;font-family:'Poppins',sans-serif;font-size:12px!important;font-weight:500;color:rgba(11,52,102,1.00)!important;pointer-events:none;border:none!important;}

input[type="tel"] {padding-left:54px!important;}

/************************************************************
 * FOOTER
 ************************************************************/
.footer {background:rgba(8,22,119,1);}
.footer p {color:rgba(186,186,186,1);}
.footer .footer-manu ul {margin:30px 0 0 0;}
.footer .footer-manu ul li a {color:rgba(255,255,255,1);text-decoration:none;}
.footer .footer-manu ul li a:hover {color:rgba(255,196,0,1);}
.footer .copyright a {font-weight:600;color:rgba(255,196,0,0.99);}




/************************************************************
 * MEDIA QUERIES
 ************************************************************/
@media (max-width:991px) {
  .pricing-table .pricing-grid {grid-template-columns:1fr;gap:20px;justify-items:center;width:100%;margin:0 auto;}
  .page-title,.slider .block h1 {line-height:38px;}
	.page-title {min-height: 380px;}
  .b-mini-home a.m-mini-home {padding:3px 8px 2px;background-color:rgba(255,196,0,0.6);border-bottom:none;}
  .b-mini-chi a.m-mini-chi {padding:3px 8px 2px;background-color:rgba(255,196,0,0.6);border-bottom:none;}
  .b-mini-offerte a.m-mini-offerte {padding:3px 8px 2px;background-color:rgba(255,196,0,0.6);border-bottom:none;}
  .b-mini-timvision a.m-mini-timvision {padding:3px 8px 2px;background-color:rgba(255,196,0,0.6);border-bottom:none;}
  .page-title {/*padding:260px 0 20px;*/}
  .slider {padding:320px 0 40px;}
  .hidden {display:none;}
  .benefits__grid .col-md-3 {flex:0 0 48%;max-width:48%;margin-bottom:20px;}
.form-cont-pagina fieldset > div {flex:0 0 100%;}
	
	
	
}

@media (max-width:580px) {
	.navigation .container {padding:5px;}
  .navigation .navbar {padding:0 1px;}
  .navigation .navbar-brand.expand {max-width:170px!important;}
  .slider {padding:340px 0 50px;}
  .form-cont fieldset div {width:100%;}
  .footer .logo img.tim {margin-top:12px;max-width:300px!important;height:auto!important;}
  .benefits__grid .col-md-3 {flex:0 0 100%;max-width:100%;margin-bottom:15px;}
	.page-title {min-height: 300px;}
.page-title h1 strong {font-size:40px;}
.page-title .block p {line-height: 20px;}
	
	.pricing-item {margin-bottom:20px;}
	}

	
	
	
@media (min-width:992px) {
  .benefits__grid .col-md-3 {flex:0 0 23%;max-width:23%;margin-bottom:30px;}
}

@media (min-width:576px) {
  .modal-dialog {max-width:700px!important;margin:1.75rem auto;}
}
