/* Option C refined. Layout: banner hero carrying a soft frosted logo card, lilac nav ribbon, airy sections. */
:root{
  /* Logo colors: purple #6d609e, lilac #9b84b5, blue #00599e. Site lavender #f0eff5. */
  --paper:#fcfbfd; --surface:#ffffff; --lilac:#ddd6ea; --lilac-soft:#f0eff5; --orchid:#9b84b5;
  --brand:#6d609e; --brand-2:#00599e; --ink:#2a2733; --muted:#67646f; --line:#e4e1ec;
  --display:"Cormorant","Cormorant Garamond",Garamond,Georgia,serif;
  --body:"Jost","Avenir Next","Segoe UI",system-ui,sans-serif;
  --wrap:1160px; --gutter:clamp(16px,4vw,40px); --radius:6px;
}
*,*::before,*::after{box-sizing:border-box}
html{color-scheme:light;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:300 1.0625rem/1.75 var(--body);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--brand)}
:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.1;margin:0;text-wrap:balance;color:var(--brand)}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.skip{position:absolute;left:-999px}.skip:focus{left:16px;top:16px;background:var(--surface);padding:8px 12px;z-index:20}
.eyebrow,.label{font:500 .74rem/1.4 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--orchid)}
.eyebrow{margin:0 0 22px}

/* Hero */
.hero{position:relative;display:grid;place-items:center;min-height:clamp(380px,56vw,640px);padding:56px var(--gutter);overflow:hidden;background:var(--lilac)}
.hero-short{min-height:clamp(260px,32vw,380px)}
.slides{position:absolute;inset:0}
.slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}
.slide:first-child{opacity:1}
.slides:has(.slide:nth-child(2)) .slide{animation:fade 30s linear infinite}
.slides .slide:nth-child(1){animation-delay:-1.2s}
.slides .slide:nth-child(2){animation-delay:4.8s}
.slides .slide:nth-child(3){animation-delay:10.8s}
.slides .slide:nth-child(4){animation-delay:16.8s}
.slides .slide:nth-child(5){animation-delay:22.8s}
@keyframes fade{0%{opacity:0}4%{opacity:1}20%{opacity:1}24%{opacity:0}100%{opacity:0}}
.hero-veil{position:absolute;inset:0;background:linear-gradient(180deg,color-mix(in srgb,var(--brand) 22%,transparent) 0%,color-mix(in srgb,var(--lilac) 30%,transparent) 55%,color-mix(in srgb,var(--lilac-soft) 92%,transparent) 100%)}
.hero-card{position:relative;text-align:center;width:min(100%,520px);padding:34px clamp(22px,5vw,52px) 32px;
  background:color-mix(in srgb,#ffffff 80%,transparent);backdrop-filter:blur(10px) saturate(1.1);-webkit-backdrop-filter:blur(10px);
  border:1px solid color-mix(in srgb,#ffffff 70%,var(--lilac));border-radius:var(--radius);box-shadow:0 24px 60px -24px color-mix(in srgb,var(--brand) 45%,transparent);
  animation:rise .9s ease-out both}
.hero-short .hero-card{padding-block:24px}
.brand{display:block;margin:0}
.brand-mark{width:min(100%,340px);height:auto;margin-inline:auto}
.brand-logo{height:clamp(56px,7vw,72px);width:auto;margin-inline:auto}
.flourish{display:block;width:72px;height:9px;margin:14px auto;background:
  radial-gradient(circle,var(--orchid) 2.5px,transparent 2.5px) center/9px 9px no-repeat,
  linear-gradient(var(--lilac),var(--lilac)) center/100% 1px no-repeat}
.hero-home{grid-template-rows:1fr auto;gap:28px;padding-bottom:clamp(28px,4vw,44px)}
.hero-home .hero-card{align-self:center;padding-block:30px}
.hero-low{position:relative;text-align:center;max-width:34ch}
.hero-low .flourish{margin-top:0}
.hero-low .hero-tag{font-size:clamp(1.5rem,2.8vw,2.1rem);text-shadow:0 0 18px rgba(255,255,255,.95),0 0 4px rgba(255,255,255,.8)}
.hero-tag{margin:0;font:italic 500 clamp(1.4rem,2.6vw,1.85rem)/1.3 var(--display);color:var(--brand)}
.hero-title{font-size:clamp(2.2rem,4.4vw,3.2rem)}
@keyframes rise{from{opacity:.001;transform:translateY(12px)}to{opacity:1;transform:none}}


/* Nav ribbon */
.navbar{background:var(--lilac-soft);border-bottom:1px solid var(--line);position:sticky;top:env(safe-area-inset-top,0px);z-index:10}
.nav ul{list-style:none;margin:0;padding:14px var(--gutter);display:flex;flex-wrap:wrap;justify-content:center;gap:6px clamp(20px,5vw,48px)}
.nav a{color:var(--brand);text-decoration:none;font:500 .78rem/1.4 var(--body);letter-spacing:.22em;text-transform:uppercase;padding-block:4px;
  background:linear-gradient(var(--orchid),var(--orchid)) center bottom/0 1px no-repeat;transition:background-size .3s ease}
.nav a:hover,.nav a[aria-current=page]{background-size:100% 1px}

/* Intro and services */
.intro{padding-block:clamp(56px,8vw,96px) 24px;text-align:center}
.services{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:28px clamp(32px,6vw,72px);text-align:left;align-items:center;
  background:var(--surface);border-radius:var(--radius);padding:clamp(28px,5vw,52px);box-shadow:0 1px 0 var(--line),0 18px 40px -30px color-mix(in srgb,var(--brand) 40%,transparent)}
.services h2{font-size:clamp(2rem,3.4vw,2.6rem);margin-bottom:12px}
.services p{margin:0;color:var(--muted)}
.svc-list{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.svc-list li{padding:12px 0 12px 26px;color:var(--ink);font-weight:400;border-bottom:1px solid var(--line);position:relative}
.svc-list li::before{content:"";position:absolute;left:4px;top:50%;width:7px;height:7px;transform:translateY(-50%) rotate(45deg);background:var(--orchid);box-shadow:0 0 0 3px var(--lilac-soft)}
.placeholder{outline:1.5px dashed color-mix(in srgb,var(--orchid) 70%,transparent);outline-offset:8px}
@media (max-width:780px){.services{grid-template-columns:1fr}}

/* Photo grid */
.work{padding-block:clamp(48px,7vw,80px)}
.section-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 24px;margin-bottom:28px}
.section-head h2{font-size:clamp(2rem,3.4vw,2.6rem)}
.text-link{font:500 .78rem/1.4 var(--body);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--lilac);padding-bottom:3px}
.grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,2vw,22px)}
.photo{display:block;width:100%;padding:0;border:0;cursor:zoom-in;aspect-ratio:4/3;overflow:hidden;border-radius:var(--radius);background:var(--lilac-soft)}
.photo img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease,filter .7s ease}
.photo:hover img{transform:scale(1.035);filter:saturate(1.05)}
@media (max-width:820px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.grid{grid-template-columns:1fr}}
.gallery-intro{padding-block:clamp(48px,7vw,80px) 0;text-align:center}
.gallery-intro p{max-width:56ch;margin:0 auto;font:italic 400 clamp(1.3rem,2.2vw,1.6rem)/1.45 var(--display);color:var(--ink)}

