/* ============================================================
   LANDING PRIMO MAGGIO - Park Hotel Villa Grazioli
   FONT: <link href="https://fonts.googleapis.com/css2?family=Baskervville:ital@0;1&family=Jost:wght@300;400;500&display=swap" rel="stylesheet">
   ============================================================ */

body.offerte {
  --terra:        #c4943e;
  --cotto:        #A85A38;
  --sabbia:       #F2E8DC;
  --crema:        #FAF5EE;
  --fumo:         #3B3229;
  --oro:          #C9A96E;
  --bianco:       #FFFFFF;
  --font-display: 'Baskervville', Georgia, serif;
  --font-body:    'Jost', sans-serif;
}

body.offerte {
  font-size:   16px             !important;
  background:  var(--crema)     !important;
  color:       var(--fumo)      !important;
  font-family: var(--font-body) !important;
  font-weight: 300              !important;
  line-height: 1.7              !important;
}

body.offerte article { margin-top: 0 !important; }


/* === 1. HERO === */

body.offerte section#slideshow {
  position:    relative !important;
  width:       100%     !important;
  min-height:  88vh     !important;
  height:      auto     !important;
  display:     flex     !important;
  align-items: flex-end !important;
  overflow:    hidden   !important;
  padding:     0        !important;
  margin:      0        !important;
}

body.offerte section#slideshow .colonna,
body.offerte section#slideshow .custom-col {
  position: static !important;
  padding:  0      !important;
  margin:   0      !important;
  width:    100%   !important;
}

body.offerte section#slideshow .contenitore {
  position: static !important;
  padding:  0      !important;
  margin:   0      !important;
}

body.offerte section#slideshow picture {
  position: absolute !important;
  inset:    0        !important;
  width:    100%     !important;
  height:   100%     !important;
  display:  block    !important;
}

body.offerte section#slideshow picture img {
  position:        absolute !important;
  inset:           0        !important;
  width:           100%     !important;
  height:          100%     !important;
  object-fit:      cover    !important;
  object-position: center   !important;
  display:         block    !important;
}

body.offerte section#slideshow::after {
  content:        ''       !important;
  position:       absolute !important;
  inset:          0        !important;
  z-index:        1        !important;
  pointer-events: none     !important;
  background:     linear-gradient(to bottom, rgba(59,50,41,0.10) 0%, rgba(59,50,41,0.55) 70%, rgba(59,50,41,0.82) 100%) !important;
}

body.offerte section#fastreservation { display: none !important; }


/* === 2. SEZIONE TITOLO === */

body.offerte section#titolo {
  background: #F2E8DC      !important;
  height:     auto         !important;
  padding: 150px 5% 3em !important;
  text-align: center       !important;
}

body.offerte section#titolo .contenitore {
  display:        flex           !important;
  flex-direction: column-reverse !important;
  align-items:    center         !important;
}

body.offerte section#titolo h1 {
  font-family:    var(--font-display)     !important;
  font-size:      clamp(1.8em, 4vw, 3em) !important;
  font-weight:    400                     !important;
  line-height:    1.2                     !important;
  color:          var(--fumo)             !important;
  text-align:     center                  !important;
  text-transform: none                    !important;
  margin:         1.5em 0 0 0             !important;
  width:          100%                    !important;
}

body.offerte section#titolo picture {
  display:    inline-block                      !important;
  max-width:  80%                               !important;
  width:      60%                               !important;
  position:   relative                          !important;
  box-shadow: 12px 16px 40px rgba(59,50,41,.15) !important;
  margin:     0                                 !important;
}

body.offerte section#titolo picture::before {
  content:        ''                   !important;
  position:       absolute             !important;
  inset:          -10px                !important;
  border:         1px solid var(--oro) !important;
  pointer-events: none                 !important;
  z-index:        1                    !important;
}

body.offerte section#titolo picture img {
  width:    100%     !important;
  display:  block    !important;
  position: relative !important;
  z-index:  0        !important;
}

@media (max-width: 768px) {
  body.offerte section#titolo {
    padding-top: 95px !important;
  }
  body.offerte section#titolo picture {
    max-width:  100%       !important;
    width:      100%       !important;
    padding:    0 1em      !important;
    box-sizing: border-box !important;
    padding: 0 !important;
  }
}


/* === 3. INTRO === */

