:root {
  --navy:#103554; --deep:#0b2b46; --body:#40566a; --gold:#a67b38;
  --sand:#f6f3ed; --line:#e2e7e9; --white:#fff;
  font-family:"Instrument Sans",Arial,sans-serif; color:var(--navy); background:var(--white);
  font-synthesis:none; line-height:1.6;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0}
[hidden]{display:none!important}
img{display:block;max-width:100%}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:3px solid #aa782f;outline-offset:5px}
p{margin:0 0 1.1rem;color:var(--body)}
h1,h2,h3{margin:0;line-height:1.12;font-weight:400}
h1,h2,h3{font-family:"Baskervville",Georgia,serif}
h2{font-size:clamp(2rem,4vw,3.25rem);letter-spacing:-.025em}
h3{font-size:1.55rem}
.wrap{width:min(1200px,calc(100% - 104px));margin-inline:auto}
.skip{position:absolute;top:8px;left:8px;transform:translateY(-160%);z-index:5;background:white;padding:.6rem 1rem}
.skip:focus{transform:none}
.site-header{background:white;border-bottom:1px solid var(--line)}
.header-row{display:grid;grid-template-columns:125px 1fr 43px;min-height:101px;align-items:center;gap:30px}
.brand img{width:104px;height:auto}
.order-mark{width:41px;height:auto;justify-self:end}
nav{display:flex;justify-content:center;align-items:center;gap:clamp(1rem,3vw,2.6rem)}
nav a{text-decoration:none;font-size:.92rem;font-weight:600;padding:12px 0;position:relative;white-space:nowrap}
nav a:hover,nav a[aria-current]{color:#825c27}
nav a[aria-current]::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:1px;background:#a67b38}
.menu{font:inherit;font-weight:600;padding:7px 12px;border:1px solid var(--line);background:white;color:var(--navy);border-radius:3px;cursor:pointer}
.menu span{margin-left:.25em}
.hero{position:relative;isolation:isolate;background:#fbfaf7;overflow:hidden}
.hero-photo{position:absolute;z-index:-2;right:0;top:0;width:72%;height:100%;object-fit:cover;object-position:center 58%}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#fbfaf7 25%,rgba(251,250,247,.98) 34%,rgba(251,250,247,.78) 45%,rgba(251,250,247,0) 69%)}
.hero-inner{min-height:510px;display:flex;align-items:center;padding-block:64px}
.hero-copy{max-width:530px}
.eyebrow{font-size:.74rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:#765424;margin-bottom:17px}
.hero h1{font-size:clamp(3.5rem,7.4vw,7rem);letter-spacing:-.06em;line-height:.99}
.hero-subtitle{font-family:"Baskervville",Georgia,serif;font-size:clamp(1.55rem,2.8vw,2.65rem);line-height:1.18;margin:22px 0 31px;color:var(--navy)}
.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:17px 25px}
.button{display:inline-flex;align-items:center;gap:15px;padding:12px 19px;border:1px solid var(--navy);background:var(--navy);color:white;text-decoration:none;font-size:.9rem;font-weight:600;border-radius:3px;min-height:47px}
.button:hover{background:#235173}
.text-link{font-size:.95rem;font-weight:700;text-underline-offset:.3em;text-decoration-color:#b0884d}
.text-link:hover{color:#825c27}
.experience{background:var(--deep);color:white;text-align:center}
.experience .wrap{display:flex;justify-content:center;align-items:baseline;gap:12px;padding-block:14px}
.experience strong{font:1.65rem Georgia,serif;color:#efd09b}
.experience span{font-size:.95rem}
.section{padding-block:70px}
.section-head{text-align:center;margin:0 auto 32px}
.section-head h2::after{content:"";display:block;margin:16px auto 14px;width:42px;height:2px;background:#bd985e}
.section-head p{margin:0}
.cards,.services,.contacts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.cards{grid-auto-rows:1fr}
.card,.service{position:relative;display:block;border:1px solid var(--line);background:white;padding:26px 26px 29px;border-radius:4px}
.card{text-decoration:none;min-height:195px;padding-bottom:38px}
.card:hover{border-color:#b38e53;background:#fcfaf6}
.card svg,.service svg{display:block;color:var(--gold);margin-bottom:13px}
.card p{margin:.55rem 0 0;font-size:.91rem}
.arrow{position:absolute;bottom:10px;right:18px;color:#896026;font-size:1.18rem}
.studio-band,.page-intro{background:var(--sand)}
.split{display:grid;grid-template-columns:1.08fr 1fr;align-items:center;gap:clamp(28px,6vw,88px)}
.split h2{margin-bottom:18px}
.room{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:4px}
.banner{background:var(--deep);color:white}
.banner-grid{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:42px}
.banner h2{font-size:clamp(1.8rem,4vw,2.7rem)}
.banner p{color:#dce6ef;margin:.5rem 0 0}
.gold{background:#e9ca94;border-color:#e9ca94;color:var(--deep)}
.gold:hover{background:#f4ddba}
.site-footer{background:#f8f9f8}
.footer-grid{display:grid;grid-template-columns:1.08fr 1fr 1fr;gap:26px;padding-block:30px;font-size:.88rem}
.footer-grid p,.footer-grid address{margin:.35rem 0 0;color:var(--body)}
address{font-style:normal}
.footer-grid a{text-decoration:none}
.footer-grid a:hover{text-decoration:underline}
.page-intro{padding-block:65px}
.page-intro h1{font-size:clamp(3.2rem,7vw,5rem);letter-spacing:-.045em}
.page-intro p{margin:12px 0 0;font-size:1.1rem}
.services,.contacts{grid-template-columns:repeat(2,minmax(0,1fr))}
.service{scroll-margin-top:20px;padding:28px}
.service h2{font-size:clamp(1.6rem,3.5vw,2.25rem);margin-bottom:12px}
.service p,.service li{color:var(--body)}
.service ul{padding-left:1.2em;margin:0}
.service li+li{margin-top:.35em}
.service:target{border-color:#b38e53;background:#fcfaf6}
.contacts address{margin-bottom:1rem}
.contacts p a{overflow-wrap:anywhere}
.hours{margin:0}
.hours div{padding:10px 0;border-bottom:1px solid var(--line)}
.hours dt{font-weight:600}
.hours dd{margin:0;color:var(--body)}
@media(max-width:1000px){
  .wrap{width:calc(100% - 64px)}
  .header-row{gap:20px}
  .hero-inner{min-height:465px}
}
@media(max-width:780px){
  .wrap{width:calc(100% - 40px)}
  .header-row{grid-template-columns:1fr auto 36px;gap:10px 14px;min-height:75px;padding-block:10px}
  .brand{justify-self:start}
  .brand img{width:80px}
  .order-mark{width:35px;grid-column:3;grid-row:1}
  .menu{grid-column:2;grid-row:1}
  nav{grid-column:1/-1;grid-row:2;flex-wrap:wrap;justify-content:flex-start;gap:0 20px}
  .hero-inner{min-height:400px}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .section{padding-block:50px}
}
@media(max-width:540px){
  .hero{display:grid}
  .hero-inner{min-height:0;padding-block:42px 17px;grid-row:1}
  .hero-photo{position:static;width:100%;height:235px;object-position:70% 66%;grid-row:2}
  .hero::before{z-index:0;inset:auto 0 0;height:235px;background:linear-gradient(#fbfaf7,rgba(251,250,247,0) 44%);pointer-events:none}
  .hero-subtitle{margin:15px 0 21px}
  .wide-break{display:none}
  .experience .wrap{gap:7px;flex-wrap:wrap}
  .experience strong{font-size:1.3rem}
  .experience span{font-size:.87rem}
  .cards,.services,.contacts,.split,.footer-grid{grid-template-columns:1fr}
  .card{min-height:163px;padding-top:20px}
  .banner-grid{align-items:flex-start;flex-direction:column}
  .page-intro{padding-block:43px}
}

.studio-text{max-width:750px}
.studio-text h2{margin-bottom:18px}
.studio-band .studio-text{text-align:center}
.hero-handshake .hero-inner{min-height:390px;padding-block:52px}
.hero-handshake .hero-photo{width:100%;object-position:right center}
.hero-handshake::before{background:linear-gradient(90deg,#fbfaf7 18%,rgba(251,250,247,.99) 30%,rgba(251,250,247,.9) 42%,rgba(251,250,247,0) 68%)}
@media(max-width:780px){
  .hero-handshake{display:grid}
  .hero-handshake .hero-inner{min-height:0;padding-block:42px 25px;grid-row:1}
  .hero-handshake .hero-photo{position:static;height:clamp(150px,32vw,235px);grid-row:2;z-index:auto}
  .hero-handshake::before{content:none}
  .hero-handshake .wide-break{display:none}
}

.copy-email{font:inherit;font-size:.88rem;color:var(--navy);background:white;border:1px solid var(--line);border-radius:3px;padding:4px 8px;cursor:pointer;margin-block:6px}
.copy-email-status:not(:empty){display:block;font-size:.88rem}

/* Scheda professionale */
.profile-link {
  display: inline-block;
  color: var(--navy);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: #a67b38;
  text-underline-offset: .25em;
}
.profile-link:hover { text-decoration-thickness: 2px; }
.profile-back { margin-block: 1.25rem; }
.profile-banner { margin-top: clamp(3rem, 7vw, 6rem); }
.artuso-profile .wrap { max-width: 1060px; }
.profile-hero {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  grid-template-rows: minmax(clamp(17rem, 26vw, 25rem), auto);
  padding-inline-start: max(20px, calc((100% - 1060px) / 2));
  border-top: 3px solid #a67b38;
  background: #f6f3ed;
}
.profile-hero-copy {
  z-index: 1;
  align-self: center;
  padding-block: 2rem;
}
.profile-hero h1 {
  font-size: clamp(2.4rem, 5.2vw, 4.75rem);
  letter-spacing: -.04em;
}
.profile-role { margin: 1rem 0 0; font-weight: 600; color: var(--navy); }
.profile-portrait {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
  object-position: center top;
  mask-image: linear-gradient(to right, transparent, #000 32%);
}
.profile-construction {
  float: left;
  width: min(42%, 318px);
  height: auto;
  margin: 0 1.5rem 1rem 0;
}
#edilizia { max-width: 35ch; }
.profile-prose:has(.profile-construction) { display: flow-root; }
.profile-section { margin-top: clamp(2.25rem, 5vw, 4.25rem); }
.profile-section h2 {
  max-width: 28ch;
  margin-bottom: 1.25rem;
  font-size: clamp(1.8rem, 4vw, 2.65rem);
}
.profile-prose { max-width: 78ch; }
.profile-prose p, .profile-skills p { text-align: justify; hyphens: auto; }
.profile-prose p + p { margin-top: 1rem; }
.profile-appointment {
  border-left: 3px solid #a67b38;
  padding-left: 1rem;
  color: var(--navy);
}
.profile-prose .profile-appointment { text-align: start; }
.profile-skills {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
  gap: 1rem;
  padding: 0;
  list-style: none;
}
.profile-skills li { border: 1px solid var(--line); border-top: 2px solid #a67b38; padding: 1.25rem; }
.profile-skills h3 { margin-bottom: .5rem; font-size: 1.35rem; }
.profile-skills p { margin-bottom: 0; }
@media (max-width: 600px) {
  .profile-hero {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    padding-inline: 0;
  }
  .profile-hero-copy { padding: 1.5rem 20px .75rem; }
  .profile-portrait {
    height: auto;
    aspect-ratio: 487 / 260;
    mask-image: linear-gradient(to bottom, transparent, #000 22%);
  }
  .profile-construction { display: block; float: none; width: min(100%, 318px); margin-right: 0; }
}