/* ============================================================
   FRAME AM — V13 · Home "Immersive Editorial"
   Hero centrato a tutto schermo + vetrina flottante sovrapposta.
   Mantiene palette, font e componenti esistenti (style/restyle/v10).
   Caricare DOPO gli altri fogli di stile. Scope: body.v13-home
   ============================================================ */

/* ---------- Header: trasparente sopra la hero, solido allo scroll ---------- */
body.v13-home .site-header{background:transparent;border-bottom-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;position:fixed}
body.v13-home .site-header.scrolled{background:rgba(13,13,12,.92);border-bottom-color:var(--line-d);-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%)}
body.v13-home #main{margin-top:-92px}

/* ---------- HERO: composizione centrale, quasi full-viewport ---------- */
body.v13-home .lux-hero{min-height:100svh;justify-content:flex-start;padding:clamp(140px,17vh,190px) 0 clamp(170px,20vh,220px);text-align:center}
body.v13-home .lux-hero-inner{max-width:1000px;margin-inline:auto;display:flex;flex-direction:column;align-items:center}
body.v13-home .lux-hero-eyebrow{font-family:var(--serif);font-size:clamp(.72rem,1vw,.82rem);letter-spacing:.04em;text-transform:none;color:var(--gold-soft);font-style:italic;font-weight:400;margin-bottom:18px;align-self:flex-start;opacity:.9}
body.v13-home .lux-hero-title{font-family:var(--display);font-size:clamp(2.5rem,5.6vw,4.6rem);line-height:1.06;letter-spacing:-.01em;margin:0 0 26px;font-weight:500}
body.v13-home .lux-hero-title .lux-line .w.gold{font-style:italic;font-weight:600}
body.v13-home .lux-hero-sub{margin:0 auto 38px;max-width:620px;font-size:clamp(1rem,1.45vw,1.14rem)}
body.v13-home .lux-hero-cta{justify-content:center;gap:18px}
body.v13-home .lux-btn-gold{min-height:60px;padding:0 40px;letter-spacing:.16em}

/* velo scenografico più profondo, come nei riferimenti */
body.v13-home .lux-photo::after{background:
  radial-gradient(120% 90% at 50% 0%,rgba(10,10,9,.42) 0%,rgba(10,10,9,.72) 55%,rgba(10,10,9,.9) 100%),
  linear-gradient(180deg,rgba(10,10,9,.62) 0%,rgba(10,10,9,.5) 40%,rgba(10,10,9,.92) 100%)}
body.v13-home .lux-orb{opacity:.26}

/* ---------- Pill di navigazione delle sezioni (sotto la CTA) ---------- */
.v13-pills{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:46px auto 0;padding:8px;border-radius:999px;background:rgba(20,19,15,.42);border:1px solid var(--line-d);-webkit-backdrop-filter:blur(14px) saturate(130%);backdrop-filter:blur(14px) saturate(130%);width:fit-content;max-width:calc(100% - 32px)}
.v13-pill{font-family:var(--sans);font-size:.78rem;font-weight:400;letter-spacing:.04em;color:var(--cream-text);padding:11px 22px;border-radius:999px;border:1px solid transparent;white-space:nowrap;transition:all .45s var(--ease)}
.v13-pill:hover{color:#fff;background:rgba(255,255,255,.06)}
.v13-pill.is-hot{border-color:var(--gold-soft);color:var(--gold-soft)}
.v13-pill.is-hot:hover{background:var(--gold);border-color:var(--gold);color:var(--ink)}

/* ---------- Ticker: nastro sottile in flusso, sotto le pill ---------- */
body.v13-home .lux-ticker{position:relative;z-index:1;margin:clamp(48px,7vh,72px) 0 0;border-bottom:0;background:rgba(10,10,9,.35)}
body.v13-home .lux-ticker-track{padding:13px 0}

/* ---------- VETRINA FLOTTANTE (elemento firma) ---------- */
.v13-stage{position:relative;z-index:5;margin-top:clamp(-170px,-16vh,-110px);padding:0 0 clamp(60px,8vw,110px);background:transparent;pointer-events:none}
.v13-stage .wrap{pointer-events:auto}
.v13-frame{position:relative;display:grid;grid-template-columns:1.15fr .95fr;min-height:clamp(440px,56vh,580px);border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line-d2);background:var(--char);box-shadow:0 60px 120px -40px rgba(5,5,4,.8),0 0 0 8px rgba(10,10,9,.35);animation:v13Float 9s ease-in-out infinite alternate;will-change:transform}
@keyframes v13Float{from{transform:translateY(0)}to{transform:translateY(-10px)}}