body.offerte section#introduzione,
body.offerte section#introduzione2 {
  background: var(--crema) !important;
  padding:    3em 5%       !important;
  text-align: center       !important;
}

body.offerte section#introduzione2 { display: none !important; }

body.offerte section#introduzione::before {
  content:       '\2736'    !important;
  display:       none      !important;
  text-align:    center     !important;
  color:         var(--oro) !important;
  font-size:     1.4em      !important;
  margin-bottom: 1.5em      !important;

}

body.offerte section#introduzione .contenitore {
  max-width: 720px  !important;
  margin:    0 auto !important;
}


/* === 4. PROPOSTE — verticale === */

body.offerte section#proposte {
  background: var(--sabbia) !important;
  padding:    4em 5%        !important;
  text-align: center        !important;
}

body.offerte section#proposte .sez-1 {
  width:      100%       !important;
  float:      none       !important;
  text-align: center     !important;
  padding:    0 0 2em 0  !important;
}

body.offerte section#proposte .sez-1 .contenitore {
  background: transparent !important;
  padding:    0           !important;
  border:     none        !important;
  max-width:  720px       !important;
  margin:     0 auto      !important;
}

body.offerte section#proposte .sez-2 {
  width:   100% !important;
  float:   none !important;
  clear:   both !important;
  padding: 0    !important;
}

body.offerte section#proposte .sez-2 .contenitore {
  max-width:  500px                  !important;
  margin:     0 auto                 !important;
  background: var(--bianco)          !important;
  padding:    2.2em 2em              !important;
  border-top: 3px solid var(--terra) !important;
  position:   relative               !important;
  text-align: left                   !important;
}


/* === 5. MENU LOCANDINA === */

body.offerte section#menu-locandina {
  background: var(--crema) !important;
  padding:    3em 5% 5em   !important;
  text-align: center       !important;
}

body.offerte section#menu-locandina .contenitore {
  max-width: 100%   !important;
  margin:    0 auto !important;
}

body.offerte section#menu-locandina picture {
  display:    inline-block                      !important;
  max-width:  560px                             !important;
  width:      100%                              !important;
  position:   relative                          !important;
  box-shadow: 12px 16px 40px rgba(59,50,41,.15) !important;
  margin-top: 2em                               !important;
}

body.offerte section#menu-locandina picture::before {
  content:        ''                   !important;
  position:       absolute             !important;
  inset:          -10px                !important;
  border:         1px solid var(--oro) !important;
  pointer-events: none                 !important;
  z-index:        1                    !important;
}

body.offerte section#menu-locandina picture img {
  width:    100%     !important;
  display:  block    !important;
  position: relative !important;
  z-index:  0        !important;
}


/* === 6. TIPOGRAFIA CONDIVISA === */

body.offerte .section-label {
  display:        block            !important;
  font-family:    var(--font-body) !important;
  font-size:      .7em             !important;
  letter-spacing: .35em            !important;
  text-transform: uppercase        !important;
  color:          var(--terra)     !important;
  margin-bottom:  .6em             !important;
  text-align:     center           !important;
}

body.offerte .section-title {
  font-family:    var(--font-display)       !important;
  font-size:      clamp(1.8em, 4vw, 3em)   !important;
  font-weight:    400                       !important;
  line-height:    1.2                       !important;
  color:          var(--fumo)               !important;
  margin-bottom:  1em                       !important;
  text-align:     center                    !important;
  text-transform: none                      !important;
}

body.offerte .section-title em {
  font-style: italic       !important;
  color:      var(--terra) !important;
}

/* section-title nel form — colore sabbia su sfondo scuro */
body.offerte section#form .section-title {
  color: var(--sabbia) !important;
}

body.offerte section#form .section-title em {
  color: var(--oro) !important;
}

body.offerte .intro__text {
  font-size: .95em   !important;
  color:     #5a4f44 !important;
  max-width: 600px   !important;
  margin:    0 auto  !important;
}

body.offerte .card__tag {
  display:        inline-block     !important;
  background:     var(--terra)     !important;
  color:          var(--bianco)    !important;
  font-family:    var(--font-body) !important;
  font-size:      .65em            !important;
  letter-spacing: .18em            !important;
  text-transform: uppercase        !important;
  padding:        .3em .8em        !important;
  margin-bottom:  1em              !important;
}

