
:root{
  --black:#08131a;
  --navy:#0d2a3d;
  --ivory:#f3efe8;
  --paper:#f1ede6;
  --ink:#17232b;
  --champagne:#b29872;
  --taupe:#b29872;
  --muted:#d8d2c8;
  --line:rgba(255,255,255,.14);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--black);color:var(--ivory);font-family:Arial,Helvetica,sans-serif}
a{color:inherit;text-decoration:none}
header{
  position:sticky;top:0;z-index:50;height:84px;display:flex;align-items:center;justify-content:space-between;
  padding:0 4vw;background:rgba(8,19,26,.97);border-bottom:1px solid var(--line)
}
.brand{display:flex;align-items:center;gap:14px}
.brand img{height:58px;width:auto;display:block}
.brand span{font:12px Georgia,'Times New Roman',serif;letter-spacing:3px}
nav{display:flex;gap:14px;align-items:center}
nav a{font-size:8.5px;letter-spacing:1.1px;color:#d9d3ca;padding:8px 0;border-bottom:1px solid transparent}
nav a:hover,nav a.active{color:#fff;border-color:var(--champagne)}
.page{min-height:calc(100vh - 84px);display:grid;grid-template-columns:42% 58%;overflow:hidden}
.page.light{background:var(--paper);color:var(--ink)}
.page.dark{background:#10171b;color:var(--ivory)}
.page.reverse .copy{order:2}.page.reverse .visual{order:1}
.copy{padding:8vh 6vw;display:flex;align-items:center;background:linear-gradient(145deg,#0a0f12,#171d21)}
.light .copy{background:var(--paper)}
.copy-inner{max-width:680px}
.eyebrow{font-size:10px;letter-spacing:4px;color:#c9b18c;margin-bottom:24px}
.light .eyebrow{color:#8d7351}
h1{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(46px,5.6vw,78px);line-height:.99;margin:0 0 28px;text-transform:uppercase}
p{font-size:15px;line-height:1.82;color:var(--muted);max-width:660px}
.light p{color:#535b5d}
.visual{position:relative;min-height:calc(100vh - 84px);background:#161d20}
/* Fotografie reali, uniformate in una direzione più scura e materica: marmo, bronzo, vetro e luce controllata. */
.visual img{width:100%;height:100%;display:block;object-fit:cover;object-position:center;position:absolute;inset:0;filter:brightness(.88) contrast(1.04) saturate(.90)}
.visual::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);background:linear-gradient(90deg,rgba(8,12,14,.08),rgba(8,12,14,0) 45%,rgba(8,12,14,.06));pointer-events:none}
.btn{display:inline-block;margin-top:25px;border:1px solid var(--champagne);padding:13px 21px;font-size:9px;letter-spacing:2px}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:28px}
.fact{padding-top:16px;border-top:1px solid rgba(255,255,255,.15)}
.light .fact{border-color:rgba(32,40,44,.14)}
.fact strong{display:block;font:22px Georgia,'Times New Roman',serif;font-weight:400;margin-bottom:8px}
.rui{margin-top:28px;border-top:1px solid rgba(255,255,255,.17);padding-top:20px;line-height:1.8;color:#d8d2c8}
.rui strong{display:block;font:28px Georgia,'Times New Roman',serif;font-weight:400;margin:7px 0}
.contact-big{display:block;font:30px Georgia,'Times New Roman',serif;margin:12px 0}
footer{padding:24px 4vw;background:#090e11;color:#8f8c86;font-size:8px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.08)}
footer a{color:#aaa59d}
.credit{font-size:8px;color:#8f8c86;margin-top:18px;line-height:1.5}
@media(max-width:900px){
  header{height:auto;min-height:78px;padding:10px 18px;align-items:flex-start;gap:12px;flex-direction:column}
  .brand img{height:48px}
  .brand span{font-size:10px;letter-spacing:2.2px}
  nav{display:flex;width:100%;gap:16px;overflow-x:auto;padding:2px 0 7px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  nav::-webkit-scrollbar{display:none}
  nav a{font-size:8px;white-space:nowrap;flex:0 0 auto}
  .page{grid-template-columns:1fr;min-height:auto}
  .copy{padding:64px 24px}
  .visual{min-height:420px}
  .page.reverse .copy,.page.reverse .visual{order:initial}
  .facts{grid-template-columns:1fr}
  h1{font-size:clamp(42px,12vw,64px)}
  .contact-big{font-size:24px;overflow-wrap:anywhere}
}


/* Inquadrature più vicine e controllate, evitando l'effetto stock generico. */
body[data-page="home"] .visual img{object-position:58% center}
body[data-page="profilo"] .visual img{object-position:center 42%}
body[data-page="preservazione"] .visual img{object-position:center 54%}
body[data-page="analisi"] .visual img{object-position:center 48%}
body[data-page="competenza"] .visual img{object-position:center center}
body[data-page="longevita"] .visual img{object-position:center 48%;filter:brightness(.84) contrast(1.05) saturate(.88)}
body[data-page="metodo"] .visual img{object-position:center 54%;filter:brightness(.84) contrast(1.05) saturate(.88)}
body[data-page="contatti"] .visual img{object-position:center 48%;filter:brightness(.86) contrast(1.04) saturate(.88)}

/* V14 — immagini locali associate pagina per pagina.
   Uffici per le pagine operative; paesaggi forti per i concetti di preservazione, longevità e metodo. */
body[data-page="home"] .visual img{object-position:54% center}
body[data-page="profilo"] .visual img{object-position:52% center}
body[data-page="preservazione"] .visual img{object-position:56% center;filter:brightness(.86) contrast(1.05) saturate(.88)}
body[data-page="analisi"] .visual img{object-position:52% center}
body[data-page="competenza"] .visual img{object-position:54% center}
body[data-page="longevita"] .visual img{object-position:52% center}
body[data-page="metodo"] .visual img{object-position:55% center}
body[data-page="contatti"] .visual img{object-position:53% center}

body[data-page="prospettiva"] .visual img{object-position:55% center;filter:brightness(.84) contrast(1.05) saturate(.88)}

/* V19 — brand alignment and final Aruba-ready refinements */
.eyebrow,.btn,.rui strong{color:var(--champagne)}
.btn{transition:.2s ease;background:transparent}
.btn:hover{background:var(--champagne);color:#09131a}
body[data-page="rui"] .visual img{object-position:64% center;filter:brightness(.94) contrast(1.03) saturate(.92)}
body[data-page="rui"] .rui{border-color:rgba(178,152,114,.45)}
@media(max-width:560px){
  .visual{min-height:340px}
  .copy{padding:48px 20px}
  p{font-size:14px;line-height:1.72}
  footer{padding:20px;font-size:8px}
}