.v13-frame-media{position:relative;overflow:hidden}
.v13-frame-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.04);transition:transform 1.6s var(--ease)}
.v13-frame:hover .v13-frame-media img{transform:scale(1.1)}
.v13-frame-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 60%,rgba(20,19,15,.55) 100%)}
.v13-frame-media figcaption{position:absolute;left:0;right:0;bottom:0;padding:40px 26px 18px;font-family:var(--sans);font-size:.82rem;letter-spacing:.01em;text-transform:none;font-weight:400;color:rgba(245,241,233,.92);background:linear-gradient(0deg,rgba(10,10,9,.82),transparent)}

.v13-frame-panel{position:relative;display:flex;flex-direction:column;padding:clamp(26px,3vw,42px) clamp(26px,3.2vw,46px) 0;background:linear-gradient(160deg,var(--char-2) 0%,var(--char) 70%);color:var(--cream-text);overflow:hidden}
.v13-panel-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:20px;border-bottom:1px solid var(--line-d)}
.v13-panel-brand{display:inline-flex;align-items:center}
.v13-panel-logo{height:24px;width:auto;display:block;filter:brightness(1.05)}
.v13-panel-nav{display:flex;gap:18px}
.v13-panel-nav a{font-family:var(--sans);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--soft-d);white-space:nowrap;transition:color .4s var(--ease)}
.v13-panel-nav a:hover{color:var(--gold-soft)}
.v13-panel-cta{font-family:var(--sans);font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--cream-text);border:1px solid var(--line-d2);border-radius:999px;padding:10px 20px;transition:all .45s var(--ease)}
.v13-panel-cta:hover{background:var(--gold);border-color:var(--gold);color:var(--ink)}