.gallery-intro .nf-actions{margin-top:32px;padding-bottom:clamp(56px,8vw,96px)}

/* Band */
.band{background:linear-gradient(135deg,var(--lilac-soft),var(--lilac));padding-block:clamp(48px,7vw,72px)}
.band-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px}
.band-line{margin:0;font:400 clamp(1.6rem,3vw,2.3rem)/1.2 var(--display);color:var(--brand);max-width:24ch}
.button{display:inline-block;background:var(--brand);color:#fff;text-decoration:none;font:500 .78rem/1 var(--body);letter-spacing:.22em;text-transform:uppercase;padding:17px 30px;border-radius:999px;transition:background .3s ease}
.button:hover{background:var(--brand-2)}

/* Contact */
.contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:clamp(28px,5vw,64px);align-items:stretch;padding-block:clamp(56px,8vw,96px)}
.contact-card{background:var(--surface);border-radius:var(--radius);padding:clamp(28px,4vw,44px);box-shadow:0 1px 0 var(--line)}
.contact-card h2{font-size:clamp(2rem,3.2vw,2.5rem);margin-bottom:24px}
.contact-lines{list-style:none;margin:0;padding:0;display:grid;gap:20px}
.contact-lines li{display:grid;gap:2px}
.contact-lines a{color:var(--ink);font-size:1.2rem;text-decoration:none;border-bottom:1px solid var(--lilac);justify-self:start;overflow-wrap:anywhere}
.map{width:100%;min-height:340px;height:100%;border:0;border-radius:var(--radius);display:block;background:var(--lilac-soft)}
.map-link{display:flex;flex-direction:column;justify-content:flex-end;gap:6px;padding:28px;color:var(--ink);text-decoration:none;
  background:linear-gradient(160deg,var(--lilac-soft),color-mix(in srgb,var(--lilac) 70%,var(--paper)))}
.map-link .more{color:var(--brand);font-weight:500}
@media (max-width:780px){.contact{grid-template-columns:1fr}}

/* Footer */
.footer{background:var(--surface);border-top:1px solid var(--line);padding-block:44px 28px;font-size:.95rem}
.footer-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px}
.footer-brand{display:flex;align-items:center;gap:12px;font-family:var(--display);font-size:1.35rem;color:var(--brand)}
.footer-logo{height:44px;width:auto}
.footer-links{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 28px}
.footer-links a,.footer-contact a{color:var(--muted);text-decoration:none}
.footer-links a:hover,.footer-contact a:hover{color:var(--brand)}
.footer-contact{display:flex;flex-direction:column;gap:2px;overflow-wrap:anywhere}
.copy{text-align:center;color:var(--muted);font-size:.8rem;margin:32px 0 0;padding-inline:var(--gutter)}

/* Lightbox */
.lightbox{border:0;padding:0;background:transparent;max-width:min(92vw,1280px);max-height:90vh;overflow:visible}
.lightbox::backdrop{background:color-mix(in srgb,var(--ink) 82%,transparent)}
.lightbox img{max-height:86vh;max-width:100%;border-radius:var(--radius)}
.lb-btn{position:absolute;border:0;background:color-mix(in srgb,#ffffff 85%,transparent);color:var(--brand);width:44px;height:44px;border-radius:50%;font-size:1.6rem;line-height:1;cursor:pointer}
.lb-close{top:-14px;right:-14px}
.lb-prev{left:10px;top:50%;transform:translateY(-50%)}
.lb-next{right:10px;top:50%;transform:translateY(-50%)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}