:root{
  --bg: #faf7f2;
  --bg-alt: #f2ede3;
  --surface: #ffffff;
  --surface-2: #f4efe5;
  --line: rgba(20,18,15,0.10);
  --text: #221f1a;
  --text-muted: #67625b;
  --text-faint: #969086;
  --gold: #9c7530;
  --rust: #a8462f;
  --green: #4a5d4f;
  --blue: #4c6373;
  --serif: 'Bricolage Grotesque', 'Jost', 'Helvetica Neue', Arial, sans-serif;
  --sans: 'Jost', 'Helvetica Neue', Arial, sans-serif;
  --maxw: 1520px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--sans);
  font-weight:300;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
.container{max-width:var(--maxw); margin:0 auto; padding:0 4vw;}
h1,h2,h3,h4{font-family:var(--serif); font-weight:700; letter-spacing:0.005em; font-style:normal;}
.eyebrow{
  font-family:var(--sans); text-transform:uppercase; letter-spacing:0.28em;
  font-size:0.7rem; color:var(--gold); font-weight:500; margin-bottom:1.1rem;
}
.btn{
  display:inline-block; padding:0.85rem 2rem; border:1px solid var(--text);
  font-family:var(--sans); font-size:0.82rem; letter-spacing:0.14em; text-transform:uppercase;
  transition:all .35s ease; cursor:pointer; background:transparent; color:var(--text);
}
.btn:hover{background:var(--text); color:var(--bg);}
.btn-solid{background:var(--gold); border-color:var(--gold); color:#fffdf9;}
.btn-solid:hover{background:transparent; color:var(--gold);}
.btn-small{padding:0.6rem 1.4rem; font-size:0.72rem;}
section{padding:8.5rem 0;}
.section-head{max-width:640px; margin-bottom:4rem;}
.section-head h2{font-size:clamp(2.2rem, 4vw, 3.3rem); font-weight:700; margin-bottom:1.2rem;}
.section-head p{color:var(--text-muted); font-size:1.05rem; font-weight:300;}

/* ---------- NAV ---------- */
header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:1.6rem 6vw; transition:background .4s ease, padding .4s ease;
}
header.scrolled{background:rgba(250,247,242,0.92); backdrop-filter:blur(10px); padding:1.1rem 6vw; border-bottom:1px solid var(--line);}
.logo{font-family:var(--serif); font-size:1.05rem; font-weight:500; letter-spacing:0.01em; display:inline-flex; align-items:center; gap:0.5em;}
.logo-dot{width:6px; height:6px; min-width:6px; border-radius:50%; background:var(--gold); display:inline-block;}
nav ul{list-style:none; display:flex; gap:2.4rem;}
nav a{font-size:0.78rem; text-transform:uppercase; letter-spacing:0.14em; color:var(--text-muted); transition:color .3s;}
nav a:hover, nav a.active{color:var(--text);}
nav a.active{color:var(--gold);}
.nav-toggle{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; z-index:110;}
.nav-toggle span{width:24px; height:1px; background:var(--text);}
/* Light header text over the hero photo (index.html only), until scrolled */
body.has-hero-photo header:not(.scrolled) .logo{color:#fffdf9;}
body.has-hero-photo header:not(.scrolled) .logo-dot{background:#f2c879;}
body.has-hero-photo header:not(.scrolled) nav a{color:rgba(255,253,249,0.85);}
body.has-hero-photo header:not(.scrolled) nav a:hover,
body.has-hero-photo header:not(.scrolled) nav a.active{color:#fffdf9;}
body.has-hero-photo header:not(.scrolled) .nav-toggle span{background:#fffdf9;}

/* ---------- HERO ---------- */
.hero{
  min-height:100vh; display:flex; align-items:flex-end; position:relative; overflow:hidden;
  padding-bottom:6rem;
}
.hero-bg{
  position:absolute; left:0; right:0; top:-12%; height:124%; z-index:0; overflow:hidden;
  will-change:transform;
}
.hero-bg-image{
  position:absolute; inset:0; background-size:cover; background-position:center;
  transform:scale(1.15); animation: heroRollOn 9s ease-out forwards;
}
.hero-bg-overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(100deg, rgba(20,16,12,0.68) 0%, rgba(20,16,12,0.42) 42%, rgba(20,16,12,0.18) 68%, rgba(20,16,12,0.05) 100%),
    linear-gradient(0deg, rgba(20,16,12,0.35) 0%, transparent 30%);
}
@keyframes heroRollOn{
  0%{transform:scale(1.15);}
  100%{transform:scale(1);}
}
@media (prefers-reduced-motion: reduce){
  .hero-bg-image{animation:none; transform:scale(1);}
  .hero-bg{transform:none !important;}
}
.hero-bg::after{
  content:""; position:absolute; inset:0;
  background-image: radial-gradient(rgba(0,0,0,0.035) 1px, transparent 1px);
  background-size: 3px 3px; opacity:.5; mix-blend-mode:multiply;
}
.hero-content{position:relative; z-index:1; max-width:760px; padding:0 6vw;}
.hero-content .eyebrow{color:#f2d9a8;}
.hero-content h1{
  font-size:clamp(2rem, 4.6vw, 3.5rem); font-weight:700; line-height:1.18; margin-bottom:1.6rem;
  font-style:normal; color:#fffdf9; letter-spacing:-0.01em;
}
.hero-content h1 em{color:#f2c879; font-style:normal;}
.hero-content p{font-size:1.15rem; color:rgba(255,253,249,0.82); max-width:480px; margin-bottom:2.4rem;}
.hero-content .btn{border-color:rgba(255,253,249,0.75); color:#fffdf9;}
.hero-content .btn:hover{background:#fffdf9; color:var(--text);}
.hero-ctas{display:flex; gap:1rem; flex-wrap:wrap;}
.scroll-hint{
  position:absolute; bottom:2.4rem; right:6vw; z-index:1; font-size:0.7rem;
  letter-spacing:0.2em; text-transform:uppercase; color:rgba(255,253,249,0.65);
  writing-mode:vertical-rl;
}

/* ---------- PAGE BANNER (About / Contact subpages) ---------- */
.page-banner{
  min-height:46vh; display:flex; align-items:flex-end; position:relative; overflow:hidden;
  padding:9rem 0 4rem;
}
.page-banner .hero-bg{ }
.page-banner .container{position:relative; z-index:1;}
.page-banner h1{font-size:clamp(2.3rem, 4.4vw, 3.6rem); font-weight:700; font-style:normal; margin-bottom:0.8rem;}
.page-banner p{color:var(--text-muted); max-width:520px; font-size:1.05rem;}

/* ---------- PLACEHOLDER IMAGES ---------- */
.ph{
  position:relative; overflow:hidden; background:var(--surface-2);
  display:flex; align-items:flex-end;
}
.ph-real{background-size:cover; background-position:center; transition:transform .6s cubic-bezier(.2,.7,.2,1);}
.ph-real:hover{transform:scale(1.07);}
/* scroll-triggered reveal, scoped to photo grids only */
.reveal-ph{opacity:0; transform:translateY(28px) scale(0.98); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1);}
.reveal-ph.in-view{opacity:1; transform:translateY(0) scale(1);}
@media (prefers-reduced-motion: reduce){
  .ph-real{transition:none;}
  .reveal-ph{opacity:1; transform:none; transition:none;}
}
.ph::before{
  content:""; position:absolute; inset:0;
  background-image: radial-gradient(rgba(0,0,0,0.045) 1px, transparent 1px);
  background-size: 3px 3px; opacity:.6; mix-blend-mode:multiply;
}
.ph-tag{
  position:relative; z-index:1; font-family:'Courier New', monospace; font-size:0.62rem;
  letter-spacing:0.02em; color:rgba(20,18,15,0.65); background:rgba(255,255,255,0.75);
  padding:0.35rem 0.6rem; margin:0.7rem; border:1px dashed rgba(20,18,15,0.25);
}
.ph-1{background:linear-gradient(155deg,#e6ede6,#f9faf8 65%);}
.ph-2{background:linear-gradient(155deg,#e2ebee,#f7fafb 65%);}
.ph-3{background:linear-gradient(155deg,#f2e4d8,#fbf5ee 65%);}
.ph-4{background:linear-gradient(155deg,#e5e9ef,#f8f9fb 65%);}
.ph-5{background:linear-gradient(155deg,#f4e6d8,#fbf4ec 65%);}
.ph-6{background:linear-gradient(155deg,#e5ece6,#f7faf7 65%);}
.ph-7{background:linear-gradient(155deg,#ece4f1,#f9f5fb 65%);}
.ph-8{background:linear-gradient(155deg,#dfe7ec,#f5f8f9 65%);}
.ph-real .ph-tag{display:none;}
.ph-source{
  position:relative; z-index:1; font-size:0.62rem; letter-spacing:0.04em;
  color:rgba(255,255,255,0.85); background:rgba(20,18,15,0.5); padding:0.3rem 0.55rem; margin:0.7rem;
}

/* ---------- EVENT SERVICE ---------- */
.approach-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:2.5rem; margin-bottom:5rem;}
.approach-item h3{font-size:1.2rem; margin-bottom:0.8rem; font-weight:700;}
.approach-item p{color:var(--text-muted); font-size:0.95rem;}
.approach-item .num{font-family:var(--sans); font-style:normal; color:var(--gold); font-size:1rem; font-weight:500; letter-spacing:0.08em; margin-bottom:0.6rem; display:block;}

.event-gallery{
  display:grid; grid-template-columns:repeat(4,1fr); gap:0.6rem; margin-bottom:6rem;
  will-change:transform;
}
.event-gallery .ph{aspect-ratio:5/7;}
.event-gallery .ph, .portfolio-grid .ph{position:relative;}
.event-gallery .ph:hover, .portfolio-grid .ph:hover{z-index:5; box-shadow:0 14px 34px rgba(20,18,15,0.22);}
.event-gallery .ph-real, .portfolio-grid .ph-real{cursor:zoom-in;}

/* ---------- LIGHTBOX ---------- */
.lightbox{
  position:fixed; inset:0; background:rgba(10,8,6,0.94); z-index:200;
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity .3s ease;
}
.lightbox.open{opacity:1; pointer-events:auto;}
.lightbox-img{max-width:88vw; max-height:86vh; object-fit:contain; box-shadow:0 20px 60px rgba(0,0,0,0.5);}
.lightbox-close{
  position:absolute; top:1.6rem; right:1.8rem; background:none; border:none;
  color:#fffdf9; font-size:2.1rem; line-height:1; cursor:pointer; z-index:2; font-family:var(--sans);
}
.lightbox-prev, .lightbox-next{
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(255,253,249,0.12); border:1px solid rgba(255,253,249,0.4); color:#fffdf9;
  width:48px; height:48px; border-radius:50%; font-size:1.3rem; cursor:pointer;
  display:flex; align-items:center; justify-content:center; transition:background .25s, transform .25s;
}
.lightbox-prev:hover, .lightbox-next:hover{background:rgba(255,253,249,0.28);}
.lightbox-prev{left:1.6rem;}
.lightbox-next{right:1.6rem;}
.lightbox-counter{
  position:absolute; bottom:1.6rem; left:50%; transform:translateX(-50%);
  color:rgba(255,253,249,0.75); font-size:0.75rem; letter-spacing:0.1em; text-transform:uppercase;
}
@media (max-width:620px){
  .lightbox-prev, .lightbox-next{width:40px; height:40px; font-size:1.05rem;}
  .lightbox-prev{left:0.6rem;} .lightbox-next{right:0.6rem;}
  .lightbox-close{font-size:1.8rem; top:1rem; right:1rem;}
}

.pricing{display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem;}
.price-card{
  background:var(--surface); border:1px solid var(--line); padding:2.6rem 2.2rem;
  display:flex; flex-direction:column;
}
.price-card.featured{border-color:var(--gold); background:var(--surface-2); position:relative;}
.price-card.featured::before{
  content:"Most popular"; position:absolute; top:-0.85rem; left:2.2rem;
  background:var(--gold); color:#fffdf9; font-size:0.62rem; letter-spacing:0.1em;
  text-transform:uppercase; padding:0.35rem 0.7rem; font-weight:500;
}
.price-card h3{font-size:1.1rem; margin-bottom:0.4rem; font-weight:500;}
.price-card .price{font-family:var(--serif); font-size:1.9rem; font-weight:700; color:var(--gold); margin:0.6rem 0 1.4rem;}
.price-card .price small{font-size:0.9rem; color:var(--text-muted); font-family:var(--sans);}
.price-card ul{list-style:none; margin-bottom:2rem; flex:1;}
.price-card li{padding:0.55rem 0; border-top:1px solid var(--line); font-size:0.9rem; color:var(--text-muted);}
.price-card li:first-child{border-top:none;}

.price-note{
  display:flex; gap:1.2rem; align-items:flex-start; background:var(--surface); border:1px solid var(--line);
  border-left:2px solid var(--gold); padding:1.6rem 1.8rem; margin-top:2.2rem;
}
.price-note .mark{font-family:var(--sans); font-style:normal; font-weight:600; font-size:1.3rem; color:var(--gold); line-height:1;}
.price-note p{color:var(--text-muted); font-size:0.92rem; margin:0;}
.price-note a{color:var(--gold); text-decoration:underline; text-underline-offset:3px;}

/* ---------- PORTFOLIO ---------- */
.filters{display:flex; gap:0.5rem; flex-wrap:wrap; margin-bottom:3rem;}
.filter-btn{
  background:none; border:1px solid var(--line); color:var(--text-muted); font-family:var(--sans);
  font-size:0.75rem; letter-spacing:0.1em; text-transform:uppercase; padding:0.55rem 1.2rem;
  cursor:pointer; transition:all .3s;
}
.filter-btn:hover{border-color:var(--text-muted); color:var(--text);}
.filter-btn.active{background:var(--text); color:var(--bg); border-color:var(--text);}
.portfolio-grid{
  display:grid; grid-template-columns:repeat(4,1fr); grid-auto-flow:dense; gap:0.5rem;
  will-change:transform;
}
.portfolio-grid .ph{aspect-ratio:4/5;}
.portfolio-grid .ph{transition:opacity .3s, transform .3s;}
.portfolio-grid .ph.hidden{display:none;}
.cat-label{
  position:absolute; top:0.7rem; right:0.7rem; z-index:1; font-size:0.62rem;
  text-transform:uppercase; letter-spacing:0.12em; color:rgba(255,255,255,0.85);
  background:rgba(20,18,15,0.45); padding:0.2rem 0.5rem;
}

/* ---------- SHOP ---------- */
.shop-intro{display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:1.5rem; margin-bottom:3.5rem;}
.product-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem;}
.product-card{background:var(--surface); border:1px solid var(--line); overflow:hidden;}
.product-card .ph{height:340px;}
.product-photos.two-up{display:flex; gap:4px;}
.product-photos.two-up .ph{flex:1 1 50%; height:220px;}
.product-photos.two-up .ph .cat-label{font-size:0.56rem;}
/* Shop photos zoom slowly on click/tap rather than hover (works on touch too) */
.product-card .ph-real{transition:transform 1.3s cubic-bezier(.2,.7,.2,1); cursor:zoom-in;}
.product-card .ph-real:hover{transform:none;}
.product-card .ph-real.zoomed-in{transform:scale(1.18); cursor:zoom-out;}
.photo-toggle{display:flex; gap:0.4rem; padding:0.7rem 1.6rem 0;}
.photo-toggle-pill{
  background:none; border:1px solid var(--line); color:var(--text-muted); font-family:var(--sans);
  font-size:0.68rem; letter-spacing:0.06em; text-transform:uppercase; padding:0.35rem 0.8rem;
  cursor:pointer; transition:all .25s;
}
.photo-toggle-pill:hover{border-color:var(--text-muted); color:var(--text);}
.photo-toggle-pill.active{background:var(--gold); border-color:var(--gold); color:#fffdf9;}
.product-info{padding:1.6rem 1.6rem 1.8rem;}
.product-info .cat{font-size:0.68rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--gold); margin-bottom:0.5rem; display:block;}
.product-info h3{font-size:1.1rem; font-weight:700; margin-bottom:0.3rem;}
.product-info .desc{font-size:0.85rem; color:var(--text-muted); margin-bottom:1.1rem;}
.product-info .price-row{display:flex; align-items:center; justify-content:space-between; margin-bottom:1.2rem;}
.product-info .price-row .p{font-family:var(--serif); font-size:1.15rem; color:var(--text);}
.pay-buttons{display:flex; flex-direction:column; gap:0.6rem;}
.pay-buttons .paypal-slot{min-height:38px;}
.shop-note{
  margin-top:3rem; font-size:0.82rem; color:var(--text-faint); border-top:1px solid var(--line);
  padding-top:1.5rem;
}
.print-note{
  display:flex; gap:1rem; align-items:flex-start; background:var(--surface); border:1px solid var(--line);
  padding:1.4rem 1.6rem; margin-bottom:3rem; max-width:760px;
}
.print-note .ico{font-size:1.1rem; color:var(--gold); font-family:var(--sans); font-weight:600; font-style:normal;}
.print-note p{color:var(--text-muted); font-size:0.88rem; margin:0;}
.size-select{display:flex; gap:0.4rem; flex-wrap:wrap; margin-bottom:1rem;}
.size-pill{
  background:none; border:1px solid var(--line); color:var(--text-muted); font-family:var(--sans);
  font-size:0.7rem; letter-spacing:0.04em; padding:0.4rem 0.7rem; cursor:pointer; transition:all .25s;
}
.size-pill:hover{border-color:var(--text-muted); color:var(--text);}
.size-pill.active{background:var(--gold); border-color:var(--gold); color:#fffdf9;}
.ships-tag{
  font-size:0.68rem; color:var(--text-faint); margin-bottom:0.9rem; display:flex; align-items:center; gap:0.4rem;
}
.ships-tag::before{content:"↦"; color:var(--gold);}

/* ---------- ABOUT ---------- */
.about{display:grid; grid-template-columns:0.85fr 1.15fr; gap:5rem; align-items:center;}
.about .ph{height:560px; overflow:hidden;}
.about .ph-real{background-size:contain; background-repeat:no-repeat;}
.about-text .eyebrow{margin-bottom:1.4rem;}
.about-text p{font-size:1.05rem; color:var(--text-muted); margin-bottom:1.3rem;}
.about-text p:first-of-type{font-family:var(--sans); font-size:1.25rem; font-weight:400; font-style:normal; color:var(--text); line-height:1.5;}
.dna-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:1.6rem; margin-top:2.5rem;}
.dna-item{border-top:1px solid var(--line); padding-top:0.9rem;}
.dna-item h4{font-size:0.95rem; font-weight:700; margin-bottom:0.4rem; color:var(--gold);}
.dna-item p{font-size:0.85rem; color:var(--text-muted); margin:0;}

.genre-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:1.6rem; margin-top:1rem;}
.genre-item{border-top:1px solid var(--line); padding-top:1.2rem;}
.genre-item h4{font-size:1.05rem; font-weight:700; margin-bottom:0.5rem; color:var(--text);}
.genre-item p{font-size:0.88rem; color:var(--text-muted);}

/* ---------- CONTACT ---------- */
.contact-wrap{display:grid; grid-template-columns:0.9fr 1.1fr; gap:5rem;}
.contact-info p{color:var(--text-muted); margin-bottom:2rem; max-width:380px;}
.contact-info .detail{margin-bottom:1.4rem;}
.contact-info .detail .lbl{font-size:0.7rem; text-transform:uppercase; letter-spacing:0.14em; color:var(--gold); margin-bottom:0.3rem;}
.contact-info .detail a, .contact-info .detail span{font-size:1.05rem;}
.contact-info .detail a{display:inline-block; margin-bottom:0.3rem;}
form{display:flex; flex-direction:column; gap:1.3rem;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:1.3rem;}
label{font-size:0.72rem; text-transform:uppercase; letter-spacing:0.12em; color:var(--text-muted); margin-bottom:0.5rem; display:block;}
input, select, textarea{
  width:100%; background:var(--surface); border:1px solid var(--line); color:var(--text);
  padding:0.85rem 1rem; font-family:var(--sans); font-size:0.92rem; font-weight:300;
}
input:focus, select:focus, textarea:focus{outline:none; border-color:var(--gold);}
textarea{resize:vertical; min-height:110px;}
.form-msg{font-size:0.85rem; color:var(--gold); min-height:1.2rem;}

/* ---------- QUICK CONTACT (floating) ---------- */
.quick-contact{
  position:fixed; right:0; bottom:2.2rem; z-index:90;
  background:var(--gold); color:#fffdf9; padding:0.9rem 1.4rem 0.9rem 1.6rem;
  border-radius:4px 0 0 4px; display:flex; align-items:center; gap:0.6rem;
  font-size:0.78rem; letter-spacing:0.06em; text-transform:uppercase; font-weight:500;
  box-shadow:-4px 4px 18px rgba(20,18,15,0.14); transition:padding-right .3s ease, transform .3s ease;
}
.quick-contact:hover{padding-right:1.9rem; transform:translateX(-2px);}
.quick-contact .qc-arrow{font-size:0.95rem;}

/* ---------- BOOKING FORM EXTRAS ---------- */
.booking-hint{
  font-size:0.8rem; color:var(--text-faint); margin-top:-0.6rem; margin-bottom:0.3rem;
}
fieldset{border:none; padding:0; margin:0;}
legend{font-size:0.72rem; text-transform:uppercase; letter-spacing:0.12em; color:var(--gold); margin-bottom:0.7rem; padding:0;}
.radio-row{display:flex; gap:1.4rem; flex-wrap:wrap;}
.radio-opt{display:flex; align-items:center; gap:0.5rem; font-size:0.85rem; color:var(--text-muted); font-weight:300; cursor:pointer;}
.radio-opt input{width:auto; accent-color:var(--gold);}

footer{border-top:1px solid var(--line); padding:3rem 0; text-align:center;}
footer p{color:var(--text-faint); font-size:0.8rem; letter-spacing:0.03em;}
.footer-links{display:flex; justify-content:center; gap:1.6rem; margin-bottom:1.2rem;}
.footer-links a{font-size:0.75rem; text-transform:uppercase; letter-spacing:0.12em; color:var(--text-muted);}
.footer-links a:hover{color:var(--gold);}
.footer-social{display:flex; align-items:center; justify-content:center; gap:1rem; margin-bottom:1.2rem; flex-wrap:wrap;}
.footer-social .social-label{font-size:0.82rem; font-weight:600; text-transform:uppercase; letter-spacing:0.14em; color:var(--text-muted);}
.social-icon{display:inline-flex; align-items:center; justify-content:center; color:var(--text-muted); transition:color .3s;}
.social-icon svg{width:19px; height:19px;}
.social-icon:hover{color:var(--gold); animation:iconPulse 0.9s ease-in-out infinite;}
@keyframes iconPulse{0%,100%{transform:scale(1);} 50%{transform:scale(1.22);}}
@media (prefers-reduced-motion: reduce){.social-icon:hover{animation:none;}}

@media (max-width: 980px){
  .approach-grid{grid-template-columns:1fr; gap:2.2rem;}
  .pricing{grid-template-columns:1fr;}
  .portfolio-grid{grid-template-columns:repeat(2,1fr);}
  .product-grid{grid-template-columns:repeat(2,1fr);}
  .about{grid-template-columns:1fr; gap:2.5rem;}
  .about .ph{height:360px;}
  .genre-grid{grid-template-columns:1fr;}
  .contact-wrap{grid-template-columns:1fr; gap:3rem;}
  .event-gallery{grid-template-columns:repeat(2,1fr);}
  nav{position:fixed; top:0; right:0; height:100vh; width:78vw; max-width:340px;
    background:var(--bg); border-left:1px solid var(--line); transform:translateX(100%);
    transition:transform .4s ease; z-index:105; display:flex; align-items:center;}
  nav.open{transform:translateX(0);}
  nav ul{flex-direction:column; gap:2rem; padding:0 3rem;}
  .nav-toggle{display:flex;}
}
@media (max-width: 620px){
  section{padding:5.5rem 0;}
  .form-row{grid-template-columns:1fr;}
  .portfolio-grid{grid-template-columns:1fr 1fr;}
  .product-grid{grid-template-columns:1fr;}
  .event-gallery{grid-template-columns:repeat(2,1fr);}
  .quick-contact{bottom:1.2rem; padding:0.75rem 1.1rem 0.75rem 1.2rem; font-size:0.7rem;}
  .radio-row{flex-direction:column; gap:0.7rem;}
  .product-photos.two-up{flex-direction:column;}
  .product-photos.two-up .ph{height:260px;}
}