.v13-panel-copy{margin:26px auto 0;max-width:44ch;font-size:.92rem;font-weight:300;line-height:1.9;text-align:justify;text-align-last:center;color:var(--cream-text)}
.v13-panel-marks{display:flex;align-items:baseline;justify-content:center;gap:18px;margin:30px 0 6px}
.v13-mark{display:flex;flex-direction:column;align-items:center;gap:6px}
.v13-mark b{font-family:var(--serif);font-weight:500;font-size:1.55rem;color:#fff;line-height:1}
.v13-mark span{font-family:var(--sans);font-size:.56rem;letter-spacing:.26em;text-transform:uppercase;color:var(--soft-d)}
.v13-mark-sep{color:var(--gold-2);font-size:.9rem;align-self:center}

.v13-panel-word{margin-top:auto;padding-bottom:clamp(18px,2.4vw,30px);font-family:var(--display);font-weight:600;color:#fff;font-size:clamp(3rem,6vw,5.2rem);line-height:.92;letter-spacing:.04em;text-align:center;white-space:nowrap;opacity:.96;pointer-events:none;user-select:none}
.v13-panel-word .gold{color:var(--gold-soft)}

/* ---------- Rifiniture alle sezioni esistenti ---------- */
body.v13-home .fx-vista{min-height:74vh}
body.v13-home .fx-vista-quote{font-size:clamp(2rem,4.6vw,3.6rem)}
body.v13-home .lux-worlds .lux-world{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
body.v13-home .lux-hero-eyebrow{flex-wrap:wrap;justify-content:center}

/* ---------- Responsive ---------- */
@media (max-width:1040px){
  .v13-frame{grid-template-columns:1fr;min-height:0;background:var(--char);isolation:isolate}
  .v13-frame-media{min-height:300px;order:-1}
  .v13-frame-media::after{background:linear-gradient(180deg,transparent 55%,rgba(20,19,15,.6) 100%)}
  .v13-frame-panel{background:var(--char)}
  .v13-panel-nav{display:none}
  .v13-panel-word{font-size:clamp(3rem,11vw,4.6rem)}
}
@media (max-width:760px){
  body.v13-home .lux-hero{min-height:92svh;padding:120px 0 200px}
  body.v13-home .lux-hero-title{font-size:clamp(2.5rem,11.5vw,3.4rem)}
  .v13-pills{gap:2px;padding:6px}
  .v13-pill{padding:9px 14px;font-size:.7rem}
  .v13-stage{margin-top:-130px}
  .v13-frame{border-radius:var(--r);animation:none}
  .v13-panel-top{flex-wrap:wrap;justify-content:center;text-align:center}
  .v13-panel-copy{text-align:center;text-align-last:auto}
  .v13-panel-marks{flex-wrap:wrap}
  body.v13-home .lux-scroll-hint{display:none}
}

/* ---------- Accessibilità e movimento ridotto ---------- */
.v13-pill:focus-visible,.v13-panel-nav a:focus-visible,.v13-panel-cta:focus-visible{outline:2px solid var(--gold-soft);outline-offset:3px;border-radius:999px}
@media (prefers-reduced-motion:reduce){
  .v13-frame{animation:none}
  .v13-frame-media img,.v13-frame:hover .v13-frame-media img{transform:none;transition:none}
  body.v13-home .lux-photo{animation:none}
}

/* ============================================================
   BLOCCHI cfm — sezioni "Metodo" e "Modello operativo"
   Portati dalla versione v16 (home-cfm.css), namespacizzati su
   body.v13-home per non interferire con le altre pagine.
   ============================================================ */
body.v13-home .cfm-eyebrow{display:block;font-family:var(--sans);font-size:.7rem;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:18px}
body.v13-home .cfm-h2{font-family:var(--serif);font-weight:500;letter-spacing:-.01em;font-size:clamp(2rem,3.9vw,3.2rem);line-height:1.1;color:var(--ivory);margin:0 0 20px}
body.v13-home .cfm-h2 .gold{color:var(--gold-soft);font-style:italic;font-family:var(--serif)}
body.v13-home .cfm-lead{font-size:clamp(1.02rem,1.35vw,1.16rem);line-height:1.8;font-weight:300;color:var(--cream-text);max-width:560px;margin:0 0 28px}
body.v13-home .cfm-link{display:inline-flex;align-items:center;gap:12px;text-decoration:none;font-family:var(--sans);font-size:.78rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory)}
body.v13-home .cfm-link i{font-style:normal;display:inline-block;width:34px;height:1px;background:var(--gold);position:relative;transition:width .35s var(--ease)}
body.v13-home .cfm-link i:after{content:"";position:absolute;right:-1px;top:-3.5px;width:8px;height:8px;border-top:1px solid var(--gold);border-right:1px solid var(--gold);transform:rotate(45deg)}
body.v13-home .cfm-link:hover{color:var(--gold-soft)}
body.v13-home .cfm-link:hover i{width:52px}

body.v13-home .cfm-block{position:relative;padding:clamp(84px,10vw,140px) 0;background:radial-gradient(120% 130% at 85% 0%,rgba(28,26,21,.72) 0%,rgba(13,13,12,.86) 58%)}
body.v13-home .cfm-block.is-tint{background:radial-gradient(120% 130% at 12% 0%,rgba(36,33,26,.72) 0%,rgba(20,19,15,.9) 60%)}
body.v13-home .cfm-block-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(44px,7vw,110px);align-items:center}
body.v13-home .cfm-block.is-reverse .cfm-block-copy{order:2}
body.v13-home .cfm-block.is-reverse .cfm-block-media{order:1}

body.v13-home .cfm-block-media{position:relative;overflow:hidden;height:clamp(360px,44vw,560px);border-radius:var(--r);box-shadow:0 40px 90px -50px rgba(0,0,0,.8)}
body.v13-home .cfm-block-media img{display:block;width:100%;height:118%;object-fit:cover;margin-top:-9%;transform:translateY(var(--plx,0px)) scale(1.001);will-change:transform;filter:saturate(.55) brightness(.86);transition:filter .8s var(--ease),transform .8s var(--ease)}
body.v13-home .cfm-block-media:hover img{filter:saturate(1) brightness(1);transform:translateY(var(--plx,0px)) scale(1.045)}
body.v13-home .cfm-block-media:after{content:"";position:absolute;left:0;bottom:0;width:88px;height:3px;background:var(--gold);transition:width .6s var(--ease);z-index:2}
body.v13-home .cfm-block-media:hover:after{width:100%}
body.v13-home .cfm-block-media:before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(160deg,rgba(10,10,9,0) 55%,rgba(10,10,9,.42) 100%)}