body.offerte .card__title {
  font-family:    var(--font-display) !important;
  font-size:      1.5em               !important;
  font-weight:    400                 !important;
  color:          var(--fumo)         !important;
  margin-bottom:  .5em                !important;
  text-transform: none                !important;
}

body.offerte .card__price {
  font-family:   var(--font-body) !important;
  font-size:     1.1em            !important;
  color:         var(--terra)     !important;
  font-weight:   500              !important;
  margin-bottom: .8em             !important;
}

body.offerte .card__desc {
  font-family: var(--font-body) !important;
  font-size:   .88em            !important;
  color:       #6b5e52          !important;
  line-height: 1.65             !important;
}


/* === 7. FORM === */

body.offerte section#form {
  background: var(--fumo) !important;
  padding:    5em 5%      !important;
  text-align: center      !important;
}

body.offerte section#form .section-label {
  color: var(--oro) !important;
}

/* Contenitore form centrato */
body.offerte section#form .contenitore {
  max-width:  780px  !important;
  margin:     0 auto !important;
  text-align: left   !important;
}

/* Tutti i testi del form in sabbia */
body.offerte section#form,
body.offerte section#form p,
body.offerte section#form span,
body.offerte section#form .form-group p {
  color: var(--sabbia) !important;
}

/* Reset wrapper floating-label */
body.offerte section#form .floating-label-form-group,
body.offerte section#form .form-group.col-xs-12.floating-label-form-group.controls {
  background:    transparent !important;
  border:        none        !important;
  border-radius: 0           !important;
  padding:       0           !important;
  margin-bottom: 1.4em       !important;
  width:         100%        !important;
  float:         none        !important;
}

/* Label */
body.offerte section#form label,
body.offerte section#form .floating-label-form-group label {
  display:        block            !important;
  font-family:    var(--font-body) !important;
  font-size:      .72em            !important;
  letter-spacing: .18em            !important;
  text-transform: uppercase        !important;
  color:          var(--sabbia)    !important;
  margin-bottom:  .4em             !important;
  font-weight:    400              !important;
  opacity:        1                !important;
  position:       static           !important;
  top:            auto             !important;
}

/* Input e textarea */
body.offerte section#form .form-control,
body.offerte section#form .floating-label-form-group input,
body.offerte section#form .floating-label-form-group textarea {
  width:          100%                           !important;
  background:     rgba(255,255,255,.06)          !important;
  border:         none                           !important;
  border-bottom:  1px solid rgba(201,169,110,.4) !important;
  border-radius:  0                              !important;
  color:          var(--sabbia)                  !important;
  font-family:    var(--font-body)               !important;
  font-size:      .9em                           !important;
  padding:        .7em .5em                      !important;
  outline:        none                           !important;
  box-shadow:     none                           !important;
  height:         auto                           !important;
  text-transform: none                           !important;
  letter-spacing: normal                         !important;
  line-height:    1.5                            !important;
  margin:         0                              !important;
}

body.offerte section#form .form-control:focus,
body.offerte section#form .floating-label-form-group input:focus,
body.offerte section#form .floating-label-form-group textarea:focus {
  border-color: var(--oro)            !important;
  background:   rgba(255,255,255,.09) !important;
  box-shadow:   none                  !important;
  outline:      none                  !important;
}

body.offerte section#form textarea.form-control,
body.offerte section#form .floating-label-form-group textarea {
  resize:     vertical !important;
  min-height: 80px     !important;
  height:     auto     !important;
}

/* Radio */
body.offerte section#form .form-group p,
body.offerte section#form p.option {
  color:          var(--sabbia)    !important;
  font-size:      .88em            !important;
  font-weight:    400              !important;
  margin:         .4em 0           !important;
  padding:        0                !important;
  padding-left:   0                !important;
  border:         none             !important;
  border-bottom:  none             !important;
  text-transform: none             !important;
  letter-spacing: normal           !important;
  font-family:    var(--font-body) !important;
}

body.offerte section#form p.option input[type="radio"] {
  accent-color: var(--terra) !important;
  margin-right: .5em         !important;
  width:        auto         !important;
  height:       auto         !important;
  border:       none         !important;
  background:   transparent  !important;
  padding:      0            !important;
}

/* Privacy */
body.offerte section#form .checkprivacyform {
  display:     flex                 !important;
  align-items: flex-start           !important;
  gap:         .8em                 !important;
  margin:      1.5em 0              !important;
  color:       var(--sabbia)        !important;
  font-size:   .82em                !important;
  font-style:  normal               !important;
  float:       none                 !important;
  width:       100%                 !important;
  padding:     0                    !important;
  text-align:  left                 !important;
}

