/* Pagina Hotel e spa · stile Apple adattato (Randy, 27/10/2026): Geist, nero profondo e sezioni chiare alternate,
   titoli grandi e compatti, una sola sfumatura neon calda (oro → corallo) per titoli, bordi e linee.
   Movimento lento: il film cresce in scena, il paragrafo dei problemi si accende parola per parola, i bordi neon girano. */
@property --hx-a{syntax:'<angle>';initial-value:0deg;inherits:false}
.hx{--bg:#000;--bg2:#0D0D0F;--tile:#121214;--tx:#F5F5F7;--tx2:#A1A1A6;--line:rgba(255,255,255,.09);
  --lt:#F5F5F7;--ltx:#1D1D1F;--ltx2:#6E6E73;--warm:#FFB067;
  --neon:linear-gradient(90deg,#FFE3A6 0%,#FFB067 34%,#FF8A6B 66%,#FF6B8B 100%);
  --e:cubic-bezier(.16,1,.3,1);--f:"Geist",-apple-system,"SF Pro Display",system-ui,sans-serif;
  background:var(--bg);color:var(--tx);font-family:var(--f);-webkit-font-smoothing:antialiased}
.hx main{padding-top:0;overflow:clip}
.hx main *{font-family:var(--f)}
.hx-wrap{max-width:1180px;margin:0 auto;padding:0 clamp(20px,5vw,48px)}
.hx-eye{margin:0 0 14px;font:600 clamp(15px,1.4vw,19px)/1.3 var(--f);color:var(--warm);letter-spacing:-.01em}
.hx-h1,.hx-h2{font-weight:650;letter-spacing:-.035em;margin:0;text-wrap:balance}
.hx-h1{font-size:clamp(46px,8.4vw,128px);line-height:.98}
.hx-h2{font-size:clamp(38px,5.6vw,84px);line-height:1.02}
.hx-h1 em,.hx-h2 em,.hx-turn,.hx-proof b,.hx-n{font-style:normal;background:var(--neon);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:hx-flow 9s ease-in-out infinite alternate}
@keyframes hx-flow{to{background-position:100% 0}}
.hx-p{font:400 clamp(17px,1.5vw,21px)/1.5 var(--f);color:var(--tx2);margin:18px 0 0;max-width:44ch;letter-spacing:-.01em}

/* bottoni: pillola neon calda con alone; link «›» */
.hx .hx-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:16px 28px;border-radius:999px;border:0;cursor:pointer;background:var(--neon);background-size:180% 100%;
  color:#1A0E08;font:600 16px/1 var(--f);letter-spacing:-.01em;text-transform:none;text-decoration:none;box-shadow:0 0 0 0 rgba(255,140,100,0);transition:box-shadow .6s var(--e),background-position .8s var(--e),transform .6s var(--e)}
.hx .hx-btn:hover{background-position:100% 0;box-shadow:0 10px 40px -8px rgba(255,140,100,.7);transform:translateY(-1px)}
.hx-more{font:500 17px/1 var(--f);color:var(--warm);text-decoration:none;letter-spacing:-.01em}
.hx-more:hover{text-decoration:underline}
.hx-ctas{display:flex;flex-wrap:wrap;gap:18px 30px;align-items:center;justify-content:center;margin-top:32px}

/* hero: testo al centro, il film entra in scena e cresce mentre si scorre */
.hx-hero{position:relative;padding:calc(var(--hdr,76px) + clamp(48px,9vh,96px)) 0 0;text-align:center;isolation:isolate}
.hx-hero::before{content:"";position:absolute;left:50%;top:38%;width:min(1100px,120vw);height:70vh;transform:translateX(-50%);z-index:-1;
  background:radial-gradient(closest-side,rgba(255,150,100,.28),rgba(255,107,139,.12) 55%,rgba(0,0,0,0));filter:blur(40px);animation:hx-breathe 8s ease-in-out infinite alternate}
@keyframes hx-breathe{to{opacity:.6;transform:translateX(-50%) scale(1.08)}}
.hx-head{max-width:1000px;margin:0 auto;padding:0 clamp(20px,5vw,48px)}
.hx-head>*{animation:hx-in 1.8s var(--e) both}.hx-head>*:nth-child(2){animation-delay:.2s}.hx-head>*:nth-child(3){animation-delay:.45s}.hx-head>*:nth-child(4){animation-delay:.7s}
@keyframes hx-in{from{opacity:0;transform:translateY(26px);filter:blur(10px)}}
.hx-sub{font:400 clamp(18px,1.7vw,23px)/1.45 var(--f);color:var(--tx2);max-width:40ch;margin:26px auto 0;letter-spacing:-.012em}
.hx-stage{padding:clamp(48px,8vh,90px) clamp(12px,3vw,40px) 0}
.hx-frame{--s:.86;--r:44px;position:relative;width:min(1280px,100%);margin:0 auto;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;transform:scale(var(--s));transform-origin:50% 0;
  box-shadow:0 60px 160px -40px rgba(255,130,90,.45),0 0 0 1px rgba(255,255,255,.08);will-change:transform;animation:hx-in 2s var(--e) .6s both}
.hx .hx-frame .hs-bg,.hx .hx-frame .hs-bg img,.hx .hx-frame .hs-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hx .hx-frame .hs-vid{z-index:1}

/* cifre */
.hx-proof{padding:clamp(70px,11vh,120px) 0 clamp(40px,6vh,70px)}
.hx-proof ul{list-style:none;margin:0 auto;padding:0 clamp(20px,5vw,48px);max-width:1180px;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.hx-proof b{display:block;font:650 clamp(48px,6vw,88px)/1 var(--f);letter-spacing:-.04em}
.hx-proof span{display:block;margin-top:10px;font:500 15px/1.35 var(--f);color:var(--tx2)}

/* il paragrafo dei problemi che si accende parola per parola */
.hx-say{padding:clamp(80px,14vh,160px) 0}
.hx-big{margin:0;font:650 clamp(34px,5vw,72px)/1.08 var(--f);letter-spacing:-.035em;color:#2B2B2E}
.hx-w{transition:color .5s var(--e)}.hx-w.on{color:var(--tx)}
.hx-src{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:clamp(40px,7vh,70px);padding-top:26px;border-top:1px solid var(--line)}
.hx-src p{margin:0;font:400 15px/1.5 var(--f);color:var(--tx2)}
.hx-src b{display:block;font-weight:600;color:var(--tx);margin-bottom:6px}
.hx-src small{display:block;margin-top:8px;font:500 12px/1.3 var(--f);color:#6E6E73}
.hx-turn{margin:clamp(50px,8vh,90px) 0 0;font:650 clamp(34px,4.6vw,64px)/1.05 var(--f);letter-spacing:-.035em}

/* risultati: sezione chiara, come le pagine Apple */
.hx .hx-light{background:var(--lt);color:var(--ltx)}
.hx .hx-light .h2{font:650 clamp(36px,4.6vw,64px)/1.04 var(--f);letter-spacing:-.035em;color:var(--ltx)}
.hx .hx-light .h2 em{font-style:normal;color:#E0663F}
.hx .hx-light .eyebrow{font:600 17px/1.3 var(--f);letter-spacing:-.01em;text-transform:none;color:#E0663F}
.hx .hx-light .eyebrow::before{display:none}
.hx .hx-light .lead{color:var(--ltx2);font:400 19px/1.5 var(--f)}

/* bento: una tessera grande con l'immagine, tre piccole; bordi neon che girano quando entrano */
.hx-bento-s{padding:clamp(90px,14vh,160px) 0}
.hx-bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(220px,auto);gap:18px;margin-top:clamp(40px,6vh,64px)}
.hx-tile{position:relative;padding:34px 30px;border-radius:30px;background:var(--tile);overflow:hidden;isolation:isolate;opacity:0;transform:translateY(30px) scale(.98);transition:opacity 1.4s var(--e),transform 1.6s var(--e)}
.hx-tile:nth-child(2){grid-column:span 2}
.hx-tile-img{grid-column:span 2;grid-row:span 2;display:grid;align-content:end;min-height:520px}
.hx-tile-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%;z-index:-2;transform:scale(1.08);transition:transform 2.4s var(--e)}
.hx-tile-img::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(0,0,0,.88),rgba(0,0,0,.1) 55%)}
.hx-bento.in .hx-tile{opacity:1;transform:none}.hx-bento.in .hx-tile-img img{transform:scale(1)}
.hx-bento.in .hx-tile:nth-child(2){transition-delay:.12s}.hx-bento.in .hx-tile:nth-child(3){transition-delay:.24s}.hx-bento.in .hx-tile:nth-child(4){transition-delay:.36s}
.hx-tile::before,.hx-card.rec::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;z-index:2;pointer-events:none;
  background:conic-gradient(from var(--hx-a),rgba(255,255,255,.06) 0deg,rgba(255,255,255,.06) 200deg,#FFB067 260deg,#FF6B8B 300deg,rgba(255,255,255,.06) 340deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:hx-spin 7s linear infinite}
@keyframes hx-spin{to{--hx-a:360deg}}
.hx-tile h3,.hx-card h3{margin:14px 0 10px;font:650 clamp(24px,2.2vw,32px)/1.08 var(--f);letter-spacing:-.025em;color:var(--tx)}
.hx-tile p,.hx-card p{margin:0;font:400 17px/1.5 var(--f);color:var(--tx2);letter-spacing:-.01em}
.hx-n{font:600 14px/1 var(--f);letter-spacing:0}

/* soggiorno: la linea neon si disegna */
.hx-stay{padding:clamp(80px,12vh,140px) 0;background:var(--bg2)}
.hx-line{list-style:none;margin:clamp(44px,7vh,70px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);position:relative}
.hx-line::before{content:"";position:absolute;left:0;right:0;top:7px;height:2px;border-radius:2px;background:var(--neon);box-shadow:0 0 18px rgba(255,140,100,.7);transform:scaleX(0);transform-origin:left;transition:transform 2.4s var(--e)}
.hx-line.in::before{transform:scaleX(1)}
.hx-line li{position:relative;padding:38px 28px 0 0;display:grid;gap:10px;opacity:0;transform:translateY(18px);transition:opacity 1.2s var(--e),transform 1.4s var(--e);transition-delay:calc(.5s + var(--i) * .45s)}
.hx-line.in li{opacity:1;transform:none}
.hx-line li::before{content:"";position:absolute;left:0;top:0;width:16px;height:16px;border-radius:50%;background:#FFB067;box-shadow:0 0 0 6px rgba(255,176,103,.16),0 0 22px rgba(255,140,100,.9)}
.hx-line b{font:650 clamp(24px,2.2vw,30px)/1.1 var(--f);letter-spacing:-.025em}
.hx-line span{font:400 17px/1.5 var(--f);color:var(--tx2);max-width:30ch}

/* lettura del corpo: stessa sezione, vestita Apple */
.hx .kr-read,.hx .kr-stage{background:var(--bg)}
.hx .kr-h{font:650 clamp(38px,5vw,76px)/1.02 var(--f);letter-spacing:-.035em}
.hx .kr-k{font:600 17px/1.3 var(--f);letter-spacing:-.01em;text-transform:none;color:var(--warm)}
.hx .kr-list li::before{font:600 13px/1.9 var(--f);color:var(--warm)}
.hx .kr-list b{font:600 19px/1.3 var(--f)}.hx .kr-list span,.hx .kr-p,.hx .kr-b{font-family:var(--f);color:var(--tx2)}
.hx .kr-b{border-left-color:#FFB067}
.hx .kr-lym{stroke:#FF9F6E}.hx .kr-pt .kr-dot{fill:#FFB067}.hx .kr-pt .kr-halo{stroke:#FF8A6B}

/* formati */
.hx-formats{padding:clamp(90px,14vh,160px) 0}
.hx-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:clamp(40px,6vh,64px)}
.hx-card{position:relative;padding:30px 26px 34px;border-radius:28px;background:var(--tile);display:grid;align-content:start}
.hx-rec{justify-self:start;margin-bottom:16px;padding:7px 12px;border-radius:999px;background:var(--neon);color:#1A0E08;font:600 12px/1 var(--f)}
.hx-note{margin:28px 0 0;font:400 15px/1.5 var(--f);color:var(--tx2)}

/* Kiara */
.hx-kiara{padding:clamp(80px,12vh,140px) 0;background:var(--bg2)}
.hx-two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);align-items:center}
.hx-por{position:relative;display:grid;place-items:end center;min-height:480px;border-radius:32px;overflow:hidden;background:#0A0A0B}
.hx-por::before{content:"";position:absolute;left:50%;bottom:-10%;width:90%;height:80%;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(255,150,100,.45),rgba(255,107,139,.15) 60%,rgba(0,0,0,0));filter:blur(30px)}
.hx-por img{position:relative;width:min(80%,400px);height:auto;-webkit-mask-image:linear-gradient(180deg,#000 82%,transparent);mask-image:linear-gradient(180deg,#000 82%,transparent)}

/* contatto: sezione chiara, modulo bianco */
.hx-contact{padding:clamp(90px,14vh,150px) 0;background:var(--lt);color:var(--ltx)}
.hx-contact .hx-h2{color:var(--ltx)}.hx-contact .hx-h2 em{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:#E0663F;animation:none}
.hx-contact .hx-eye{color:#E0663F}.hx-contact .hx-p{color:var(--ltx2)}
.hx-get{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:12px}
.hx-get li{position:relative;padding-left:30px;font:400 18px/1.45 var(--f);color:var(--ltx)}
.hx-get li::before{content:"";position:absolute;left:0;top:.45em;width:14px;height:8px;border-left:2px solid #E0663F;border-bottom:2px solid #E0663F;transform:rotate(-45deg)}
.hx-direct{margin:26px 0 0;font:400 16px/1.6 var(--f);color:var(--ltx2)}.hx-direct a{color:#C4502D}
.hx .hs-form,.hx .hs-done{background:#FFF;border:0;border-radius:28px;box-shadow:0 30px 80px -40px rgba(0,0,0,.25);padding:clamp(24px,3vw,40px)}
.hx .hs-f span,.hx .hs-int legend{font:500 13px/1.2 var(--f);letter-spacing:0;text-transform:none;color:var(--ltx2)}
.hx .hs-f input,.hx .hs-f textarea{background:#FFF;border:1px solid #D2D2D7;border-radius:12px;color:var(--ltx);font:400 17px/1.3 var(--f)}
.hx .hs-f input:focus,.hx .hs-f textarea:focus{border-color:#FF8A6B;box-shadow:0 0 0 4px rgba(255,138,107,.18)}
.hx .hs-int span{border-color:#D2D2D7;color:var(--ltx);font:500 14px/1 var(--f)}
.hx .hs-int input:checked + span{background:var(--ltx);border-color:var(--ltx);color:#FFF}
.hx .hs-c{color:var(--ltx2);font:400 13px/1.5 var(--f)}.hx .hs-c a{color:var(--ltx)}
.hx .hs-err{color:#C4302D}
.hx .hs-done-t{font:650 clamp(28px,3vw,40px)/1.1 var(--f);letter-spacing:-.03em;color:var(--ltx)}

@media (max-width:1000px){
  .hx-proof ul{grid-template-columns:1fr 1fr;row-gap:40px}
  .hx-src{grid-template-columns:1fr 1fr}
  .hx-bento,.hx-cards{grid-template-columns:1fr 1fr}
}
@media (max-width:700px){
  .hx-frame{aspect-ratio:4/5;--r:28px}
  .hx-bento,.hx-cards,.hx-two,.hx-src{grid-template-columns:1fr}
  .hx-tile:nth-child(2),.hx-tile-img{grid-column:auto;grid-row:auto}
  .hx-tile-img{min-height:440px}
  .hx-line{grid-template-columns:1fr;gap:30px}
  .hx-line::before{left:7px;right:auto;top:0;bottom:0;width:2px;height:auto;transform:scaleY(0);transform-origin:top}
  .hx-line.in::before{transform:scaleY(1)}
  .hx-line li{padding:0 0 0 40px}
  .hx-por{min-height:380px}
}
@media (prefers-reduced-motion:reduce){
  .hx-head>*,.hx-frame,.hx-hero::before{animation:none}.hx-frame{--s:1}
  .hx-h1 em,.hx-h2 em,.hx-turn,.hx-proof b,.hx-n,.hx-tile::before,.hx-card.rec::before{animation:none}
  .hx-w{color:var(--tx)}.hx-tile,.hx-line li{opacity:1;transform:none;transition:none}.hx-line::before{transform:none}
}
.hx .mcta{background:var(--neon);color:#1A0E08;border:0;font:600 16px/1 var(--f);letter-spacing:-.01em;text-transform:none;box-shadow:0 10px 40px -10px rgba(255,140,100,.6)}
.hx .mcta .ar{display:none}
.hx-faq{padding:clamp(80px,12vh,140px) 0;background:var(--bg)}
.hx-qs{margin-top:clamp(30px,5vh,50px);max-width:900px}
.hx-q{border-top:1px solid var(--line)}.hx-q:last-child{border-bottom:1px solid var(--line)}
.hx-q summary{list-style:none;cursor:pointer;position:relative;padding:24px 44px 24px 0;font:600 clamp(19px,1.8vw,24px)/1.3 var(--f);letter-spacing:-.02em;color:var(--tx)}
.hx-q summary::-webkit-details-marker{display:none}
.hx-q summary::after{content:"+";position:absolute;right:4px;top:20px;font:300 30px/1 var(--f);color:var(--warm);transition:transform .5s var(--e)}
.hx-q[open] summary::after{transform:rotate(45deg)}
.hx-q p{margin:0 0 26px;font:400 17px/1.55 var(--f);color:var(--tx2);max-width:64ch}
/* arabo, da destra a sinistra */
[dir=rtl] .hx-get li{padding-left:0;padding-right:30px}[dir=rtl] .hx-get li::before{left:auto;right:0}
[dir=rtl] .hx-line li{padding:38px 0 0 28px}[dir=rtl] .hx-line li::before{left:auto;right:0}[dir=rtl] .hx-line::before{transform-origin:right}
[dir=rtl] .hx-q summary{padding:24px 0 24px 44px}[dir=rtl] .hx-q summary::after{right:auto;left:4px}
[dir=rtl] .hx-rec{justify-self:end}[dir=rtl] .kr-b{border-left:0;border-right:1px solid #FFB067;padding-left:0;padding-right:16px}
@media (max-width:700px){[dir=rtl] .hx-line li{padding:0 40px 0 0}[dir=rtl] .hx-line::before{left:auto;right:7px}}