body.v13-home .cfm-steps{list-style:none;margin:6px 0 30px;padding:0;border-top:1px solid var(--line-d2);max-width:560px}
body.v13-home .cfm-steps li{display:grid;grid-template-columns:44px 150px 1fr;gap:14px;align-items:baseline;padding:13px 0;border-bottom:1px solid var(--line-d)}
body.v13-home .cfm-steps li b{font-family:var(--serif);font-weight:400;font-size:.92rem;color:var(--gold)}
body.v13-home .cfm-steps li strong{font-family:var(--sans);font-weight:500;font-size:.98rem;color:var(--ivory);letter-spacing:.02em}
body.v13-home .cfm-steps li span{font-weight:300;font-size:.92rem;color:var(--soft);line-height:1.5}

body.v13-home .cfm-features{display:grid;grid-template-columns:1fr 1fr;gap:26px 34px;margin:8px 0 30px}
body.v13-home .cfm-feature{border-top:1px solid var(--line-d2);padding-top:16px}
body.v13-home .cfm-feature em{display:block;font-style:normal;font-family:var(--sans);font-size:.64rem;font-weight:500;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:8px}
body.v13-home .cfm-feature h3{font-family:var(--serif);font-weight:500;font-size:1.3rem;color:var(--ivory);margin:0 0 6px;line-height:1.25}
body.v13-home .cfm-feature p{margin:0;font-weight:300;font-size:.9rem;line-height:1.65;color:var(--soft)}

@media (max-width:960px){
  body.v13-home .cfm-block-grid{grid-template-columns:1fr;gap:36px}
  body.v13-home .cfm-block.is-reverse .cfm-block-copy{order:1}
  body.v13-home .cfm-block.is-reverse .cfm-block-media{order:2}
  body.v13-home .cfm-block-media{height:clamp(260px,52vw,420px)}
  body.v13-home .cfm-features{grid-template-columns:1fr}
}
@media (max-width:640px){
  body.v13-home .cfm-steps li{grid-template-columns:36px 1fr;row-gap:2px}
  body.v13-home .cfm-steps li span{grid-column:2}
}
@media (prefers-reduced-motion:reduce){
  body.v13-home .cfm-block-media img{transition:none;filter:none;transform:none}
}

/* ============================================================
   CHIVO — titoli di sezione in MAIUSCOLO (stile frameam.ch)
   Applicato ai titoli di sezione principali e ai titolini dei box.
   Il titolo hero resta in case naturale come da riferimento.
   ============================================================ */
body.v13-home .cfm-h2,
body.v13-home .fx-h2,
body.v13-home .lux-h2,
body.v13-home .cta-card h2,
body.v13-home .cfm-feature h3{
  text-transform:uppercase;
  letter-spacing:.02em;
}
/* le parti "accent" in corsivo dentro i titoli restano leggibili in maiuscolo */
body.v13-home .cfm-h2 .gold,
body.v13-home .cta-card h2 .accent{
  text-transform:uppercase;
}

/* ============================================================
   HERO SNELLO (stile banking: foto in evidenza, titolo leggero)
   - overlay ridotto al minimo (vedi restyle.css .lux-photo::after)
   - titolo leggero, non bold
   - effetti orb/grana attenuati per non sporcare la foto
   - leggera ombra sul testo per leggibilità su foto chiara
   ============================================================ */
body.v13-home .lux-hero-title{
  font-weight:300;
  font-size:clamp(2.2rem,5vw,3.9rem);
  letter-spacing:-.005em;
  text-shadow:0 2px 40px rgba(6,8,14,.72),0 1px 4px rgba(6,8,14,.55);
}
/* la parte "accent" resta distinta ma senza appesantire */
body.v13-home .lux-hero-title .lux-line .w.gold{
  font-style:italic;
  font-weight:400;
}
body.v13-home .lux-hero-eyebrow{
  text-shadow:0 1px 14px rgba(10,12,20,.5);
}
body.v13-home .lux-hero-sub{
  font-weight:300;
  text-shadow:0 1px 3px rgba(6,8,14,.85),0 2px 22px rgba(6,8,14,.7);
}
/* foto più protagonista: attenuo bagliori dorati e grana */
body.v13-home .lux-orb{opacity:0}
body.v13-home .lux-grain{opacity:0}

/* eyebrow hero: corsivo elegante e piccolo, allineato a sinistra */
body.v13-home .lux-hero-eyebrow span[data-cms]{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-style:italic;
  font-size:1.18em;
  letter-spacing:.01em;
}
body.v13-home .lux-hero-eyebrow .lux-dot{opacity:.7}

