:root{
  --paper:#f5f0e8;
  --white:#fbfaf6;
  --ink:#161312;
  --burgundy:#641718;
  --signature:#c51f2b;
  --olive:#5e641d;
  --muted:#706762;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#cfc9c2;color:var(--ink);font-family:"Glacial Indifference","Helvetica Neue",sans-serif}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
.page-shell{width:min(1540px,calc(100% - 32px));margin:16px auto;background:var(--paper);overflow:hidden}
.frame-nav{height:70px;padding:0 28px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:20;background:var(--paper)}
.frame-nav .nav-mark{font:400 13px/1 "Notable",sans-serif;letter-spacing:.04em}
.frame-nav nav{display:flex;gap:26px;font-size:10px;letter-spacing:.12em}
.frame-nav a{transition:color .25s ease,opacity .25s ease}.frame-nav a:hover{color:var(--signature)}
.section-block{padding:54px 28px 100px}
.section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:30px;margin-bottom:72px;font-size:10px;letter-spacing:.12em}
.section-head p{margin:0;font-size:13px;letter-spacing:0;color:var(--muted)}
.hero{height:min(860px,84vh);min-height:660px;position:relative;display:grid;place-items:center;background:var(--white);overflow:hidden}
.hero-kicker{position:absolute;left:28px;top:26px;font-size:10px;letter-spacing:.12em}
.hero-image{width:min(29vw,390px);aspect-ratio:3/4;background:var(--burgundy);display:grid;place-items:center;color:rgba(255,255,255,.45);font-size:9px;letter-spacing:.15em;text-align:center;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.hero:hover .hero-image{transform:scale(.985)}
.script-logo{background:var(--signature);-webkit-mask-image:url('logo-script.webp');mask-image:url('logo-script.webp');-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}
.hero-script{position:absolute;width:min(76%,1080px);height:44%;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-1deg);pointer-events:none}
.hero-caption{position:absolute;left:28px;bottom:30px;margin:0;font-size:14px;line-height:1.4;color:var(--burgundy)}
.hero-scroll{position:absolute;right:28px;bottom:30px;font-size:9px;letter-spacing:.12em}
.services{background:var(--white)}
.service-strip{display:grid;grid-template-columns:repeat(6,1fr);gap:18px;overflow-x:auto;padding-bottom:8px}
.service-thumb{min-width:148px;display:grid;gap:9px;font-size:9px;letter-spacing:.09em}
.service-thumb .num{opacity:.5}.thumb-art{aspect-ratio:4/5;display:grid;place-items:center;font:400 clamp(34px,4vw,62px)/1 "Notable",sans-serif;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.service-thumb:hover .thumb-art{transform:translateY(-7px)}
.burgundy{background:var(--burgundy);color:var(--paper)}.cream{background:#ddd0bb;color:var(--burgundy)}.red{background:var(--signature);color:var(--paper)}.ink{background:var(--ink);color:var(--paper)}.olive{background:var(--olive);color:var(--paper)}.paper{background:var(--paper);color:var(--burgundy)}
.services-detail{margin-top:100px;display:grid;gap:18px}
.service-row{display:grid;grid-template-columns:50px 1fr 1fr;gap:34px;align-items:start;padding:10px 0}
.service-row>span{font-size:9px;letter-spacing:.1em;opacity:.55}.service-row h2{margin:0;font-size:clamp(24px,3vw,44px);font-weight:400;letter-spacing:-.035em}.service-row p{margin:5px 0 0;max-width:560px;font-size:14px;line-height:1.45;color:var(--muted)}
.portfolio{background:var(--paper)}
.project{padding-bottom:118px}.project-copy{display:flex;flex-direction:column;justify-content:space-between;min-height:560px;padding:8px 0}.project-no{font-size:9px;letter-spacing:.11em}.project-copy h3{font:400 clamp(54px,7.5vw,122px)/.86 "Notable",sans-serif;letter-spacing:-.035em;margin:0;color:var(--burgundy)}.project-copy p{font-size:14px;line-height:1.45;max-width:390px;color:var(--muted)}
.project-image{display:flex;align-items:flex-end;justify-content:flex-end;padding:10px;font-size:8px;letter-spacing:.1em;overflow:hidden;transition:transform .6s cubic-bezier(.2,.7,.2,1)}.project-image:hover{transform:scale(.988)}.project-image span{background:rgba(245,240,232,.88);padding:5px 7px;color:var(--ink)}
.project-a{display:grid;grid-template-columns:1fr 1.15fr;gap:64px}.project-a .tall{min-height:760px}.burgundy-panel{background:var(--burgundy)}
.project-b{display:grid;grid-template-columns:.76fr 1.24fr;grid-template-rows:auto auto;gap:32px}.project-b .square{aspect-ratio:1}.project-b .landscape{align-self:end;aspect-ratio:1.6}.paper-panel{background:#d7d0c5}.ink-panel{background:var(--ink)}.project-caption{grid-column:1/-1;display:flex;justify-content:space-between;font-size:9px;letter-spacing:.11em}
.project-c{display:grid;grid-template-columns:1.1fr .9fr;gap:64px}.project-c .portrait{min-height:700px}.red-panel{background:var(--signature)}.centered{justify-content:center}.centered h3{margin:30px 0}.project-d{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;background:var(--ink);color:var(--paper);margin-inline:-28px;padding:68px 28px 100px}.dark-copy h3{color:var(--paper)}.dark-copy p{color:#bdb3ab}.project-d .wide{min-height:560px}.olive-panel{background:var(--olive)}
.about{background:var(--white);min-height:680px;position:relative;overflow:hidden}.about-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:90px;position:relative;z-index:2}.about-lead{margin:0;font-size:clamp(34px,5vw,70px);line-height:1.02;letter-spacing:-.045em;max-width:900px}.about-copy{font-size:14px;line-height:1.55;max-width:420px}.about-copy p{margin-top:0}.about-copy a{display:inline-block;margin-top:24px;font-size:10px;letter-spacing:.12em}.about-script{position:absolute;width:82%;height:46%;right:-8%;bottom:-8%;opacity:.94}
.contact{background:var(--paper);display:grid;grid-template-columns:1fr 1fr;gap:48px}.contact-card{background:var(--burgundy);color:var(--paper);padding:46px;min-height:500px;display:flex;flex-direction:column}.contact-wordmark{font:400 clamp(44px,7vw,100px)/.83 "Notable",sans-serif;letter-spacing:-.03em}.contact-sub{margin-top:20px;font-size:10px;letter-spacing:.12em}.contact-grid{margin-top:auto;display:grid;grid-template-columns:1fr 1fr;gap:28px;font-size:10px;line-height:1.45}.contact-grid div{display:grid;gap:8px}.contact-grid span{opacity:.55}
.quote-form{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-content:start}.form-head{grid-column:1/-1;margin-bottom:12px}.form-head span{font-size:9px;letter-spacing:.12em}.form-head p{font-size:34px;letter-spacing:-.04em;margin:16px 0 0}.quote-form label{display:grid;gap:8px;font-size:9px;letter-spacing:.1em}.quote-form input,.quote-form select,.quote-form textarea{border:0;border-bottom:1px solid rgba(22,19,18,.25);background:transparent;border-radius:0;padding:12px 0;outline:none}.quote-form textarea{border:1px solid rgba(22,19,18,.18);padding:12px;resize:vertical}.quote-form .full{grid-column:1/-1}.quote-form button{grid-column:1/-1;background:var(--ink);color:var(--paper);border:0;padding:18px 20px;text-align:left;font-size:10px;letter-spacing:.11em;cursor:pointer;transition:background .25s ease}.quote-form button:hover{background:var(--burgundy)}
footer{display:flex;justify-content:space-between;padding:24px 28px 30px;font-size:9px;letter-spacing:.11em}
.reveal{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}.reveal.is-visible{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.thumb-art,.project-image,.hero-image{transition:none}}
@media(max-width:900px){.page-shell{width:100%;margin:0}.frame-nav{padding-inline:18px}.frame-nav nav{gap:14px}.hero{min-height:620px;height:78vh}.hero-image{width:min(48vw,340px)}.hero-script{width:108%;height:52%}.service-strip{grid-template-columns:repeat(6,minmax(145px,1fr))}.service-row{grid-template-columns:40px 1fr}.service-row p{grid-column:2}.project-a,.project-c,.project-d,.contact{grid-template-columns:1fr}.project-copy{min-height:360px}.project-a .tall,.project-c .portrait{min-height:560px}.project-b{grid-template-columns:1fr 1fr}.about-grid{grid-template-columns:1fr;gap:34px}.about-script{width:120%;right:-20%;bottom:0}.contact-grid{grid-template-columns:1fr}.contact-card{min-height:410px}}
@media(max-width:600px){.section-block{padding:38px 14px 70px}.frame-nav{height:auto;padding:16px 14px;align-items:flex-start;gap:18px}.frame-nav nav{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;text-align:right}.hero{min-height:560px}.hero-kicker{left:14px;top:18px}.hero-image{width:56vw}.hero-script{width:138%;height:50%}.hero-caption{left:14px;bottom:18px;font-size:12px}.hero-scroll{right:14px;bottom:18px}.section-head{margin-bottom:48px;gap:18px}.section-head p{text-align:right}.service-row{grid-template-columns:28px 1fr;gap:10px}.service-row p{font-size:13px}.project{padding-bottom:72px}.project-a,.project-c{gap:22px}.project-b{grid-template-columns:1fr;gap:16px}.project-caption{display:grid;gap:6px}.project-a .tall,.project-c .portrait{min-height:420px}.project-d{margin-inline:-14px;padding:44px 14px 70px}.project-d .wide{min-height:360px}.about-lead{font-size:42px}.about-script{width:155%;right:-38%;bottom:4%}.contact{gap:22px}.contact-card{padding:28px 20px;min-height:370px}.quote-form{grid-template-columns:1fr}.quote-form .full,.form-head,.quote-form button{grid-column:auto}footer{padding-inline:14px}}


/* Portfolio: aggiunta fotografica mantenendo il layout esistente */
.portfolio-category{display:grid;grid-template-columns:.72fr 1.28fr;gap:64px;align-items:start}
.portfolio-category-head{min-height:520px;display:flex;flex-direction:column;justify-content:space-between;padding:8px 0}
.portfolio-category-head h3{font:400 clamp(48px,6.5vw,108px)/.86 "Notable",sans-serif;letter-spacing:-.035em;margin:0;color:var(--burgundy)}
.portfolio-category-head p{font-size:14px;line-height:1.45;max-width:390px;color:var(--muted);margin:0}
.portfolio-gallery{display:grid;gap:20px}
.portfolio-gallery-4{grid-template-columns:1fr 1fr}
.portfolio-gallery-3{grid-template-columns:1fr 1fr}
.portfolio-gallery .project-image{min-height:300px}
.portfolio-gallery-4 .project-image:nth-child(1){min-height:470px}
.portfolio-gallery-4 .project-image:nth-child(4){min-height:430px}
.portfolio-gallery-3 .project-image:nth-child(1){grid-row:span 2;min-height:620px}
.portfolio-gallery-3 .project-image:nth-child(2),.portfolio-gallery-3 .project-image:nth-child(3){min-height:300px}
@media(max-width:900px){.portfolio-category{grid-template-columns:1fr;gap:28px}.portfolio-category-head{min-height:300px}}
@media(max-width:600px){.portfolio-gallery-4,.portfolio-gallery-3{grid-template-columns:1fr}.portfolio-gallery .project-image,.portfolio-gallery-4 .project-image:nth-child(1),.portfolio-gallery-4 .project-image:nth-child(4),.portfolio-gallery-3 .project-image:nth-child(1),.portfolio-gallery-3 .project-image:nth-child(2),.portfolio-gallery-3 .project-image:nth-child(3){min-height:360px;grid-row:auto}}

/* Portfolio: movimento leggero senza alterare il sistema visivo */
.portfolio-category{margin-bottom:110px}
.portfolio-right{grid-template-columns:1.28fr .72fr}
.portfolio-right .portfolio-category-head{order:2;padding-left:22px}
.portfolio-right .portfolio-gallery{order:1}
.portfolio-left .portfolio-category-head{padding-right:22px}
.portfolio-gallery .project-image{transition:transform .45s ease}
.portfolio-gallery .project-image:nth-child(even){transform:translateY(26px)}
.portfolio-right .portfolio-gallery .project-image:nth-child(odd){transform:translateY(18px)}
.portfolio-right .portfolio-gallery .project-image:nth-child(even){transform:translateY(-10px)}
@media(max-width:900px){
  .portfolio-right{grid-template-columns:1fr}
  .portfolio-right .portfolio-category-head,.portfolio-right .portfolio-gallery{order:initial}
  .portfolio-right .portfolio-category-head,.portfolio-left .portfolio-category-head{padding-left:0;padding-right:0}
  .portfolio-gallery .project-image,.portfolio-right .portfolio-gallery .project-image:nth-child(odd),.portfolio-right .portfolio-gallery .project-image:nth-child(even){transform:none}
}

/* Portfolio v3: impaginazione più editoriale, senza toccare il resto */
.portfolio{
  background:#cac6c1;
}
.portfolio .section-head{
  margin-bottom:44px;
}
.portfolio-category,
.portfolio-right,
.portfolio-left{
  display:grid;
  grid-template-columns:1fr;
  gap:24px;
  background:var(--white);
  padding:18px 18px 22px;
  margin-bottom:42px;
  transform:none;
}
.portfolio-right .portfolio-category-head,
.portfolio-left .portfolio-category-head{
  order:initial;
  padding:0;
}
.portfolio-right .portfolio-gallery,
.portfolio-left .portfolio-gallery{
  order:initial;
}
.portfolio-category:nth-of-type(1){width:min(100%,1060px);margin-left:2%;margin-right:auto}
.portfolio-category:nth-of-type(2){width:min(100%,1120px);margin-left:auto;margin-right:0}
.portfolio-category:nth-of-type(3){width:min(100%,1040px);margin-left:8%;margin-right:auto}
.portfolio-category:nth-of-type(4){width:min(100%,1100px);margin-left:auto;margin-right:4%}
.portfolio-category:nth-of-type(5){width:min(100%,1060px);margin-left:5%;margin-right:auto}

.portfolio-category-head{
  min-height:auto;
  display:grid;
  grid-template-columns:minmax(260px,.9fr) minmax(300px,1.1fr);
  grid-template-areas:
    'num desc'
    'title desc';
  align-items:start;
  gap:10px 24px;
}
.portfolio-category-head .project-no{
  grid-area:num;
  opacity:.75;
}
.portfolio-category-head h3{
  grid-area:title;
  margin:0;
  font-size:clamp(42px,5.7vw,96px);
  line-height:.88;
}
.portfolio-category-head p{
  grid-area:desc;
  justify-self:end;
  align-self:end;
  max-width:380px;
  margin:0;
}

.portfolio-gallery,
.portfolio-gallery-3,
.portfolio-gallery-4{
  display:grid;
  gap:18px;
  align-items:start;
}
.portfolio-gallery .project-image,
.portfolio-gallery-3 .project-image,
.portfolio-gallery-4 .project-image{
  min-height:260px;
  transform:none !important;
  position:relative;
}
.portfolio-gallery .project-image:hover,
.portfolio-gallery-3 .project-image:hover,
.portfolio-gallery-4 .project-image:hover{
  transform:scale(.992) !important;
}
.portfolio-gallery .project-image span,
.portfolio-gallery-3 .project-image span,
.portfolio-gallery-4 .project-image span{
  position:absolute;
  right:10px;
  bottom:10px;
  background:rgba(251,250,246,.92);
}

/* categoria 1 */
.portfolio-category:nth-of-type(1) .portfolio-gallery{
  grid-template-columns:1fr 1.08fr;
  grid-template-rows:340px 250px;
}
.portfolio-category:nth-of-type(1) .project-image:nth-child(1){
  grid-column:1;
  grid-row:1;
  min-height:340px;
  width:60%;
  justify-self:center;
}
.portfolio-category:nth-of-type(1) .project-image:nth-child(2){
  grid-column:2;
  grid-row:1;
  min-height:340px;
}
.portfolio-category:nth-of-type(1) .project-image:nth-child(3){
  grid-column:1;
  grid-row:2;
  min-height:250px;
}
.portfolio-category:nth-of-type(1) .project-image:nth-child(4){
  grid-column:2;
  grid-row:2;
  min-height:250px;
  width:72%;
  justify-self:start;
}

/* categoria 2 */
.portfolio-category:nth-of-type(2) .portfolio-gallery{
  grid-template-columns:repeat(3,1fr);
  grid-template-rows:240px 420px;
}
.portfolio-category:nth-of-type(2) .project-image:nth-child(1){grid-column:1;grid-row:1;min-height:240px}
.portfolio-category:nth-of-type(2) .project-image:nth-child(2){grid-column:2;grid-row:1;min-height:240px}
.portfolio-category:nth-of-type(2) .project-image:nth-child(3){grid-column:3;grid-row:1;min-height:240px}

/* categoria 3 */
.portfolio-category:nth-of-type(3) .portfolio-gallery{
  grid-template-columns:.72fr 1.28fr;
  grid-template-rows:360px 220px;
}
.portfolio-category:nth-of-type(3) .project-image:nth-child(1){grid-column:1;grid-row:1 / span 2;min-height:598px}
.portfolio-category:nth-of-type(3) .project-image:nth-child(2){grid-column:2;grid-row:1;min-height:360px;width:62%;justify-self:end}
.portfolio-category:nth-of-type(3) .project-image:nth-child(3){grid-column:2;grid-row:2;min-height:220px;width:48%;justify-self:start}
.portfolio-category:nth-of-type(3) .project-image:nth-child(4){display:none}

/* categoria 4 */
.portfolio-category:nth-of-type(4) .portfolio-gallery{
  grid-template-columns:1fr 1fr;
  grid-template-rows:300px 260px;
}
.portfolio-category:nth-of-type(4) .project-image:nth-child(1){grid-column:1;grid-row:1 / span 2;min-height:578px;width:68%;justify-self:start}
.portfolio-category:nth-of-type(4) .project-image:nth-child(2){grid-column:2;grid-row:1;min-height:300px}
.portfolio-category:nth-of-type(4) .project-image:nth-child(3){grid-column:2;grid-row:2;min-height:260px;width:76%;justify-self:end}

/* categoria 5 */
.portfolio-category:nth-of-type(5) .portfolio-gallery{
  grid-template-columns:repeat(4,1fr);
  grid-template-rows:250px;
}
.portfolio-category:nth-of-type(5) .project-image:nth-child(1),
.portfolio-category:nth-of-type(5) .project-image:nth-child(2),
.portfolio-category:nth-of-type(5) .project-image:nth-child(3),
.portfolio-category:nth-of-type(5) .project-image:nth-child(4){min-height:250px}

@media(max-width:900px){
  .portfolio{background:var(--paper)}
  .portfolio-category:nth-of-type(n){width:100%;margin-left:0;margin-right:0}
  .portfolio-category-head{
    grid-template-columns:1fr;
    grid-template-areas:'num' 'title' 'desc';
    gap:10px;
  }
  .portfolio-category-head p{justify-self:start;max-width:460px}
  .portfolio-category:nth-of-type(1) .portfolio-gallery,
  .portfolio-category:nth-of-type(2) .portfolio-gallery,
  .portfolio-category:nth-of-type(3) .portfolio-gallery,
  .portfolio-category:nth-of-type(4) .portfolio-gallery,
  .portfolio-category:nth-of-type(5) .portfolio-gallery{
    grid-template-columns:1fr 1fr;
    grid-template-rows:auto;
  }
  .portfolio-category:nth-of-type(1) .project-image:nth-child(n),
  .portfolio-category:nth-of-type(2) .project-image:nth-child(n),
  .portfolio-category:nth-of-type(3) .project-image:nth-child(n),
  .portfolio-category:nth-of-type(4) .project-image:nth-child(n),
  .portfolio-category:nth-of-type(5) .project-image:nth-child(n){
    grid-column:auto;grid-row:auto;min-height:240px;width:auto;justify-self:stretch;display:flex;
  }
  .portfolio-category:nth-of-type(3) .project-image:nth-child(4){display:flex}
}
@media(max-width:600px){
  .portfolio-category{padding:14px 14px 18px;gap:16px}
  .portfolio-category:nth-of-type(1) .portfolio-gallery,
  .portfolio-category:nth-of-type(2) .portfolio-gallery,
  .portfolio-category:nth-of-type(3) .portfolio-gallery,
  .portfolio-category:nth-of-type(4) .portfolio-gallery,
  .portfolio-category:nth-of-type(5) .portfolio-gallery{grid-template-columns:1fr}
  .portfolio-category:nth-of-type(1) .project-image:nth-child(n),
  .portfolio-category:nth-of-type(2) .project-image:nth-child(n),
  .portfolio-category:nth-of-type(3) .project-image:nth-child(n),
  .portfolio-category:nth-of-type(4) .project-image:nth-child(n),
  .portfolio-category:nth-of-type(5) .project-image:nth-child(n){min-height:280px}
}

/* Portfolio v4 — più fedele alla reference 5AM. SOLO PORTFOLIO. */
.portfolio{
  background:#8f8f8f;
  padding-top:56px;
  padding-bottom:90px;
}
.portfolio .section-head{
  width:min(100%,1120px);
  margin:0 auto 36px;
  color:#f4f0e8;
}
.portfolio .section-head p{color:#f4f0e8;opacity:.72}

.portfolio-category,
.portfolio-left,
.portfolio-right{
  width:min(100%,1120px) !important;
  margin:0 auto 38px !important;
  padding:18px 18px 14px !important;
  background:#fbfaf6;
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:24px !important;
  min-height:560px;
  box-shadow:none;
  transform:none !important;
}

.portfolio-category-head{
  display:grid !important;
  grid-template-columns:1fr auto !important;
  grid-template-areas:
    'num title'
    'desc title' !important;
  gap:8px 24px !important;
  min-height:86px !important;
  padding:0 !important;
  align-items:start !important;
}
.portfolio-category-head .project-no{
  grid-area:num !important;
  font-size:8px;
  letter-spacing:.14em;
  opacity:.75;
}
.portfolio-category-head h3{
  grid-area:title !important;
  margin:0 !important;
  color:var(--ink) !important;
  font-family:"Glacial Indifference","Helvetica Neue",sans-serif !important;
  font-size:10px !important;
  line-height:1.2 !important;
  letter-spacing:.14em !important;
  font-weight:400 !important;
  text-align:right;
  text-transform:uppercase;
}
.portfolio-category-head p{
  grid-area:desc !important;
  margin:0 !important;
  max-width:380px !important;
  justify-self:start !important;
  align-self:start !important;
  color:#5f5955 !important;
  font-size:11px !important;
  line-height:1.45 !important;
}

.portfolio-gallery,
.portfolio-gallery-3,
.portfolio-gallery-4{
  display:grid !important;
  gap:28px !important;
  align-items:center !important;
  min-height:430px;
}
.portfolio-gallery .project-image,
.portfolio-gallery-3 .project-image,
.portfolio-gallery-4 .project-image{
  min-height:0 !important;
  width:auto !important;
  transform:none !important;
  justify-self:stretch;
  align-self:center;
  padding:7px !important;
  position:relative;
  box-shadow:none;
}
.portfolio-gallery .project-image:hover,
.portfolio-gallery-3 .project-image:hover,
.portfolio-gallery-4 .project-image:hover{transform:none !important}
.portfolio-gallery .project-image span,
.portfolio-gallery-3 .project-image span,
.portfolio-gallery-4 .project-image span{
  position:absolute !important;
  right:5px !important;
  bottom:5px !important;
  background:transparent !important;
  color:rgba(22,19,18,.75) !important;
  padding:0 !important;
  font-size:6px !important;
  letter-spacing:.08em !important;
}

/* Sheet 01 — split 50/50 come la prima schermata della reference */
.portfolio-category:nth-of-type(1){min-height:650px}
.portfolio-category:nth-of-type(1) .portfolio-gallery{
  grid-template-columns:1fr 1fr !important;
  grid-template-rows:1fr 1fr !important;
}
.portfolio-category:nth-of-type(1) .project-image:nth-child(1){
  grid-column:1 !important;grid-row:1 / span 2 !important;
  width:56% !important;height:58% !important;justify-self:center !important;
}
.portfolio-category:nth-of-type(1) .project-image:nth-child(2){
  grid-column:2 !important;grid-row:1 !important;
  width:100% !important;height:100% !important;
}
.portfolio-category:nth-of-type(1) .project-image:nth-child(3){
  grid-column:2 !important;grid-row:2 !important;
  width:72% !important;height:70% !important;justify-self:end !important;
}
.portfolio-category:nth-of-type(1) .project-image:nth-child(4){display:none !important}

/* Sheet 02 — tre immagini verticali allineate */
.portfolio-category:nth-of-type(2){min-height:610px}
.portfolio-category:nth-of-type(2) .portfolio-gallery{
  grid-template-columns:repeat(3,1fr) !important;
  grid-template-rows:1fr !important;
  padding:38px 72px 46px !important;
}
.portfolio-category:nth-of-type(2) .project-image:nth-child(1),
.portfolio-category:nth-of-type(2) .project-image:nth-child(2),
.portfolio-category:nth-of-type(2) .project-image:nth-child(3){
  grid-column:auto !important;grid-row:auto !important;
  width:82% !important;height:78% !important;justify-self:center !important;
}

/* Sheet 03 — immagine verticale a sinistra + orizzontale a destra */
.portfolio-category:nth-of-type(3){min-height:650px}
.portfolio-category:nth-of-type(3) .portfolio-gallery{
  grid-template-columns:.78fr 1.22fr !important;
  grid-template-rows:1fr !important;
}
.portfolio-category:nth-of-type(3) .project-image:nth-child(1){
  grid-column:1 !important;grid-row:1 !important;
  width:82% !important;height:100% !important;justify-self:start !important;
}
.portfolio-category:nth-of-type(3) .project-image:nth-child(2){
  grid-column:2 !important;grid-row:1 !important;
  width:100% !important;height:58% !important;align-self:center !important;
}
.portfolio-category:nth-of-type(3) .project-image:nth-child(3),
.portfolio-category:nth-of-type(3) .project-image:nth-child(4){display:none !important}

/* Sheet 04 — variante ariosa: immagine piccola + grande */
.portfolio-category:nth-of-type(4){min-height:630px}
.portfolio-category:nth-of-type(4) .portfolio-gallery{
  grid-template-columns:1fr 1fr !important;
  grid-template-rows:1fr !important;
  padding:30px 36px 42px !important;
}
.portfolio-category:nth-of-type(4) .project-image:nth-child(1){
  grid-column:1 !important;grid-row:1 !important;
  width:58% !important;height:62% !important;justify-self:center !important;
}
.portfolio-category:nth-of-type(4) .project-image:nth-child(2){
  grid-column:2 !important;grid-row:1 !important;
  width:88% !important;height:100% !important;justify-self:end !important;
}
.portfolio-category:nth-of-type(4) .project-image:nth-child(3){display:none !important}

/* Sheet 05 — quattro immagini piccole in fila */
.portfolio-category:nth-of-type(5){min-height:560px}
.portfolio-category:nth-of-type(5) .portfolio-gallery{
  grid-template-columns:repeat(4,1fr) !important;
  grid-template-rows:1fr !important;
  padding:42px 34px 48px !important;
}
.portfolio-category:nth-of-type(5) .project-image:nth-child(n){
  grid-column:auto !important;grid-row:auto !important;
  width:90% !important;height:70% !important;justify-self:center !important;
}

/* colori placeholder resi più neutri/editoriali */
.portfolio .burgundy-panel{background:#2c2927 !important}
.portfolio .paper-panel{background:#dedbd5 !important}
.portfolio .ink-panel{background:#171717 !important}
.portfolio .red-panel{background:#9e271f !important}
.portfolio .olive-panel{background:#5d6042 !important}

@media(max-width:900px){
  .portfolio-category{min-height:auto !important;padding:16px !important}
  .portfolio-category-head{grid-template-columns:1fr !important;grid-template-areas:'num' 'title' 'desc' !important}
  .portfolio-category-head h3{text-align:left !important}
  .portfolio-category:nth-of-type(n) .portfolio-gallery{
    grid-template-columns:1fr 1fr !important;
    grid-template-rows:auto !important;
    min-height:0 !important;
    padding:16px !important;
  }
  .portfolio-category:nth-of-type(n) .project-image:nth-child(n){
    display:flex !important;grid-column:auto !important;grid-row:auto !important;
    width:100% !important;height:260px !important;justify-self:stretch !important;
  }
}
@media(max-width:600px){
  .portfolio-category:nth-of-type(n) .portfolio-gallery{grid-template-columns:1fr !important;padding:8px !important}
  .portfolio-category:nth-of-type(n) .project-image:nth-child(n){height:280px !important}
}

/* ===== FINAL PORTFOLIO SYSTEM — 2026-10-21 ===== */
:root{
  --paper:#faf7f1;
  --white:#fffdf9;
  --ink:#11100f;
  --burgundy:#6f1f23;
  --signature:#9d2329;
  --muted:#655f5a;
}
body{background:#f3eee7;color:var(--ink)}
.page-shell{background:var(--paper)}
.frame-nav{background:var(--paper)}

/* Hero: frase fuori dalla foto, su fondo */
.hero{
  height:auto;
  min-height:0;
  display:block;
  background:var(--paper);
  overflow:visible;
}
.hero-visual{
  min-height:680px;
  position:relative;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:var(--white);
}
.hero-image{
  width:min(31vw,430px);
  aspect-ratio:3/4;
}
.hero-script{
  width:min(76%,1080px);
  height:44%;
  top:50%;
}
.hero-caption-zone{
  min-height:150px;
  padding:34px 28px 42px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:30px;
  background:var(--paper);
}
.hero-caption{
  position:static;
  margin:0;
  color:var(--ink);
  font-family:"Glacial Indifference","Helvetica Neue",sans-serif;
  font-size:15px;
  line-height:1.35;
}
.hero-scroll{position:static;margin-top:2px}

/* Portfolio overview */
.portfolio{
  background:var(--paper) !important;
  padding-top:110px;
  padding-bottom:150px;
}
.portfolio .section-head{
  width:min(100%,1220px);
  margin:0 auto 110px;
  color:var(--ink) !important;
}
.portfolio .section-head p{color:var(--muted) !important;opacity:1}
.portfolio-entry{
  width:min(100%,1220px);
  margin:0 auto 150px;
  display:grid;
  grid-template-columns:minmax(280px,.76fr) minmax(460px,1.24fr);
  gap:82px;
  align-items:center;
  color:var(--ink);
  cursor:pointer;
}
.portfolio-entry:last-child{margin-bottom:0}
.portfolio-entry-copy{display:flex;flex-direction:column;align-items:flex-start}
.portfolio-index{
  margin-bottom:18px;
  color:var(--burgundy);
  font-size:10px;
  letter-spacing:.18em;
}
.portfolio-entry h3{
  margin:0;
  font-family:"Notable",sans-serif;
  font-size:clamp(54px,6.4vw,104px);
  font-weight:400;
  line-height:.94;
  letter-spacing:-.025em;
  color:var(--ink);
}
.portfolio-entry p{
  margin:32px 0 0;
  max-width:430px;
  color:var(--muted);
  font-size:14px;
  line-height:1.5;
}
.portfolio-cta{
  margin-top:40px;
  color:var(--burgundy);
  font-size:9px;
  letter-spacing:.16em;
}
.portfolio-entry-image{margin:0;overflow:hidden;background:#ece6de}
.portfolio-entry-image img{
  width:100%;
  height:clamp(420px,53vw,680px);
  object-fit:cover;
  transition:transform .7s cubic-bezier(.2,.7,.2,1);
}
.portfolio-entry:hover .portfolio-entry-image img{transform:scale(1.012)}
.portfolio-entry:hover .portfolio-cta{color:var(--signature)}

/* Dedicated portfolio landing pages */
.portfolio-page{background:var(--paper)}
.portfolio-page .page-shell{min-height:100vh}
.portfolio-page-main{padding:120px 28px 90px}
.portfolio-page-intro{
  width:min(100%,1220px);
  margin:0 auto 105px;
  display:grid;
  grid-template-columns:minmax(280px,.72fr) minmax(420px,1.28fr);
  gap:82px;
  align-items:end;
}
.portfolio-page-intro .eyebrow{
  display:block;
  margin-bottom:20px;
  color:var(--burgundy);
  font-size:9px;
  letter-spacing:.16em;
}
.portfolio-page-title{
  margin:0;
  font-family:"Notable",sans-serif;
  font-size:clamp(58px,7vw,118px);
  line-height:.92;
  font-weight:400;
  color:var(--ink);
}
.portfolio-page-intro p{
  margin:0 0 6px;
  max-width:520px;
  color:var(--muted);
  font-size:14px;
  line-height:1.5;
}
.portfolio-page-back{
  display:inline-block;
  margin-top:30px;
  color:var(--burgundy);
  font-size:9px;
  letter-spacing:.14em;
}
.portfolio-strip{
  width:min(100%,1320px);
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(var(--count),minmax(0,1fr));
  gap:22px;
  align-items:start;
}
.portfolio-tile{display:block;color:var(--ink)}
.portfolio-tile .tile-no{
  display:block;
  margin-bottom:11px;
  font-size:9px;
  letter-spacing:.14em;
  color:var(--burgundy);
}
.portfolio-tile figure{
  margin:0;
  height:330px;
  overflow:hidden;
  background:#e8e1d8;
}
.portfolio-tile img{width:100%;height:100%;object-fit:cover;transition:transform .55s ease}
.portfolio-tile:hover img{transform:scale(1.014)}
.portfolio-tile h2{
  margin:14px 0 0;
  font-family:"Glacial Indifference","Helvetica Neue",sans-serif;
  font-size:11px;
  line-height:1.3;
  letter-spacing:.12em;
  font-weight:400;
  text-transform:uppercase;
}
.portfolio-page-footer{
  width:min(100%,1220px);
  margin:82px auto 0;
  display:flex;
  justify-content:space-between;
  gap:20px;
  color:var(--muted);
  font-size:9px;
  letter-spacing:.12em;
}

@media(max-width:1000px){
  .portfolio-entry{grid-template-columns:1fr;gap:34px;margin-bottom:110px}
  .portfolio-entry-image{order:2}
  .portfolio-entry-image img{height:min(78vw,620px)}
  .portfolio-page-intro{grid-template-columns:1fr;gap:30px;margin-bottom:70px}
  .portfolio-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:42px 20px}
  .portfolio-strip{--count:2 !important}
  .portfolio-tile figure{height:420px}
}
@media(max-width:600px){
  .hero-visual{min-height:560px}
  .hero-caption-zone{padding:28px 14px 34px;min-height:135px}
  .portfolio{padding-top:72px;padding-bottom:100px}
  .portfolio .section-head{margin-bottom:74px}
  .portfolio-entry{margin-bottom:92px;gap:26px}
  .portfolio-entry h3{font-size:46px}
  .portfolio-entry p{margin-top:22px}
  .portfolio-entry-image img{height:118vw;max-height:600px}
  .portfolio-page-main{padding:80px 14px 60px}
  .portfolio-page-intro{margin-bottom:58px}
  .portfolio-page-title{font-size:50px}
  .portfolio-strip{grid-template-columns:1fr !important;gap:48px}
  .portfolio-tile figure{height:118vw;max-height:600px}
  .portfolio-page-footer{margin-top:60px;flex-direction:column}
}

/* v7 — spacing fixes, fullscreen hero, painting + wedding */
body{overflow-x:hidden}
.page-shell{overflow:hidden}

/* Hero full-screen: image occupies the entire opening visual, caption stays below */
.hero-visual{
  min-height:calc(100svh - 70px) !important;
  height:calc(100svh - 70px);
  width:100%;
  position:relative;
  overflow:hidden;
  display:block;
  background:var(--white);
}
.hero-image{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  aspect-ratio:auto !important;
  background-size:cover !important;
  background-position:center center !important;
  transform:none !important;
}
.hero:hover .hero-image{transform:none !important}
.hero-script{
  z-index:2;
  width:min(72%,1050px) !important;
  height:34% !important;
  left:50% !important;
  top:50% !important;
  transform:translate(-50%,-50%) rotate(-1deg) !important;
}
.hero-caption-zone{
  position:relative;
  min-height:170px;
  padding:44px 28px 50px;
  align-items:flex-start;
}
.hero-caption{
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.035em;
  line-height:1.25;
  max-width:620px;
}

/* Main page: more air and no accidental overlap between sections */
.section-block{position:relative;isolation:isolate}
.services{padding-top:100px;padding-bottom:140px}
.services-detail{margin-top:92px}
.service-row{position:relative;min-height:0;padding:38px 0}
.about{padding-top:120px;padding-bottom:150px}
.contact{padding-top:120px;padding-bottom:120px}

.portfolio{padding-top:130px !important;padding-bottom:170px !important}
.portfolio .section-head{margin-bottom:130px !important}
.portfolio-entry{
  position:relative;
  isolation:isolate;
  margin-bottom:180px !important;
  gap:clamp(50px,6vw,94px) !important;
  align-items:center;
}
.portfolio-entry-copy{position:relative;z-index:2;min-width:0}
.portfolio-entry h3{
  overflow-wrap:anywhere;
  word-break:normal;
  max-width:100%;
}
.portfolio-entry p{max-width:440px}
.portfolio-entry-image{position:relative;z-index:1;min-width:0}
.portfolio-entry-image img{display:block;width:100%;object-position:center}
.wedding-entry .portfolio-cta{max-width:290px;line-height:1.45}

/* Internal portfolio pages: keep title, intro and horizontal gallery clearly separated */
.portfolio-page-main{padding-top:110px !important}
.portfolio-page-intro{
  position:relative;
  z-index:2;
  margin-bottom:120px !important;
  gap:clamp(44px,6vw,90px) !important;
  align-items:end;
}
.portfolio-page-title{
  overflow-wrap:anywhere;
  max-width:100%;
}
.portfolio-page-intro p{padding-bottom:8px}
.portfolio-strip{
  position:relative;
  z-index:1;
  gap:clamp(18px,2vw,30px) !important;
  align-items:start;
}
.portfolio-tile{min-width:0}
.portfolio-tile figure{height:clamp(270px,28vw,390px) !important}
.portfolio-tile h2{min-height:2.6em;margin-top:16px}
.portfolio-page-footer{margin-top:110px !important}

@media(max-width:1100px){
  .portfolio-entry{
    grid-template-columns:minmax(240px,.72fr) minmax(0,1.28fr);
    gap:48px !important;
  }
  .portfolio-entry h3{font-size:clamp(46px,6.2vw,74px)}
  .portfolio-page-title{font-size:clamp(50px,7.2vw,84px)}
  .portfolio-strip{grid-template-columns:repeat(3,minmax(0,1fr)) !important}
}

@media(max-width:820px){
  .hero-visual{height:82svh;min-height:620px !important}
  .hero-script{width:88% !important;height:30% !important}
  .hero-caption-zone{min-height:155px;padding:34px 18px 40px}
  .portfolio-entry{grid-template-columns:1fr !important;gap:36px !important;margin-bottom:125px !important}
  .portfolio-entry-copy{max-width:650px}
  .portfolio-entry-image img{height:min(105vw,680px) !important}
  .portfolio-page-intro{grid-template-columns:1fr !important;margin-bottom:80px !important}
  .portfolio-strip{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:52px 22px !important}
  .portfolio-tile figure{height:min(58vw,480px) !important}
}

@media(max-width:600px){
  .hero-visual{height:78svh;min-height:560px !important}
  .hero-caption-zone{display:block;min-height:160px;padding:30px 14px 36px}
  .hero-caption{font-size:13px;max-width:320px}
  .hero-scroll{display:inline-block;margin-top:22px}
  .services{padding-top:80px;padding-bottom:100px}
  .portfolio{padding-top:90px !important;padding-bottom:115px !important}
  .portfolio .section-head{margin-bottom:82px !important}
  .portfolio-entry{margin-bottom:100px !important;gap:28px !important}
  .portfolio-entry h3{font-size:44px !important;line-height:.98}
  .portfolio-entry p{margin-top:24px}
  .portfolio-entry-image img{height:120vw !important;max-height:610px}
  .portfolio-page-main{padding-top:78px !important}
  .portfolio-page-intro{margin-bottom:62px !important;gap:26px !important}
  .portfolio-page-title{font-size:46px !important;line-height:.98}
  .portfolio-strip{grid-template-columns:1fr !important;gap:54px !important}
  .portfolio-tile figure{height:118vw !important;max-height:620px}
  .portfolio-tile h2{min-height:0}
  .portfolio-page-footer{margin-top:72px !important}
}


/* v8 — final macro title line breaks + user hero */
.portfolio-entry h3{
  overflow-wrap:normal !important;
  word-break:keep-all !important;
  hyphens:none !important;
}
.portfolio-entry h3 > span{
  display:block;
  white-space:nowrap;
}
/* Single-word macro titles must never break in the middle. Scale only when needed. */
@media (min-width:821px) and (max-width:1180px){
  .portfolio-entry h3{font-size:clamp(40px,5.2vw,70px) !important;}
}
@media (max-width:600px){
  .portfolio-entry h3{font-size:clamp(34px,10.5vw,44px) !important;}
}

/* v9 — internal portfolio section galleries. Everything else stays frozen. */
.portfolio-page-title > span{
  display:block;
  white-space:nowrap;
}
.portfolio-gallery-trigger{cursor:pointer}
body.portfolio-lightbox-open{overflow:hidden}
.portfolio-section-lightbox[hidden]{display:none}
.portfolio-section-lightbox{
  position:fixed;
  inset:0;
  z-index:3000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:28px;
  background:rgba(9,8,8,.94);
}
.portfolio-section-lightbox-panel{
  width:min(1380px,calc(100vw - 80px));
  max-height:calc(100svh - 70px);
  overflow:hidden;
  background:var(--paper);
  padding:30px 34px 28px;
}
.portfolio-section-lightbox-head{
  display:flex;
  align-items:baseline;
  gap:18px;
  margin-bottom:24px;
}
.portfolio-section-lightbox-no{
  color:var(--burgundy);
  font-size:9px;
  letter-spacing:.16em;
}
.portfolio-section-lightbox-title{
  margin:0;
  font-family:"Glacial Indifference","Helvetica Neue",sans-serif;
  font-size:12px;
  line-height:1;
  font-weight:400;
  letter-spacing:.14em;
}
.portfolio-section-lightbox-track{
  display:flex;
  gap:24px;
  align-items:flex-start;
  overflow-x:auto;
  overflow-y:hidden;
  padding:0 0 14px;
  scroll-snap-type:x proximity;
  overscroll-behavior-x:contain;
}
.portfolio-section-lightbox-item{
  flex:0 0 auto;
  margin:0;
  height:min(72svh,760px);
  display:flex;
  align-items:center;
  justify-content:center;
  scroll-snap-align:start;
  background:transparent;
}
.portfolio-section-lightbox-item img{
  display:block;
  width:auto;
  height:auto;
  max-height:100%;
  max-width:min(82vw,960px);
  object-fit:contain;
}
.portfolio-section-lightbox-track::-webkit-scrollbar{height:7px}
.portfolio-section-lightbox-track::-webkit-scrollbar-track{background:rgba(17,16,15,.08)}
.portfolio-section-lightbox-track::-webkit-scrollbar-thumb{background:rgba(111,31,35,.45)}
.portfolio-section-lightbox-close{
  position:fixed;
  top:24px;
  right:28px;
  z-index:3002;
  border:0;
  padding:4px 8px;
  background:transparent;
  color:#fffdf9;
  font-size:32px;
  line-height:1;
  cursor:pointer;
}
@media(max-width:700px){
  .portfolio-section-lightbox{padding:12px}
  .portfolio-section-lightbox-panel{width:calc(100vw - 24px);max-height:calc(100svh - 48px);padding:22px 16px 20px}
  .portfolio-section-lightbox-head{margin-bottom:18px}
  .portfolio-section-lightbox-item{height:min(66svh,600px)}
  .portfolio-section-lightbox-item img{max-width:84vw}
  .portfolio-section-lightbox-close{top:8px;right:9px;font-size:29px}
}

/* Portfolio intro descriptions: same sans-serif used for SERVIZI / PORTFOLIO / WHO */
.portfolio-page-intro p{
  font-family:"Glacial Indifference","Helvetica Neue",sans-serif !important;
  text-transform:none !important;
}


/* v21 — MOBILE ONLY. Desktop/tablet layouts remain unchanged. */
@media (max-width:600px){
  /* opening image: shift crop to the right so the subject sits closer to center */
  .hero-image{
    background-position:62% center !important;
  }

  /* remove scroll below payoff */
  .hero-scroll{display:none !important;}

  /* services intro: keep only section label */
  #servizi .section-head p{display:none !important;}

  /* portfolio intro wording: keep only “Clicca…” */
  #portfolio .section-head p{
    font-size:0 !important;
  }
  #portfolio .section-head p::after{
    content:"Clicca su ogni sezione per esplorarla.";
    font-size:13px;
    line-height:1.35;
  }

  /* smaller cards inside macro portfolio pages */
  .portfolio-strip{
    justify-items:start !important;
  }
  .portfolio-tile{
    width:78% !important;
    max-width:360px !important;
  }
  .portfolio-tile figure{
    height:auto !important;
    aspect-ratio:4/5 !important;
    max-height:none !important;
  }
  .portfolio-tile figure img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
  }

  /* WHO: remove tagline and background script logo */
  #about .section-head p{display:none !important;}
  .about-script{display:none !important;}

  /* replace diagonal/emoji-like arrows only on mobile */
  #about .about-copy a{
    font-size:0 !important;
  }
  #about .about-copy a::before{
    content:"INSTAGRAM →";
    font-size:13px;
  }
  #quote-form button{
    font-size:0 !important;
  }
  #quote-form button::before{
    content:"PREPARA LA RICHIESTA →";
    font-size:12px;
    letter-spacing:.12em;
  }
}

/* v22: supplied hero photo on phones, preserving the original image ratio and framing. */
@media(max-width:600px){
 .hero-image{background-image:url('hero-v22-mobile.webp') !important;background-position:center center !important;background-size:cover !important;}
}