body.offerte section#form .checkprivacyform .checkformm {
  float:   none  !important;
  display: block !important;
  width:   auto  !important;
}

body.offerte section#form .checkformm input[type="checkbox"] {
  accent-color: var(--terra) !important;
  margin-top:   .2em         !important;
  width:        auto         !important;
  height:       auto         !important;
  border:       none         !important;
  display:      inline       !important;
}

body.offerte section#form .checkprivacyform .testo-infodatiform {
  float:       none              !important;
  position:    static            !important;
  width:       auto              !important;
  margin-left: 0                 !important;
  color:       var(--sabbia)     !important;
}

body.offerte section#form .testo-infodatiform a,
body.offerte section#form .testo-infodatiform a:link,
body.offerte section#form .testo-infodatiform a:hover {
  color:           var(--oro) !important;
  text-decoration: none       !important;
  font-weight:     400        !important;
}

/* Captcha — tutto su una riga */
body.offerte section#form .form-group:has(#captchaInput) {
  display:        flex        !important;
  flex-wrap:      wrap        !important;
  flex-direction: column      !important;
  align-items:    flex-start  !important;
  gap:            .6em        !important;
}

/* label infocaptcha — riga intera sopra */
body.offerte section#form .form-group:has(#captchaInput) label.infocaptcha {
  width: 100% !important;
}

/* immagini + input sulla stessa riga */
body.offerte section#form .form-group:has(#captchaInput) label#captchaText,
body.offerte section#form .form-group:has(#captchaInput) #captchaInput {
  display:     inline-flex !important;
  align-items: center      !important;
}
body.offerte section#form label.infocaptcha {
  display:        block          !important;
  float:          none           !important;
  width:          100%           !important;
  font-size:      .72em          !important;
  font-style:     normal         !important;
  letter-spacing: .18em          !important;
  text-transform: uppercase      !important;
  color:          var(--sabbia)  !important;
  margin-bottom:  .6em           !important;
  font-weight:    400            !important;
  opacity:        1              !important;
}

/* Riga captcha: immagini + input allineati */
body.offerte section#form label#captchaText {
  display:     flex    !important;
  align-items: center  !important;
  gap:         .3em    !important;
  margin-bottom: .6em  !important;
  font-weight:   400   !important;
  float:         none  !important;
  width:         auto  !important;
}

body.offerte section#form label#captchaText img.captchanum {
  height: 30px !important;
  width:  auto !important;
}

body.offerte section#form label#captchaText img.captchaoper,
body.offerte section#form label#captchaText img.captchauguale {
  height:       15px !important;
  width:        auto !important;
  margin-right: 0    !important;
}

body.offerte section#form #captchaInput {
  width:          50px                          !important;
  background:     rgba(255,255,255,.15)         !important;
  border:         none                          !important;
  border-bottom:  1px solid var(--oro)          !important;
  border-radius:  0                             !important;
  color:          var(--bianco)                 !important;
  font-family:    monospace                     !important;
  font-size:      1.4em                         !important;
  font-weight:    600                           !important;
  padding:        0 .3em                        !important;
  outline:        none                          !important;
  box-shadow:     none                          !important;
  height:         30px                          !important;
  text-align:     center                        !important;
  vertical-align: middle                        !important;
}

body.offerte section#form img.captchaoper {
  filter: invert(1) !important;
}

body.offerte section#form img.captchauguale {
  filter: invert(1) !important;
}

/* Pulsante Invia */
body.offerte section#form #inviaformrichiesta,
body.offerte section#form input#inviaformrichiesta.btn.btn-outline-dark {
  display:        block            !important;
  width:          100%             !important;
  max-width:      100%             !important;
  margin-top:     1em              !important;
  padding:        1em              !important;
  background:     #D7A752        !important;
  color:          var(--bianco)    !important;
  font-family:    var(--font-body) !important;
  font-size:      .8em             !important;
  font-weight:    500              !important;
  letter-spacing: .2em             !important;
  text-transform: uppercase        !important;
  border:         none             !important;
  border-radius:  0                !important;
  cursor:         pointer          !important;
  transition:     background .25s  !important;
}