/* ---- rifiniture sezione LUGANO (vetrina sede) ---- */
.v13-panel-top{align-items:center}
.v13-frame-panel::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold-soft),transparent);opacity:.5}
.v13-panel-copy{margin-top:24px}
.v13-panel-copy strong,.v13-panel-copy b{color:var(--gold-soft);font-weight:600}
/* micro-accento sotto il logo del pannello */
.v13-panel-brand{position:relative}

/* ============================================================
   HEADER SEMPRE PRESENTE (fix sticky rotto dal body ad altezza fissa)
   Su questa home il <body> ha height esplicita + overflow, che annulla
   position:sticky. Uso fixed per garantire che l'header resti sempre
   visibile e scorra con la pagina, compensando l'ingombro sull'hero.
   ============================================================ */
body.v13-home .lux-hero{scroll-margin-top:100px;padding-top:clamp(300px,36vh,440px)}

/* Leggibilità del testo dell'hero.
   NIENTE alone dietro al blocco di testo: qualunque riquadro, anche
   sfumato, su fotografie chiare si intravede. Si usa invece un velo
   verticale esteso a tutta la sezione — non avendo bordi laterali non
   può disegnare alcuna forma — insieme all'ombra sui caratteri, come
   sulle copertine delle pagine interne. */
body.v13-home .lux-hero-inner{position:relative}
body.v13-home .lux-hero-inner::before{content:none}
body.v13-home .lux-hero::after{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,
    rgba(6,8,12,0) 0%,
    rgba(6,8,12,.20) 24%,
    rgba(6,8,12,.32) 46%,
    rgba(6,8,12,.26) 66%,
    rgba(6,8,12,.10) 86%,
    rgba(6,8,12,0) 100%);
}
body.v13-home .lux-hero-title,
body.v13-home .lux-hero-sub{text-shadow:0 2px 34px rgba(6,8,12,.72),0 1px 3px rgba(6,8,12,.35)}

/* Un unico velo continuo dietro l'header: parte scuro in cima e svanisce
   dolcemente ben oltre il bordo, così non c'è nessuna linea di stacco. */
body.v13-home .site-header{position:fixed}
body.v13-home .site-header::after{
  content:"";position:absolute;left:0;right:0;top:0;height:220%;
  background:linear-gradient(180deg,rgba(6,8,12,.6) 0%,rgba(6,8,12,.46) 24%,rgba(6,8,12,.3) 44%,rgba(6,8,12,.16) 62%,rgba(6,8,12,.06) 80%,rgba(6,8,12,0) 100%);
  z-index:-1;pointer-events:none;opacity:1;transition:opacity .4s var(--ease);
}
/* quando l'header diventa nero (scrolled) il velo non serve */
body.v13-home .site-header.scrolled::after{opacity:0}

/* ============================================================
   RIQUADRO SEDE (sezione "vetrina") — impaginazione semplificata
   Contiene esclusivamente tre elementi: la fotografia del palazzo,
   il logo e l'indirizzo. Menu rapido, pulsante e paragrafo
   descrittivo sono stati rimossi: le regole seguenti riorganizzano
   il pannello centrando logo e indirizzo sui due assi.
   ============================================================ */
.v13-frame-panel{
  justify-content:center;align-items:center;text-align:center;
  padding:clamp(40px,4.6vw,68px) clamp(26px,3.2vw,46px);
}
.v13-frame-panel .v13-panel-brand{margin-bottom:clamp(24px,2.8vw,36px)}
.v13-frame-panel .v13-panel-logo{height:clamp(30px,3.4vw,40px)}

.v13-panel-address{
  display:flex;flex-direction:column;gap:11px;
  font-style:normal;position:relative;
  padding-top:clamp(24px,2.8vw,36px);
}
/* filetto dorato di separazione fra logo e indirizzo */
.v13-panel-address::before{
  content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:56px;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold-soft),transparent);
}
.v13-addr-street{
  font-family:var(--display);font-weight:600;line-height:1.22;
  font-size:clamp(1.3rem,1.9vw,1.8rem);letter-spacing:.02em;color:#fff;
}
.v13-addr-city{
  font-family:var(--sans);font-size:.78rem;font-weight:400;
  letter-spacing:.26em;text-transform:uppercase;color:var(--gold-soft);
}
.v13-addr-country{
  font-family:var(--sans);font-size:.68rem;font-weight:300;
  letter-spacing:.22em;text-transform:uppercase;color:var(--soft-d);
}

@media (max-width:900px){
  .v13-frame-panel{padding:clamp(34px,7vw,48px) 26px}
  .v13-addr-street{font-size:clamp(1.2rem,5vw,1.5rem)}
}