body.offerte section#form #inviaformrichiesta:hover:not([disabled]),
body.offerte section#form input#inviaformrichiesta.btn.btn-outline-dark:hover:not([disabled]) {
  background:   #d7a752  !important;
  border-color: var(--cotto)  !important;
  color:        var(--bianco) !important;
}

body.offerte section#form #inviaformrichiesta[disabled],
body.offerte section#form input#inviaformrichiesta.btn.btn-outline-dark[disabled] {
  opacity:    .45          !important;
  cursor:     not-allowed  !important;
  background: var(--terra) !important;
}

.offerte #prenota {
    display: none !important;
}


/* === 8. BOOKNOW mobile === */

body.offerte #booknow { display: none !important; }

@media (max-width: 680px) {
  body.offerte #booknow {
    position:   fixed        !important;
    bottom:     0            !important;
    left:       0            !important;
    right:      0            !important;
    z-index:    999          !important;
    background: var(--terra) !important;
    text-align: center       !important;
    padding:    1em          !important;
  }
  body.offerte #booknow h3 {
    color:          var(--bianco)    !important;
    font-family:    var(--font-body) !important;
    font-size:      .78em            !important;
    font-weight:    500              !important;
    letter-spacing: .2em             !important;
    text-transform: uppercase        !important;
    margin:         0                !important;
    animation:      none             !important;
  }
  body.offerte section#slideshow { min-height: 70vh     !important; }
  body.offerte                   { padding-bottom: 56px !important; }
}


/* === 9. ANIMAZIONE HERO === */

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: translateY(0); }
}

body.offerte section#slideshow .contenitore {
  animation:       fadeUp .9s ease both !important;
  animation-delay: .3s                  !important;
}

body.offerte a#scroll-offerte-new,
body.offerte a#scroll-offerte-new span,
body.offerte a#scroll-offerte-new2,
body.offerte a#scroll-offerte-new2 span {
  background:     #D7A752          !important;
  color:          var(--bianco)    !important;
  border-color:   #D7A752          !important;
  font-family:    var(--font-body) !important;
  font-size:      .8em             !important;
  font-weight:    800              !important;
  letter-spacing: .2em             !important;
  text-transform: uppercase        !important;
  padding:        .9em 2.5em       !important;
  display:        inline-block     !important;
  margin-top:     1.5em            !important;
  transition:     background .25s  !important;
  cursor:         pointer          !important;
}

body.offerte a#scroll-offerte-new:hover,
body.offerte a#scroll-offerte-new:hover span,
body.offerte a#scroll-offerte-new2:hover,
body.offerte a#scroll-offerte-new2:hover span {
  background:   #c4943e !important;
  border-color: #c4943e !important;
}

body.offerte a#scroll-offerte-new2 span, body.offerte a#scroll-offerte-new span {
    margin-top: 0 !important;
}

body.offerte a#scroll-offerte-new, body.offerte a#scroll-offerte-new2 {
    margin-top: 30px !important;
}

/* === BTN FIXED — visibile solo sotto 992px === */

body.offerte section#btn-fixed {
  display: none !important;
}

@media (max-width: 992px) {
  body.offerte section#btn-fixed {
    display:    block        !important;
    position:   fixed        !important;
    bottom:     0            !important;
    left:       0            !important;
    right:      0            !important;
    z-index:    999          !important;
    text-align: center       !important;
    padding:    0            !important;
    margin:     0            !important;
  }

  body.offerte section#btn-fixed .colonna,
  body.offerte section#btn-fixed .custom-col,
  body.offerte section#btn-fixed .contenitore {
    padding: 0 !important;
    margin:  0 !important;
  }

  body.offerte a#scroll-offerte-new3,
  body.offerte a#scroll-offerte-new3 span {
    display:        block     !important;
    width:          100%      !important;
    background:     #D7A752   !important;
    color:          #ffffff   !important;
    border-color:   #D7A752   !important;
    font-size:      .85em     !important;
    font-weight:    800       !important;
    letter-spacing: .2em      !important;
    text-transform: uppercase !important;
    padding:        1em 0     !important;
    text-align:     center    !important;
    cursor:         pointer   !important;
    transition:     background .25s !important;
  }

  body.offerte a#scroll-offerte-new3:hover,
  body.offerte a#scroll-offerte-new3:hover span {
    background:   #c4943e !important;
    border-color: #c4943e !important;
  }
}