/* core.css = light.css + themes/spectrum.css + mobile.css, in that order. Built by perf.py; edit the parts, then rebuild. */
/* ==== light.css ==== */
/* ============================================================================
   RUDQP, LIGHT / PASTEL theme  (light.css)
   Shared foundation for the homepage CONCEPTS (concept-1..6.html). Isolated
   from the dark production site (rudqp.css). Six pastel accents + cream canvas.
   Fonts: Fraunces (display serif) + Manrope (sans).
   ========================================================================== */
:root{
  /* six pastels */
  --blush:#F7E0DA; --peach:#FBE6CC; --butter:#FBF3D6; --sage:#E2EDE2; --sky:#DCE8F2; --lavender:#EAE2F4;
  /* neutrals + accent */
  --cream:#FBF8F3; --paper:#FFFFFF; --ink:#211E1A; --muted:#7C756C;
  --line:rgba(33,30,26,.10); --line-2:rgba(33,30,26,.16);
  --accent:#C75B43; --accent-soft:#E07A5F;
  --display:'Fraunces','Georgia',serif; --sans:'Manrope','Helvetica Neue',Arial,system-ui,sans-serif;
  --wrap:min(1760px,94vw); --r:18px; --r-lg:30px; --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--cream);color:var(--ink);font-family:var(--sans);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
html{overflow-x:clip}
.fs2{overflow-x:clip}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
::selection{background:var(--accent);color:#fff}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px;width:100%}
@media(max-width:600px){.wrap{padding:0 18px}}
.sec{padding:clamp(72px,10.5vw,150px) 0}
.center{text-align:center}.mx{margin-left:auto;margin-right:auto}

/* type */
.eyebrow{font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--accent)}
.display{font-family:var(--display);font-weight:600;line-height:1.04;letter-spacing:-.01em}
h1.display{font-size:clamp(38px,7vw,84px)}
h2.display{font-size:clamp(28px,4.6vw,52px)}
.ital{font-style:italic;color:var(--accent);font-weight:500}
.lead{font-size:clamp(16px,1.5vw,19px);color:var(--muted);max-width:60ch}
.muted{color:var(--muted)}

/* buttons */
.pill{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:none;cursor:pointer;border-radius:999px;
  padding:15px 28px;font-family:var(--sans);font-size:15px;font-weight:600;line-height:1;letter-spacing:.01em;white-space:nowrap;
  transition:transform .2s var(--ease),box-shadow .28s var(--ease),background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease)}
.pill:hover{transform:translateY(-2px)}
.pill:active{transform:translateY(0) scale(.98)}
.pill:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.pill--dark{background:var(--ink);color:#fff}
.pill--dark:hover{box-shadow:0 18px 34px -14px rgba(33,30,26,.55)}
.pill--ghost{background:transparent;color:var(--ink);border:1px solid var(--line-2)}
.pill--ghost:hover{background:var(--ink);color:#fff;border-color:var(--ink);box-shadow:0 18px 34px -16px rgba(33,30,26,.4)}
.pill--accent{background:var(--accent);color:#fff}
.pill--accent:hover{background:var(--accent-soft,#E07A5F);box-shadow:0 18px 34px -14px rgba(199,91,67,.6)}
.pill .arr{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.18);display:grid;place-items:center;font-size:14px;transition:transform .25s var(--ease)}
.pill:hover .arr{transform:translateX(3px)}

/* nav (light, floating) */
.lnav{position:sticky;top:0;z-index:50;background:rgba(251,248,243,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.lnav__in{max-width:var(--wrap);margin:0 auto;padding:16px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:27px;letter-spacing:.04em;line-height:1}
.brand b{color:var(--accent)}
.brand i{font-style:italic;color:var(--accent)}
@media(max-width:560px){.brand{font-size:24px}}
.lnav__menu{display:flex;gap:6px;align-items:center;list-style:none}
.lnav__menu a{padding:9px 14px;border-radius:999px;font-size:14px;font-weight:600;color:var(--ink);transition:.2s}
.lnav__menu a:hover{background:rgba(33,30,26,.06)}
.lnav__cta{display:flex;gap:10px;align-items:center}
.lnav__toggle{display:none;width:42px;height:42px;border:1px solid var(--line-2);border-radius:50%;background:none;font-size:18px;cursor:pointer}
@media(max-width:880px){
  .lnav__menu,.lnav__cta .pill--ghost{display:none}
  .lnav__toggle{display:grid;place-items:center}
}
.lmenu{display:none}
.lmenu.open{display:block;border-bottom:1px solid var(--line);background:var(--paper)}
.lmenu a{display:block;padding:14px 28px;font-weight:600;border-top:1px solid var(--line)}

/* concept switcher bar (lets the user hop between concepts while previewing) */
.switch{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:80;display:flex;gap:6px;
  background:rgba(33,30,26,.92);backdrop-filter:blur(8px);padding:8px;border-radius:999px;box-shadow:0 18px 40px -18px rgba(0,0,0,.6)}
.switch a{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:13px;font-weight:700;opacity:.6;transition:.2s}
.switch a:hover{opacity:1;background:rgba(255,255,255,.15)}
.switch a.on{opacity:1;background:var(--accent)}
@media(max-width:600px){.switch{bottom:10px}}

/* footer */
.lfoot{background:var(--ink);color:#EFE9E1;padding:64px 0 30px;margin-top:40px}
.lfoot .wrap{display:flex;flex-wrap:wrap;gap:28px;justify-content:space-between;align-items:flex-end}
.lfoot h3{font-family:var(--display);font-size:clamp(26px,4vw,44px);font-weight:500;max-width:14ch;line-height:1.05}
.lfoot a.pill{margin-top:8px}
.lfoot__low{max-width:var(--wrap);margin:36px auto 0;padding:22px 28px 0;border-top:1px solid rgba(255,255,255,.14);display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;font-size:13px;color:#B9B1A6}

/* cards / grids reused by concepts */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:880px){.cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.cards{grid-template-columns:1fr}}
.card{position:relative;border-radius:var(--r);overflow:hidden;background:var(--paper);border:1px solid var(--line);transition:transform .4s var(--ease),box-shadow .4s}
.card:hover{transform:translateY(-6px);box-shadow:0 26px 50px -28px rgba(33,30,26,.4)}
.card__img{aspect-ratio:4/5;overflow:hidden}
.card__img img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.card:hover .card__img img{transform:scale(1.06)}
.card__b{padding:18px 20px 22px}
.card__b .k{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);font-weight:700}
.card__b h3{font-family:var(--display);font-weight:600;font-size:21px;margin-top:7px}
.card__b p{font-size:14px;color:var(--muted);margin-top:7px}
.card__b .go{margin-top:12px;font-size:13px;font-weight:700;color:var(--ink)}

/* reveal */
.r{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.r.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.r{opacity:1;transform:none}*{animation:none!important;transition-duration:.001ms!important}}

/* pill tag */
.tagrow{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.tag{padding:8px 16px;border-radius:999px;font-size:13px;font-weight:600;color:var(--ink)}

/* ===== Service detail page components (light) ============================= */
.lhero{padding:44px 0 8px}
.lhero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center}
@media(max-width:880px){.lhero__grid{grid-template-columns:1fr;gap:28px}}
.crumbs{font-size:13px;color:var(--muted)}
.crumbs a{color:var(--muted)}.crumbs a:hover{color:var(--accent)}
.lfig{position:relative}
.lfig .blk{position:absolute;inset:18px -18px -18px 18px;border-radius:var(--r-lg);z-index:0}
.lfig .ph{position:relative;z-index:1;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/5}
.lfig .ph img{width:100%;height:100%;object-fit:cover}
.inclist{display:grid;grid-template-columns:1fr 1fr;gap:12px 26px;list-style:none;margin-top:10px}
@media(max-width:600px){.inclist{grid-template-columns:1fr}}
.inclist li{display:flex;gap:10px;color:var(--ink);font-size:15px;line-height:1.5}
.inclist li b{color:var(--accent);flex:none}
.lsteps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:760px){.lsteps{grid-template-columns:1fr}}
.lstep{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:24px}
.lstep .k{font-family:var(--display);color:var(--accent);font-size:22px}
.lstep h3{font-family:var(--display);margin-top:8px;font-size:19px}
.lstep p{color:var(--muted);font-size:14px;margin-top:6px}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{border:1px solid var(--line-2);border-radius:999px;padding:10px 18px;font-weight:600;font-size:14px;transition:.2s;color:var(--ink)}
.chip:hover,.chip:focus-visible{border-color:var(--accent);color:var(--accent)}

/* light gallery + lightbox */
.lgal{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:1024px){.lgal{grid-template-columns:repeat(3,1fr);gap:12px}}
@media(max-width:680px){.lgal{grid-template-columns:repeat(2,1fr);gap:10px}}
.ltile{position:relative;display:block;aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);cursor:zoom-in;padding:0;background:none;width:100%;font:inherit}
.ltile img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.ltile:hover img,.ltile:focus-visible img{transform:scale(1.06)}
.ltile__ov{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(33,30,26,.32);opacity:0;transition:.3s;color:#fff;font-size:11px;letter-spacing:.26em;text-transform:uppercase}
.ltile:hover .ltile__ov,.ltile:focus-visible .ltile__ov{opacity:1}
.llb{position:fixed;inset:0;z-index:95;background:rgba(20,16,14,.93);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .3s}
.llb.open{opacity:1;visibility:visible}
.llb__img{max-width:92vw;max-height:86vh;border-radius:10px;background:#222}
.llb__btn{position:absolute;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.32);color:#fff;width:50px;height:50px;border-radius:50%;font-size:22px;cursor:pointer;display:grid;place-items:center;transition:.2s}
.llb__btn:hover{background:var(--accent)}
.llb__close{top:20px;right:20px}.llb__prev{left:16px;top:50%;transform:translateY(-50%)}.llb__next{right:16px;top:50%;transform:translateY(-50%)}
.llb__count{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.8);font-size:13px;letter-spacing:.1em}
@media(max-width:560px){.llb__btn{width:42px;height:42px;font-size:19px}}

/* footer social handles */
.lfoot__soc{max-width:var(--wrap);margin:32px auto 0;padding:0 28px;display:flex;flex-wrap:wrap;gap:10px 20px;align-items:center}
.lfoot__soc .lbl{font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:#B9B1A6;margin-right:6px}
.lfoot__soc a{font-size:13px;font-weight:600;letter-spacing:.03em;color:#EFE9E1;opacity:.85;position:relative;padding:3px 0;transition:opacity .3s,color .3s}
.lfoot__soc a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--peach);transition:right .38s var(--ease)}
.lfoot__soc a:hover{opacity:1;color:var(--peach)}
.lfoot__soc a:hover::after{right:0}
@media(max-width:600px){.lfoot__soc{padding:0 18px}}

/* footer concept 9 (sitewide) */
.foot{background:var(--ink);color:#EFE9E1;padding:72px 0 30px}
.foot__in{max-width:var(--wrap);margin:0 auto;padding:0 28px}
.foot__bar{display:flex;flex-wrap:wrap;gap:14px 26px;align-items:center;justify-content:space-between;padding-bottom:30px;border-bottom:1px solid rgba(255,255,255,.12)}
.foot__avail{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:#EFE9E1}
.foot__avail .dot{position:relative;width:9px;height:9px;border-radius:50%;background:#5fbf7e}
.foot__avail .dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:#5fbf7e;animation:footpulse 2s var(--ease) infinite}
@keyframes footpulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(3.4);opacity:0}}
.foot__clock{font-size:13px;color:#B9B1A6}
.foot__clock b{color:var(--peach);font-variant-numeric:tabular-nums;font-weight:700}
.foot__grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.2fr;gap:34px;padding-top:46px}
@media(max-width:900px){.foot__grid{grid-template-columns:1fr 1fr;gap:32px}}
@media(max-width:460px){.foot__grid{grid-template-columns:1fr}}
.foot__wm{font-family:var(--display);font-weight:600;font-size:clamp(32px,5vw,52px);line-height:.96}
.foot__wm b{color:var(--peach)}
.foot__brand h3{font-family:var(--display);font-weight:500;font-size:18px;color:#CFC8BE;margin:12px 0 18px;max-width:24ch;line-height:1.4}
.foot__cta{display:inline-flex;align-items:center;gap:12px;background:var(--accent);color:#fff;border-radius:999px;padding:14px 26px;font-weight:600;font-size:15px;transition:transform .35s var(--ease),box-shadow .35s;will-change:transform}
.foot__cta:hover{transform:translateY(-3px);box-shadow:0 16px 34px -14px rgba(199,91,67,.7)}
.foot .fcol h4{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:#B9B1A6;margin-bottom:14px}
.foot .fcol a{display:block;color:#EFE9E1;opacity:.85;font-size:14px;font-weight:500;padding:4px 0;width:fit-content;transition:opacity .25s,transform .25s,color .25s}
.foot .fcol a:hover{opacity:1;transform:translateX(4px);color:var(--peach)}
.foot .fcol p{color:#B9B1A6;font-size:14px;line-height:1.7}
.foot .fcol p a{display:inline}
.foot__low{margin-top:38px;padding-top:22px;border-top:1px solid rgba(255,255,255,.12);display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;font-size:13px;color:#B9B1A6}
@media(max-width:600px){.foot__in{padding:0 18px}}
@media(prefers-reduced-motion:reduce){.foot__avail .dot::after{animation:none;opacity:0}.foot__cta:hover,.foot .fcol a:hover{transform:none}}

/* brand logos (nav + footer) */
.brand__logo{height:23px;width:auto;display:block}
@media(max-width:560px){.brand__logo{height:20px}}
.foot__logo{height:46px;width:auto;display:block}
@media(max-width:560px){.foot__logo{height:38px}}
/* brands worked with strip (simple static row) */
.brands-sec{padding:clamp(64px,8vw,104px) 0;text-align:center}
.brands-eyebrow{display:inline-flex;justify-content:center}
.brands-h{font-family:var(--display);font-weight:500;font-size:clamp(24px,3.2vw,34px);line-height:1.05;margin:10px 0 0;color:var(--ink)}
.brands-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:clamp(30px,6vw,72px);margin-top:26px}
.brands-row img{height:clamp(26px,4vw,44px);width:auto;opacity:.55;filter:grayscale(1);transition:opacity .3s var(--ease),filter .3s var(--ease)}
.brands-row img:hover{opacity:1;filter:grayscale(0)}
/* featured package (home) */

/* journal article */
.art{max-width:760px;margin:0 auto;padding:0 22px}
.art__top{padding:clamp(26px,5vw,52px) 0 0}
.art__chip{display:inline-block;font:700 11px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--accent);background:var(--blush);padding:8px 13px;border-radius:999px}
.art__title{font-family:var(--display);font-weight:600;line-height:1.04;letter-spacing:-.01em;font-size:clamp(31px,6vw,58px);margin:16px 0 0}
.art__meta{display:flex;gap:10px;flex-wrap:wrap;align-items:center;color:var(--muted);font-size:13px;font-weight:600;margin-top:16px}
.art__meta .dot{width:4px;height:4px;border-radius:50%;background:var(--muted);opacity:.6}
.art__cover{margin:clamp(22px,4vw,36px) 0;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:16/10;background:var(--sky)}
.art__cover img{width:100%;height:100%;object-fit:cover}
.art__body{font-family:var(--sans);color:#312c26;font-size:clamp(16px,1.7vw,18px);line-height:1.75}
.art__body>p{margin:0 0 1.1em}
.art__body .dek{font-size:clamp(18px,2.1vw,22px);line-height:1.5;color:var(--ink);font-weight:500}
.art__body h2{font-family:var(--display);font-weight:600;font-size:clamp(23px,3.2vw,31px);line-height:1.15;margin:1.7em 0 .45em}
.art__body ul,.art__body ol{margin:0 0 1.2em;padding-left:1.2em}
.art__body li{margin:.4em 0}
.art__body blockquote{margin:1.5em 0;padding:6px 0 6px 22px;border-left:3px solid var(--accent);font-family:var(--display);font-style:italic;font-size:clamp(20px,2.6vw,26px);color:var(--ink);line-height:1.4}
.art__body a{color:var(--accent);font-weight:600;text-decoration:none}
.art__body a:hover{text-decoration:underline}
.art__maplink{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:14px;color:var(--accent);margin:2px 0 4px}
.art__cta{margin:clamp(36px,6vw,60px) auto 0;text-align:center;background:var(--peach);border-radius:var(--r-lg);padding:clamp(30px,5vw,52px) 22px;max-width:760px}
.art__cta h2{font-family:var(--display);font-weight:600;font-size:clamp(24px,4vw,38px);line-height:1.06}
.art__cta p{color:var(--muted);max-width:48ch;margin:12px auto 0}
.art__cta .pill{margin:18px 6px 0}
.art__rel{max-width:760px;margin:clamp(40px,6vw,70px) auto;padding:0 22px}
.art__rel h2{font:700 12px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--muted);border-top:1px solid var(--line);padding-top:20px;margin:0}
.art__rel a{display:block;font-family:var(--display);font-size:19px;color:var(--ink);text-decoration:none;padding:13px 0;border-bottom:1px solid var(--line);transition:color .3s,padding-left .3s}
.art__rel a:hover{color:var(--accent);padding-left:8px}
/* active nav link (set by JS, keeps nav markup identical everywhere) */
.lnav__menu a.active,.lmenu a.active{color:var(--accent)}
.quote-pre{background:var(--sage);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;margin:0 0 16px}
.quote-pre b{display:block;margin-bottom:6px;font-family:var(--display);font-weight:600;color:var(--ink)}
.quote-pre pre{white-space:pre-wrap;font-family:var(--sans);font-size:14px;line-height:1.6;color:var(--ink);margin:0}

/* home work grid (vertical covers, 2-col tablet/mobile) */
.wgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.wtile{position:relative;display:block;border-radius:var(--r);overflow:hidden;aspect-ratio:4/5;border:1px solid var(--line);background:var(--blush);text-decoration:none}
.wtile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .9s var(--ease)}
.wtile:hover img,.wtile:focus-visible img{transform:scale(1.06)}
.wcap{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:16px;background:linear-gradient(to top,rgba(20,16,14,.8),rgba(20,16,14,.05) 55%,transparent)}
.wcap .wk{font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.2em;color:#fff;opacity:.85}
.wcap h3{font-family:var(--display);color:#fff;font-weight:600;font-size:clamp(18px,1.6vw,22px);line-height:1.05;margin-top:2px}
.wcap .wgo{font-family:var(--sans);font-size:13px;font-weight:600;color:#fff;opacity:0;transform:translateY(6px);transition:.35s var(--ease);margin-top:6px}
.wtile:hover .wcap .wgo,.wtile:focus-visible .wcap .wgo{opacity:1;transform:none}
/* ---- Phone and tablet: lead and pairs (concept B) --------------------------
 * Five categories never sit evenly in a two column grid, so Weddings takes a
 * wide frame across the top and the other four fall into two clean pairs.
 * 1 + 2 + 2, no lonely tile on the last row. Desktop is untouched: it still
 * uses .g2-desktop and this whole block is behind a max-width query.
 * Each tile settles out of a slow zoom as it scrolls into view, using the
 * site's existing .r reveal, and presses in gently when tapped. */
@media(max-width:1024px){
  .wgrid{grid-template-columns:repeat(2,1fr);gap:11px}
  .wtile{aspect-ratio:1/1;border-radius:15px}
  .wtile:first-child{grid-column:1/-1;aspect-ratio:5/4}

  /* the settle: image starts slightly enlarged and eases back as the tile reveals */
  .wtile img{transform:scale(1.09);transition:transform 1.4s var(--ease)}
  .wtile.in img{transform:none}
  .wtile:active img{transform:scale(1.04);transition-duration:.5s}
  .wtile:active{transform:scale(.985);transition:transform .3s var(--ease)}

  .wcap{padding:13px}
  .wcap .wk{font-size:10px;letter-spacing:.18em}
  .wcap h3{font-size:18px;margin-top:4px}
  .wcap .wgo{display:none}

  /* the lead frame carries a little more weight, and keeps its Explore line */
  .wtile:first-child .wcap{padding:17px}
  .wtile:first-child .wcap h3{font-size:27px;margin-top:5px}
  .wtile:first-child .wcap .wgo{display:block;opacity:0;transform:translateY(8px);transition:opacity .6s var(--ease) .35s,transform .6s var(--ease) .35s}
  .wtile:first-child.in .wcap .wgo{opacity:.92;transform:none}
}
@media(max-width:380px){
  .wgrid{gap:9px}
  .wcap{padding:11px}
  .wcap h3{font-size:16.5px}
  .wtile:first-child .wcap h3{font-size:24px}
}
@media(prefers-reduced-motion:reduce){
  .wtile img,.wtile.in img{transform:none}
  .wtile:first-child .wcap .wgo{opacity:.92;transform:none}
}

/* investment section */
.lband{background:var(--cream)}
.lband .pts{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.lband .pt{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:26px}
.lband .pt .k{font-family:var(--display);font-weight:700;font-size:14px;color:var(--accent);letter-spacing:.12em}
.lband .pt h3{font-family:var(--display);font-weight:600;font-size:clamp(18px,2vw,22px);margin:10px 0 8px;color:var(--ink)}
.lband .pt p{color:var(--muted);font-size:15px;line-height:1.6;margin:0}
@media(max-width:760px){.lband .pts{grid-template-columns:1fr}}


/* typography refinement (sitewide consistency) */
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
h1,h2,h3,h4,.display{text-wrap:balance}
.display{letter-spacing:-.012em;line-height:1.04}
p,.lead{text-wrap:pretty}
.lead{line-height:1.62}
.eyebrow{letter-spacing:.18em;text-transform:uppercase}
.fok{display:block;margin-top:14px;padding:14px 16px;background:var(--sage);border:1px solid var(--line);border-radius:var(--r);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.5}
.fok:empty{display:none;padding:0;border:0;margin:0}
.fok a{color:var(--accent);font-weight:600}
/* services in detail, card grid */
.svc2{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px}
.svc2__card{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.svc2__card:hover{transform:translateY(-4px);box-shadow:0 30px 60px -40px rgba(33,30,26,.5)}
.svc2__img{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--blush)}
.svc2__img img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.svc2__card:hover .svc2__img img{transform:scale(1.05)}
.svc2__body{padding:20px;display:flex;flex-direction:column;flex:1}
.svc2__body h3{font-family:var(--display);font-weight:600;font-size:clamp(19px,2.2vw,23px);color:var(--ink);margin:0 0 8px}
.svc2__body p{color:var(--muted);font-size:14px;line-height:1.6;margin:0 0 16px}
.svc2__foot{margin-top:auto}
.svc2__price{display:block;font-family:var(--display);font-weight:600;color:var(--ink);font-size:18px;margin-bottom:10px}
.svc2__links{display:flex;gap:16px;flex-wrap:wrap}
.svc2__links a{color:var(--accent);font-weight:600;font-size:14px;text-decoration:none}
.svc2__links a:hover{text-decoration:underline}
@media(max-width:900px){.svc2{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.svc2{grid-template-columns:1fr}}
/* contact selected services */
.cpkglist{margin-top:10px;display:grid;gap:8px}
.cpkgrow{display:flex;align-items:center;gap:10px;justify-content:space-between;background:var(--cream);border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-family:var(--sans);font-size:14px}
.cpkgrow__n{flex:1;color:var(--ink)}
.cpkgrow__p{font-weight:700;color:var(--ink)}
.cpkgrow__x{border:0;background:transparent;color:var(--muted);font-size:18px;line-height:1;cursor:pointer;padding:0 4px}
.cpkgrow__x:hover{color:var(--accent)}
.cpkgrow--total{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;padding:12px 4px 0;font-family:var(--display)}
.cpkgrow--total b{font-size:18px;color:var(--accent)}
/* work gallery: desktop = accordion (g2), tablet/mobile = 2-col cards (wgrid) */
.g2-desktop{display:flex}
/* .g2-desktop stays on every screen; mobile.css restyles it into the mosaic */
@media(min-width:1025px){.wgrid{display:none!important}}
/* brands slideshow */
.brands-ss{position:relative;height:118px;max-width:560px;margin:10px auto 0}
.brands-ss .bslide{position:absolute;inset:0;display:grid;place-items:center;opacity:0;transform:scale(.92);transition:opacity .7s var(--ease),transform .7s var(--ease);pointer-events:none}
.brands-ss .bslide.on{opacity:1;transform:scale(1)}
.brands-ss .bslide img{max-height:76px;max-width:80%;width:auto;object-fit:contain;filter:grayscale(1);opacity:.85}
.bdots{display:flex;gap:8px;justify-content:center;margin-top:16px}
.bdots .bdot{width:8px;height:8px;border-radius:50%;border:0;background:var(--line-2,#e6ddd3);cursor:pointer;padding:0;transition:background .3s var(--ease),transform .3s var(--ease)}
.bdots .bdot.on{background:var(--accent);transform:scale(1.3)}
@media(max-width:560px){.brands-ss{height:96px}.brands-ss .bslide img{max-height:58px}}
/* hero CTA magnetic (concept 5) */
.ah__ct .pill{transition:transform .18s var(--ease),box-shadow .25s var(--ease),background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease)}
.ah__ct .pill:hover{box-shadow:0 18px 32px -14px rgba(33,30,26,.55)}
/* brands infinite marquee ---------------------------------------------------
 * The track holds two identical groups of logos and slides by exactly one
 * group (-50% of its own width). The last frame of the loop is therefore the
 * same pixels as the first, so it never jumps back or opens a gap, whatever
 * the logo widths happen to be. If a logo is ever added or removed, put it in
 * BOTH groups and the loop stays seamless with no other change.
 * Each group is also wider than the strip itself, so the tail of the second
 * group always covers the full width at the moment the loop wraps. */
.brands-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);margin-top:clamp(30px,4.5vw,46px);padding:8px 0}
.brands-track{display:flex;width:max-content;align-items:center;animation:brandsmarq 30s linear infinite;
              will-change:transform;backface-visibility:hidden;transform:translate3d(0,0,0)}
.brands-set{display:flex;align-items:center;flex:0 0 auto}
.brands-marquee:hover .brands-track{animation-play-state:paused}
/* Each logo gets its own size rather than one shared height, because these
 * marks are wildly different shapes: a wide wordmark, a tall stacked mark, a
 * couple of squarish ones. Sizing them individually gives them roughly equal
 * optical weight, and because every logo carries the same margin the gaps
 * between the marks stay even instead of ballooning around the small ones.
 * The sizes are whole pixels on purpose: that makes each group an exact whole
 * number of pixels wide, so the -50% loop lands pixel perfect with no snap.
 * A logo that has not downloaded yet still holds its exact space open, so a
 * slow connection cannot collapse the row and tear a gap in the strip. */
.brands-track img{flex:0 0 auto;max-width:none;object-fit:contain;margin:0 72px 0 0;filter:grayscale(1);opacity:.8;transition:filter .3s var(--ease),opacity .3s var(--ease)}
.brands-track img[src*="worked-1"]{width:76px;height:40px}   /* The Man Company */
.brands-track img[src*="worked-3"]{width:104px;height:38px}  /* Hugo Boss */
.brands-track img[src*="worked-2"]{width:39px;height:50px}   /* Coolberg */
.brands-track img[src*="worked-4"]{width:71px;height:40px}   /* MyFitness */
.brands-track img[src*="fotorgear"]{width:112px;height:31px} /* Fotorgear */
.brands-track img:hover{filter:none;opacity:1}
@keyframes brandsmarq{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@media(max-width:560px){
  .brands-track img{margin-right:46px}
  .brands-track img[src*="worked-1"]{width:59px;height:31px}
  .brands-track img[src*="worked-3"]{width:82px;height:30px}
  .brands-track img[src*="worked-2"]{width:31px;height:39px}
  .brands-track img[src*="worked-4"]{width:55px;height:31px}
  .brands-track img[src*="fotorgear"]{width:87px;height:24px}
}
@media(prefers-reduced-motion:reduce){
  .brands-track{animation:none;width:auto;flex-wrap:wrap;justify-content:center;transform:none}
  .brands-set{flex-wrap:wrap;justify-content:center;gap:26px 0}
  .brands-set+.brands-set{display:none}
}
/* gallery filter: hide non-matching tiles */
.ltile.hide{display:none!important}
/* Book page: client process timeline */
.bkproc{padding-top:clamp(26px,4vw,48px)}
.bksteps{list-style:none;max-width:660px;margin:30px auto 0;padding:0}
.bksteps li{position:relative;padding:0 0 26px 60px}
.bksteps li::before{content:"";position:absolute;left:18px;top:8px;bottom:-4px;width:2px;background:var(--line)}
.bksteps li:last-child{padding-bottom:0}
.bksteps li:last-child::before{display:none}
.bksteps .bkn{position:absolute;left:0;top:0;width:38px;height:38px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font:600 15px/1 var(--display);z-index:1}
.bksteps li:last-child .bkn{background:var(--accent)}
.bksteps h3{font-family:var(--display);font-weight:600;font-size:18px;margin:5px 0 4px;color:var(--ink)}
.bksteps p{color:var(--muted);font-size:14.5px;line-height:1.6;margin:0}
/* booking: returning-client welcome banner */
.cp__welcome{background:var(--sage);border:1px solid var(--line);border-radius:14px;padding:12px 16px;margin:0 0 16px;font-size:14.5px;line-height:1.55;color:var(--ink)}
.cp__welcome a{color:var(--accent);font-weight:600}
.foot__legal{margin-top:8px;font-size:13px;opacity:.85}
.foot__legal a{color:inherit}
.morelist a{color:var(--accent);font-weight:600;text-decoration:none}.morelist a:hover{text-decoration:underline}
/* ===== nav redesign v2 ===== */
.lnav{position:sticky;top:0;z-index:50;background:rgba(251,248,243,.82);backdrop-filter:saturate(150%) blur(16px);-webkit-backdrop-filter:saturate(150%) blur(16px);border-bottom:1px solid var(--line);transition:box-shadow .35s var(--ease)}
.lnav.scrolled{box-shadow:0 12px 34px -24px rgba(33,30,26,.55)}
.lnav__in{max-width:var(--wrap);margin:0 auto;padding:15px 28px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:26px;letter-spacing:.06em;line-height:1;color:var(--ink);white-space:nowrap}
.brand i,.brand b{font-style:italic;color:var(--accent)}
.lnav__menu{display:flex;gap:36px;align-items:center;list-style:none;margin:0;padding:0}
.lnav__menu li{margin:0}
.lnav__menu a{position:relative;display:inline-block;padding:6px 0;border-radius:0;background:none;font:600 14px/1 var(--sans);letter-spacing:.02em;color:var(--muted);transition:color .25s var(--ease)}
.lnav__menu a::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:2px;border-radius:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.lnav__menu a:hover{background:none;color:var(--ink)}
.lnav__menu a:hover::after{transform:scaleX(1)}
.lnav__menu a.active{color:var(--ink)}
.lnav__menu a.active::after{transform:scaleX(1)}
.lnav__cta{display:flex;gap:12px;align-items:center}
.lnav__cta .pill{padding:11px 24px;font-size:14px;margin:0}
.lnav__toggle{display:none;width:44px;height:44px;border:1px solid var(--line-2);border-radius:50%;background:none;font-size:18px;cursor:pointer;color:var(--ink);align-items:center;justify-content:center}
@media(max-width:880px){.lnav__menu{display:none}.lnav__toggle{display:flex}}
.lmenu{display:none}
.lmenu.open{display:block;border-bottom:1px solid var(--line);background:var(--paper)}
.lmenu a{display:block;padding:15px 28px;font:600 15px/1 var(--sans);color:var(--ink);border-top:1px solid var(--line)}
.lmenu a.active{color:var(--accent)}
/* ===== nav redesign v3: floating capsule ===== */
.lnav{position:sticky;top:0;z-index:50;background:transparent;border-bottom:0;backdrop-filter:none;-webkit-backdrop-filter:none;padding:14px 16px 0;transition:padding .35s var(--ease)}
.lnav.scrolled{box-shadow:none;padding-top:8px}
.lnav__in{max-width:900px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:18px;background:rgba(255,255,255,.86);backdrop-filter:saturate(150%) blur(14px);-webkit-backdrop-filter:saturate(150%) blur(14px);border:1px solid var(--line);border-radius:999px;padding:10px 12px 10px 24px;box-shadow:0 18px 44px -28px rgba(33,30,26,.55)}
.brand{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:25px;letter-spacing:.06em;line-height:1;color:var(--ink);white-space:nowrap}
.brand i,.brand b{font-style:italic;color:var(--accent)}
.lnav__menu{display:flex;gap:30px;align-items:center;list-style:none;margin:0;padding:0}
.lnav__menu li{margin:0}
.lnav__menu a{position:relative;display:inline-block;padding:6px 2px;background:none;border-radius:0;font:600 14px/1 var(--sans);letter-spacing:.01em;color:var(--ink);opacity:.66;transition:opacity .25s var(--ease),color .25s var(--ease)}
.lnav__menu a::after{content:none}
.lnav__menu a:hover{opacity:1;color:var(--accent);background:none}
.lnav__menu a.active{opacity:1;color:var(--accent)}
.lnav__cta{display:flex;gap:10px;align-items:center}
.lnav__cta .pill{margin:0;padding:11px 22px;font-size:14px}
.lnav__cta .pill--accent{background:var(--accent);color:#fff;border:1.5px solid var(--accent)}
.lnav__cta .pill--accent:hover{transform:translateY(-2px);box-shadow:0 14px 28px -12px rgba(199,91,67,.6)}
.lnav__toggle{display:none;width:42px;height:42px;border:1px solid var(--line-2);border-radius:50%;background:none;font-size:18px;cursor:pointer;color:var(--ink);align-items:center;justify-content:center}
@media(max-width:880px){.lnav__menu{display:none}.lnav__toggle{display:flex}.lnav__in{padding:8px 10px 8px 20px}}
.lmenu{display:none}
.lmenu.open{display:block;margin:10px 16px 0;border:1px solid var(--line);border-radius:18px;background:var(--paper);overflow:hidden;box-shadow:0 18px 44px -28px rgba(33,30,26,.5)}
.lmenu a{display:block;padding:14px 22px;font:600 15px/1 var(--sans);color:var(--ink);border-top:1px solid var(--line)}
.lmenu a:first-child{border-top:0}
.lmenu a.active{color:var(--accent)}
/* work gallery: load more button */
.loadmore-wrap{text-align:center;margin-top:28px}
.loadmore{display:inline-flex;align-items:center;justify-content:center;padding:13px 32px;border-radius:999px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);font:600 14px/1 var(--sans);cursor:pointer;transition:background .3s var(--ease),color .3s var(--ease),transform .2s var(--ease)}
.loadmore:hover{background:var(--ink);color:#fff;transform:translateY(-2px)}

/* ============================================================
   FOOTER - mobile redesign + optimization (<=640px)
   Single tidy column: stacked status bar, full-width CTA,
   Explore as a 2-col link grid, Follow as wrapping chips,
   stacked legal row. Bigger tap targets, tighter rhythm.
   ============================================================ */
@media(max-width:640px){
  .foot{padding:44px 0 26px}
  .foot__in{padding:0 20px}

  /* status bar: stack instead of awkward space-between wrap */
  .foot__bar{flex-direction:column;align-items:flex-start;gap:9px;padding-bottom:22px}
  .foot__avail,.foot__clock{font-size:12.5px}

  /* one clean column */
  .foot__grid{grid-template-columns:1fr;gap:34px;padding-top:30px}

  /* brand + thumb-friendly full-width CTA */
  .foot__brand h3{font-size:17px;margin:12px 0 18px;max-width:none}
  .foot__cta{width:100%;justify-content:center;padding:16px 24px;font-size:15.5px}

  .foot .fcol h4{margin-bottom:12px}

  /* EXPLORE (2nd column): compact 2-up link grid */
  .foot__grid>.fcol:nth-child(2){display:grid;grid-template-columns:1fr 1fr;column-gap:16px;align-content:start}
  .foot__grid>.fcol:nth-child(2) h4{grid-column:1 / -1}
  .foot__grid>.fcol:nth-child(2) a{padding:10px 0}

  /* FOLLOW (3rd column): wrapping tappable chips, not a tall list */
  .foot__grid>.fcol:nth-child(3){display:flex;flex-wrap:wrap;gap:9px}
  .foot__grid>.fcol:nth-child(3) h4{flex-basis:100%;margin-bottom:2px}
  .foot__grid>.fcol:nth-child(3) a{padding:9px 15px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(255,255,255,.05);font-size:13px;opacity:.95;width:auto}
  .foot__grid>.fcol:nth-child(3) a:hover{transform:none;background:rgba(255,255,255,.12);color:#EFE9E1;opacity:1}

  /* CONTACT (4th column) */
  .foot__grid>.fcol:nth-child(4) p{font-size:14.5px}

  /* legal row: stacked + scannable */
  .foot__low{flex-direction:column;align-items:flex-start;gap:9px;margin-top:32px;padding-top:20px;font-size:12.5px}
  .foot__legal{margin-top:0}
}

/* very small phones: explore back to single column */
@media(max-width:360px){
  .foot__grid>.fcol:nth-child(2){grid-template-columns:1fr}
  .foot__cta{padding:15px 18px;font-size:15px}
}

/* ---- live pricing section (admin-managed) ---- */
.psec__menu{margin-top:22px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.psec__row{display:flex;justify-content:space-between;gap:14px;align-items:baseline;padding:16px 20px;border-bottom:1px solid var(--line)}
.psec__row:last-child{border-bottom:0}
.psec__row b{font-family:var(--display);font-weight:600;font-size:17px;color:var(--ink);display:block}
.psec__row i{font-style:normal;display:block;font-size:13px;color:var(--muted);margin-top:3px;max-width:56ch}
.psec__row .p{font:700 14px/1 var(--sans);color:var(--accent);white-space:nowrap}
.psec__grid{display:grid;gap:12px;margin-top:14px}
@media(min-width:760px){.psec__grid{grid-template-columns:1fr 1fr}}
.psec__box{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:14px 18px}
.psec__box h4{font-family:var(--display);font-weight:600;font-size:15.5px;margin:0 0 6px;color:var(--ink)}
.psec__box .mini{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px dashed var(--line);font-size:13.5px;color:var(--ink)}
.psec__box .mini:last-child{border-bottom:0}
.psec__box .mini span:last-child{color:var(--accent);font-weight:700;white-space:nowrap}

/* ===== mobile polish (mobile-only; desktop rules unchanged) ===== */
@media(max-width:880px){
  .chip{padding:12px 20px;font-size:15px}          /* 44px-class tap targets */
  .psec__row{flex-wrap:wrap;row-gap:2px}           /* pricing rows never squeeze */
}
@media(max-width:600px){
  body{overflow-x:clip}                             /* kill accidental sideways scroll */
  .lnav__cta a{padding-top:12px;padding-bottom:12px}
}

/* ---- Social media packages (pricing, social, shared) ------------------ */
.spkg-wrap{max-width:var(--wrap,1200px);margin:0 auto}
.spkg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:900px){.spkg-grid{grid-template-columns:1fr;max-width:460px;margin-inline:auto}}
.spkg{position:relative;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg,22px);padding:clamp(24px,3vw,34px);display:flex;flex-direction:column}
.spkg--pop{border:1.5px solid var(--accent);box-shadow:0 34px 66px -48px rgba(199,91,67,.5)}
.spkg__flag{position:absolute;top:-12px;left:clamp(22px,3vw,34px);background:var(--accent);color:#fff;font:700 10.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:7px 12px;border-radius:999px}
.spkg__tag{font:700 11px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.spkg__name{font-family:var(--display);font-weight:500;font-size:26px;color:var(--ink);margin:9px 0 8px}
.spkg__price{font-family:var(--display);font-weight:600;font-size:clamp(30px,4vw,42px);color:var(--ink);line-height:1}
.spkg__price span{font-family:var(--sans);font-weight:600;font-size:14px;color:var(--muted)}
.spkg__list{list-style:none;margin:18px 0 24px;padding:0;flex:1}
.spkg__list li{position:relative;padding:9px 0 9px 24px;border-bottom:1px solid var(--line);color:var(--ink);font-size:14.5px;line-height:1.5}
.spkg__list li::before{content:"";position:absolute;left:3px;top:15px;width:9px;height:9px;border-radius:50%;background:var(--accent);opacity:.55}
.spkg__cta{width:100%;justify-content:center}
.spkg-oneoff{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:20px}
@media(max-width:700px){.spkg-oneoff{grid-template-columns:1fr}}
.spkg-row{background:var(--paper);border:1px solid var(--line);border-radius:var(--r,16px);padding:20px 22px}
.spkg-row__h{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.spkg-row__h b{font-family:var(--display);font-weight:600;font-size:18px;color:var(--ink)}
.spkg-row__h span{font-family:var(--display);font-weight:600;color:var(--accent)}
.spkg-row i{display:block;font-style:normal;font:600 11.5px/1 var(--sans);letter-spacing:.08em;color:var(--muted);text-transform:uppercase;margin-top:5px}
.spkg-row ul{list-style:none;margin:12px 0 0;padding:0}
.spkg-row li{position:relative;color:var(--muted);font-size:14px;line-height:1.55;padding:3px 0 3px 15px}
.spkg-row li::before{content:"\00B7";position:absolute;left:3px;color:var(--accent);font-weight:700}
.spkg-note{margin-top:22px;font:600 12.5px/1.6 var(--sans);color:var(--muted)}
.spkg-note a{color:var(--accent)}
.sm-chip{display:inline-flex;align-items:center;padding:9px 16px;border-radius:999px;background:var(--paper);border:1px solid var(--line);font:600 13.5px/1 var(--sans);color:var(--ink)}

/* ---- Pricing: jump nav + FAQ accordion ------------------------------- */
.pjump{display:flex;flex-wrap:wrap;gap:10px}
.pjump__a{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;border:1px solid var(--line);background:var(--paper);font:600 13.5px/1 var(--sans);color:var(--ink);transition:border-color .25s var(--ease),transform .25s var(--ease)}
.pjump__a i{font-style:italic;font-family:var(--display);color:var(--accent);font-weight:600}
.pjump__a:hover{border-color:var(--accent);transform:translateY(-2px)}
.faq{max-width:820px}
.faq__q{border-bottom:1px solid var(--line)}
.faq__q summary{list-style:none;cursor:pointer;padding:20px 44px 20px 0;position:relative;font-family:var(--display);font-weight:600;font-size:clamp(17px,2.2vw,20px);color:var(--ink)}
.faq__q summary::-webkit-details-marker{display:none}
.faq__q summary::after{content:"+";position:absolute;right:4px;top:15px;font-size:26px;line-height:1;color:var(--accent);transition:transform .3s var(--ease)}
.faq__q[open] summary::after{transform:rotate(45deg)}
.faq__q p{color:var(--muted);font-size:15px;line-height:1.7;margin:-4px 0 20px;max-width:72ch}

/* ---- Home: two-service cards ----------------------------------------- */
.two-svc{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:760px){.two-svc{grid-template-columns:1fr}}
.svc-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(26px,3.4vw,40px);display:flex;flex-direction:column;align-items:flex-start}
.svc-card h3{font-family:var(--display);font-weight:600;font-size:clamp(22px,3vw,28px);color:var(--ink);margin:8px 0 10px}
.svc-card p{color:var(--muted);font-size:15px;line-height:1.65;margin:0 0 auto;max-width:44ch}
.svc-card__price{font-family:var(--display);font-style:italic;font-weight:500;font-size:18px;color:var(--accent);margin:16px 0 0}
.svc-card .pill{margin-top:20px}

/* ============================================================
   MOBILE HARDENING (about 95% of visitors are on mobile)
   iOS auto-zooms a focused field whose font-size is under 16px,
   so keep every form control at 16px. Guarantee 44px tap targets
   on the mobile nav, and block accidental sideways scroll from
   wide media. Desktop layout is unchanged.
   ============================================================ */
input, select, textarea { font-size: 16px; }
img, svg, video, iframe { max-width: 100%; }
@media (max-width: 900px){
  .lnav__toggle { width: 44px; height: 44px; }   /* full 44px tap target */
  .lmenu a { padding-top: 15px; padding-bottom: 15px; }
  .lnav__menu a { padding-top: 10px; padding-bottom: 10px; }
}


/* ===== Websites and automations, home section + /systems =================
 * Concept B. A single dark dashboard carries the visual weight; the seven
 * services sit under it as hairline-separated text rather than seven boxes,
 * so the block stays quiet next to the photography above it.
 * ======================================================================== */
.sysd-split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(34px,5vw,70px);align-items:center}
@media(max-width:880px){.sysd-split{grid-template-columns:1fr;gap:34px}}

.sysd-svc{display:grid;grid-template-columns:1fr 1fr;gap:22px 30px;margin-top:clamp(30px,4vw,46px)}
.sysd-svc div{border-top:1px solid var(--line);padding-top:13px}
.sysd-svc b{display:block;font-family:var(--display);font-weight:600;font-size:17px;line-height:1.2;color:var(--ink)}
.sysd-svc span{display:block;color:var(--muted);font-size:14px;line-height:1.55;margin-top:4px}
.sysd-svc div:last-child{grid-column:1/-1}
@media(max-width:520px){.sysd-svc{grid-template-columns:1fr;gap:18px}.sysd-svc div:last-child{grid-column:auto}}

.sysd-dash{background:var(--ink);border-radius:var(--r-lg);padding:clamp(22px,2.6vw,30px);color:#EFE9E1}
.sysd-dash__hd{display:flex;align-items:center;justify-content:space-between;gap:14px}
.sysd-dash__hd b{font-family:var(--display);font-weight:600;font-size:18px}
.sysd-live{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#B9B1A6}
.sysd-live i{width:8px;height:8px;border-radius:50%;background:#5fbf7e;position:relative;flex:none}
.sysd-live i::after{content:"";position:absolute;inset:0;border-radius:50%;background:#5fbf7e;animation:footpulse 2s var(--ease) infinite}
.sysd-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:26px}
.sysd-kpi .l{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#B9B1A6}
.sysd-kpi .v{font-family:var(--display);font-weight:600;font-size:clamp(24px,2.6vw,30px);margin-top:6px;font-variant-numeric:tabular-nums;line-height:1}
.sysd-kpi .v em{font-style:normal;font-size:13px;color:var(--peach);margin-left:6px}
.sysd-chart{display:flex;align-items:flex-end;gap:8px;height:104px;margin-top:26px;border-top:1px solid rgba(255,255,255,.14);padding-top:22px}
.sysd-chart i{flex:1;border-radius:4px;background:rgba(255,255,255,.22)}
.sysd-chart i.hi{background:var(--peach)}
@media(prefers-reduced-motion:reduce){.sysd-live i::after{animation:none;opacity:0}}

/* ==== themes/spectrum.css ==== */
/* Inter + Inter Tight, self-hosted (SIL OFL). Latin subset, variable weight, one file each. Apple devices use SF from the stack and never download these. */
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:400 800;font-display:swap;src:url(/assets/fonts/inter-tight-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 800;font-display:swap;src:url(/assets/fonts/inter-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Metric-matched fallbacks (Arial on Windows, Roboto on Android) so the swap to Inter does not move the text (CLS). */
@font-face{font-family:'Inter Tight Fallback';src:local('Arial'),local('Roboto');size-adjust:97%;ascent-override:99.9%;descent-override:24.9%;line-gap-override:0%}
@font-face{font-family:'Inter Fallback';src:local('Arial'),local('Roboto');size-adjust:106.6%;ascent-override:90.9%;descent-override:22.6%;line-gap-override:0%}
/* ============================================================================
   RUDQP theme: SPECTRUM  (Apple rhythm, white-first, one gradient)
   White and #f5f5f7 sections, black type, no accent colour at all except one
   orange-pink-violet-blue gradient: headline second sentence, primary buttons,
   a soft halo behind hero photos, and a tint on photo hover.
   Load AFTER light.css.
   ========================================================================== */
:root{
  --cream:#FFFFFF; --paper:#F5F5F7; --ink:#1D1D1F; --muted:#6E6E73;
  --line:rgba(0,0,0,.10); --line-2:rgba(0,0,0,.18); --ink-rgb:29,29,31;
  --accent:#1D1D1F; --accent-soft:#3A3A3C; --on-accent:#FFFFFF; --accent-rgb:29,29,31;
  --blush:#F5F5F7; --peach:#F5F5F7; --butter:#F5F5F7; --sage:#F5F5F7; --sky:#F5F5F7; --lavender:#F5F5F7;
  --g-bg:#F5F5F7; --k-bg:#000000; --k-paper:#1D1D1F; --k-ink:#F5F5F7; --k-muted:#86868B;
  --nav-bg:rgba(255,255,255,.72); --nav-pill:rgba(255,255,255,.8); --foot-hi:#F5F5F7;
  --spec:linear-gradient(100deg,#FF7A3D 0%,#FF3D8B 32%,#9B5CFF 66%,#3D9BFF 100%);
  --display:-apple-system,'SF Pro Display',BlinkMacSystemFont,'Inter Tight','Inter Tight Fallback','Inter','Helvetica Neue',Arial,sans-serif; --sans:-apple-system,'SF Pro Text',BlinkMacSystemFont,'Inter','Inter Fallback','Helvetica Neue',Arial,sans-serif;
  --r:22px; --r-lg:28px;
}
html .ital{background:var(--spec);-webkit-background-clip:text;background-clip:text;color:transparent}
html .pill--accent,html .lnav__cta .pill--accent,html .foot__cta,html .hbtn--mag,html .cbtn{background:var(--spec);color:#fff;border-color:transparent}
html .pill--accent:hover,html .lnav__cta .pill--accent:hover,html .foot__cta:hover{background:var(--spec);filter:saturate(1.15)}
html .cbtn *{color:#fff}
html .lband .pt .k{color:var(--muted)}
html .foot,html .lfoot{--k-bg:#F5F5F7;--k-paper:#FFFFFF;--k-ink:#1D1D1F;--k-muted:#6E6E73;--line:rgba(0,0,0,.1)}
html .foot__wm b{background:var(--spec);-webkit-background-clip:text;background-clip:text;color:transparent}
html .foot .fcol a:hover{color:#9B5CFF}
html .close .eyebrow,html .close h2 .ital{color:rgba(255,255,255,.7);background:none;-webkit-text-fill-color:currentColor}
html .sysd-kpi .v em{color:#3D9BFF}
html .sysd-chart i.hi{background:var(--spec)}
/* photographs: gradient halo behind the hero fan, gradient tint on hover */
html .ah{position:relative;isolation:isolate}
html .ah>*{position:relative;z-index:1}
html .ah::before{content:"";position:absolute;left:50%;top:-4%;width:min(1100px,90vw);height:520px;transform:translateX(-50%);background:radial-gradient(50% 60% at 30% 50%,rgba(255,122,61,.28),transparent 70%),radial-gradient(45% 60% at 70% 45%,rgba(61,155,255,.28),transparent 70%),radial-gradient(40% 50% at 50% 60%,rgba(155,92,255,.22),transparent 70%);filter:blur(34px);z-index:0;opacity:.65;pointer-events:none}

/* ---- shared Apple-rhythm mechanics -------------------------------------
   Colour is scoped per section: each top-level section re-declares the
   same variables light.css already uses, so cards, lines, text and buttons
   inside it recolour themselves. No layout property is touched.        */

/* type: tight sans display, sans body (SF Pro stand-ins) */
html .display,html .ah h1,html .brands-h,html .foot__wm,html .lfoot h3,html h1,html h2,html h3,
html .wcard q,html .c1-feat .cnum,html .ah__stats b,html .tq .m,html .lband .pt h3,html .lband .pt .k,html .li__t h3,html .close h2,html .sysd-svc b,html .brand{
  font-family:var(--display)}
html .ah h1,html .display,html h1.display,html h2.display,html .close h2{letter-spacing:-.03em;font-weight:700}
html .ital{font-style:normal;font-weight:700}
html .eyebrow{letter-spacing:.02em;text-transform:none;font-size:15px;font-weight:600;color:var(--muted)}
html .pola .cap{font-style:normal}
html .brand{font-family:var(--display);font-weight:700;letter-spacing:-.04em}
html .brand b,html .brand i{color:var(--ink);font-style:normal}

/* every top-level section paints its own ground */
html main>section{background:var(--cream);color:var(--ink)}
html main>section:nth-of-type(9),html .foot,html .lfoot,html .sysd-dash{
  --cream:var(--k-bg);--paper:var(--k-paper);--ink:var(--k-ink);--muted:var(--k-muted);
  --line:rgba(255,255,255,.12);--line-2:rgba(255,255,255,.2);--ink-rgb:245,245,247;
  --blush:var(--k-paper);--peach:var(--k-paper);--butter:var(--k-paper);--sage:var(--k-paper);--sky:var(--k-paper);--lavender:var(--k-paper);
  background:var(--cream);color:var(--ink)}
html main>section:nth-of-type(3),html main>section:nth-of-type(5),html main>section:nth-of-type(7),html main>section:nth-of-type(10){--cream:var(--g-bg);--paper:var(--g-paper,#FFFFFF);background:var(--cream)}

/* buttons: Apple pills. primary = accent, secondary = ink pill, ghost = outline */
html .pill--accent,html .lnav__cta .pill--accent,html .foot__cta,html .cbtn,html .hbtn--mag{background:var(--accent);color:var(--on-accent);border-color:var(--accent);box-shadow:none}
html .pill--accent:hover,html .lnav__cta .pill--accent:hover,html .foot__cta:hover{background:var(--accent-soft);box-shadow:none}
html .cbtn,html .mag:hover .hbtn--mag,html .hbtn--mag:focus-visible{box-shadow:none}
html .mag:hover .hbtn--ghost,html .hbtn--ghost:focus-visible{box-shadow:none;border-color:var(--ink);color:var(--ink)}
html .pill--dark{background:var(--ink);color:var(--cream)}
html .pill--dark:hover{box-shadow:none;opacity:.88}
html .pill--ghost:hover{color:var(--cream)}
html .hbtn--ghost{border-color:var(--line-2)}
html .lnav__menu a:hover{background:rgba(var(--ink-rgb),.06)}
html ::selection{background:var(--accent);color:var(--on-accent)}

/* nav */
html .lnav{background:var(--nav-bg)}
html .lnav__in{background:var(--nav-pill)}

/* cards lose the coloured shadow language; flat, big radius, hairline */
html .pola,html .cghost:hover,html .avcal__nav,html .cp__in:focus,html .cp__step:hover,html .cp__addon:has(input:checked),html .cp__addon .ck{background:var(--paper)}
html .cp__addon:has(input:checked){box-shadow:none}
html .ah__stats,html .c1-feat{background:var(--paper)}

/* footer highlights and the dark dashboard card */
html .foot__wm b,html .foot__clock b,html .foot .fcol a:hover,html .lfoot__soc a:hover,html .close .eyebrow,html .close h2 .ital,html .sysd-kpi .v em{color:var(--foot-hi)}
html .lfoot__soc a::after,html .sysd-chart i.hi{background:var(--foot-hi)}
html .foot,html .lfoot{color:var(--k-ink)}
html .foot .fcol a,html .foot__avail,html .lfoot__soc a{color:var(--k-ink)}
html .foot .fcol h4,html .foot .fcol p,html .foot__low,html .foot__clock,html .lfoot__low,html .lfoot__soc .lbl{color:var(--k-muted)}
html .foot__brand h3{color:var(--k-muted)}
html .foot__bar,html .foot__low,html .lfoot__low{border-color:var(--line)}
html .brands-track img,html .brands-row img{filter:grayscale(1) var(--logo-fix,brightness(1))}
html .foot__logo{filter:invert(1) brightness(.12)}

/* ---- studio admin (admin.html): one calm ground, gradient only on the earnings hero ---- */
html .main>section.panel{--cream:#FFFFFF;--paper:#F5F5F7;--ink:#1D1D1F;--muted:#6E6E73;--line:rgba(0,0,0,.1);--line-2:rgba(0,0,0,.18);--ink-rgb:29,29,31;background:transparent;color:var(--ink)}
html .dearn__hero{background:var(--spec);color:#fff}
html .sbadge,html .bfx-new,html .lg--booked,html .calev,html .asmsg.me{background:var(--spec)}
html .caldot,html .dref .bar{background:#9B5CFF}
html .sitem.on,html .snav .sitem.on:hover,html .bktab.on,html .bkbtn.sync,html .bfx-del.armed{color:#fff}



/* ============================================================================
   ACCENT POLICY (final). Apple rules, applied:
   1. One coloured action per screen. The gradient fills only the nav "Book",
      the booking "Send my code" and the closing CTA. Every other button is a
      black pill (white pill on black sections) or a hairline outline.
   2. One gradient phrase per section: the second sentence of the headline.
      Nothing else in the type is coloured. Card titles, names, labels: ink.
   3. Colour as light, not paint: a soft halo behind the hero photographs and
      faint corner glows on grey/black grounds. No coloured borders or bars.
   4. Photographs are never tinted.
   ========================================================================== */
/* 1. actions */
html .pill--accent,html .foot__cta,html .hbtn--mag,html .pill--accent:hover,html .foot__cta:hover{background:var(--ink);color:var(--cream);border-color:transparent;box-shadow:none;filter:none}
html .pill--accent:hover,html .foot__cta:hover{opacity:.85}
html .lnav__cta .pill--accent,html .lnav__cta .pill--accent:hover,html .cp__btn.pill--dark,html .cp__btn.pill--dark:hover,html .cbtn,html .cbtn:hover{background:var(--spec);color:#fff;border-color:transparent;opacity:1;filter:none}
html .cbtn *{color:#fff}
html .pill--dark,html .rvbook,html .pill--dark:hover{background:var(--ink);color:var(--cream);border:0;opacity:1}
html .pill--dark:hover{opacity:.85}
html .pill--ghost,html .wmore,html .loadmore{background:transparent;color:var(--ink);border:1px solid var(--line-2)}
html .pill--ghost:hover,html .wmore:hover,html .loadmore:hover{background:var(--ink);color:var(--cream);border-color:var(--ink)}
html .pill .arr{background:rgba(255,255,255,.18)}
html .chip.on,html .cp__steps li.on{background:var(--ink);color:var(--cream);border-color:transparent}
/* 2. type */
html .ital{background:var(--spec);-webkit-background-clip:text;background-clip:text;color:transparent;font-style:normal}
html .ah h1,html .display,html h1.display,html h2.display,html .close h2,html .brands-h,html .cp__title{font-weight:700;letter-spacing:-.03em}
html .eyebrow,html .cp__eyebrow{color:#6E6E73}
html .lead,html .cp__sub{color:#515154;font-weight:400}
html .ah__stats b,html .c1-feat .cnum{color:var(--ink)}
html .wcard__who b,html .sysd-svc b,html .li__t h3,html .cp__card h2,html .cp__title,html main h3,html .tq .m,html .lband .pt .k{color:var(--ink)}
html .wcard__who .wav{background:var(--paper)!important;color:var(--ink);border:1px solid var(--line)}
html .wstars{color:#FF9F0A}
html .wcard__mk{color:#D1D1D6}
html .wcard::before,html .cp__card::before{display:none}
html .sysd-svc div{border-top:1px solid var(--line);padding-top:13px}
html .sysd-svc div::before{display:none}
html .li__b{background:var(--paper);border:1px solid var(--line-2);color:var(--ink)}
html .cp__catprice,html .cp__link,html .cp__err{background:none;-webkit-text-fill-color:currentColor;color:var(--ink);font-weight:600}
html .cp__link{text-decoration:underline}
html .cp__err{color:#FF3B30}
html .cp__welcome,html .cp__price{background:var(--paper);border-color:var(--line)}
html .cp__cat:hover,html .cp__cat.on,html .cp__cat[aria-pressed="true"]{background:var(--paper);border:1px solid var(--ink)}
html .cp__in:focus{border-color:var(--ink);box-shadow:0 0 0 3px rgba(0,0,0,.06)}
html .foot .fcol a:hover{color:var(--ink)}
html .sysd-kpi .v em{color:#2997FF}
html .sysd-chart i.hi{background:#2997FF}
html .brand i,html .brand b{background:var(--spec);-webkit-background-clip:text;background-clip:text;color:transparent;font-style:normal}
/* 3. light */
html .ah{position:relative;isolation:isolate}
html .ah>*{position:relative;z-index:1}
html .ah::before{content:"";position:absolute;left:50%;top:-4%;width:min(1100px,90vw);height:520px;transform:translateX(-50%);z-index:0;pointer-events:none;opacity:.75;filter:blur(34px);
  background:radial-gradient(50% 60% at 30% 50%,rgba(255,122,61,.28),transparent 70%),radial-gradient(45% 60% at 70% 45%,rgba(61,155,255,.28),transparent 70%),radial-gradient(40% 50% at 50% 60%,rgba(155,92,255,.22),transparent 70%)}
html main>section:nth-of-type(3),html main>section:nth-of-type(5),html main>section:nth-of-type(7),html main>section:nth-of-type(10){
  background:radial-gradient(55% 55% at 0% 0%,rgba(255,122,61,.09),transparent 62%),radial-gradient(50% 55% at 100% 100%,rgba(61,155,255,.09),transparent 62%),var(--g-bg)}
html main>section:nth-of-type(9){
  background:radial-gradient(55% 60% at 0% 0%,rgba(155,92,255,.26),transparent 62%),radial-gradient(50% 55% at 100% 100%,rgba(61,155,255,.2),transparent 62%),var(--k-bg)}
html .foot,html .lfoot{background:#F5F5F7}
html .close__veil{background:radial-gradient(60% 70% at 50% 50%,rgba(20,10,40,.45),rgba(20,10,40,.86))}
html .foot__avail .dot,html .foot__avail .dot::after,html .sysd-live i,html .sysd-live i::after{background:#34C759}
/* 4. photographs */
html .ah img,html .ltile img,html .pola img,html .mq img{filter:none}
html .ltile__ov{background:rgba(0,0,0,.35)}
/* nav: the sliding pill (rudqp-nav.js) is the hover state */
html .lnav__menu a:hover{background:transparent;color:var(--ink)}
/* nav Book: outline only */
html .lnav__cta .pill--accent{background:transparent;color:var(--ink);border:1px solid var(--line-2)}
html .lnav__cta .pill--accent:hover{background:var(--ink);color:var(--cream);border-color:var(--ink)}

/* section rhythm: Apple blocks are tighter than the old 150px */
html .sec{padding:clamp(56px,7vw,96px) 0}
html .brands-sec{padding:clamp(40px,5vw,64px) 0}
html .cp--home{padding-top:clamp(52px,6vw,80px)}

/* work tiles: no frame */
html .ltile{border:0}

/* ---- navigation v6: one dropdown (Photography) with live preview + mobile sheet ----
   Open: frosted panel settles from .98 and 8px above, rows fade in 18ms apart,
   the preview photo eases from 1.04. Close: 160ms fade, no movement. */
html .lnav__menu .has-dd{position:relative}
/* dropdown hint: a small chevron drawn as an inline mask, sits on the text line, turns when open */
html .lnav__menu .has-dd>a{white-space:nowrap;padding-right:22px;position:relative}
html .lnav__menu .has-dd>a::after{content:"";position:absolute;left:auto;right:6px;bottom:auto;top:50%;width:10px;height:10px;margin-top:-5px;background:currentColor;opacity:.55;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2 3.5l3 3 3-3' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2 3.5l3 3 3-3' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .25s cubic-bezier(.2,.8,.2,1),opacity .2s;border:0;transform:none}
html .lnav__menu .has-dd>a:hover::after,html .lnav__menu .has-dd.open>a::after{opacity:1}
html .lnav__menu .has-dd.open>a::after{transform:rotate(180deg)}
html .ddp{position:absolute;left:-10px;top:calc(100% + 12px);width:600px;display:grid;grid-template-columns:1fr 236px;gap:8px;padding:8px;background:rgba(255,255,255,.94);backdrop-filter:saturate(180%) blur(22px);-webkit-backdrop-filter:saturate(180%) blur(22px);border:1px solid rgba(0,0,0,.08);border-radius:24px;box-shadow:0 30px 70px -32px rgba(0,0,0,.35);z-index:60;
  opacity:0;visibility:hidden;transform:translateY(-8px) scale(.98);transform-origin:48px 0;transition:opacity .16s,transform .16s,visibility 0s .16s}
html .has-dd.open .ddp{opacity:1;visibility:visible;transform:none;transition:opacity .28s cubic-bezier(.2,.8,.2,1),transform .28s cubic-bezier(.2,.8,.2,1)}
html .ddp::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
html .ddp__list{display:flex;flex-direction:column;gap:2px;padding:8px 4px 4px}
html .ddp__list a{display:grid;grid-template-columns:44px 1fr;column-gap:12px;align-items:center;padding:8px 10px;border-radius:14px;color:#1d1d1f;text-decoration:none;opacity:0;transform:translateY(6px);transition:background .18s,opacity .22s cubic-bezier(.2,.8,.2,1),transform .22s cubic-bezier(.2,.8,.2,1)}
html .has-dd.open .ddp__list a{opacity:1;transform:none}
html .has-dd.open .ddp__list a:nth-child(1){transition-delay:.02s}html .has-dd.open .ddp__list a:nth-child(2){transition-delay:.038s}html .has-dd.open .ddp__list a:nth-child(3){transition-delay:.056s}html .has-dd.open .ddp__list a:nth-child(4){transition-delay:.074s}html .has-dd.open .ddp__list a:nth-child(5){transition-delay:.092s}html .has-dd.open .ddp__list a:nth-child(6){transition-delay:.11s}
html .ddp__list a img{grid-row:1/3;width:44px;height:44px;border-radius:11px;object-fit:cover;background:#e9e9ee;display:block}
html .ddp__list a b{font:600 15px/1.2 var(--sans);letter-spacing:-.01em;align-self:end}
html .ddp__list a span{font:400 12.5px/1.3 var(--sans);color:#6E6E73;align-self:start;margin-top:2px}
html .ddp__list a:hover,html .ddp__list a:focus-visible,html .ddp__list a.pv{background:#F5F5F7;outline:none}
html .ddp__list .ddp__all{grid-template-columns:1fr auto;margin-top:6px;padding:14px 12px 10px;border-top:1px solid rgba(0,0,0,.08);border-radius:0;font:600 14px/1 var(--sans);color:#1d1d1f;background:none!important}
html .ddp__all i{font-style:normal;transition:transform .2s cubic-bezier(.2,.8,.2,1)}
html .ddp__all:hover i{transform:translateX(4px)}
html .ddp__pv{position:relative;border-radius:18px;overflow:hidden;background:#e9e9ee;min-height:296px}
html .ddp__pv img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.04);transition:opacity .35s,transform .7s cubic-bezier(.2,.8,.2,1)}
html .ddp__pv img.on{opacity:1;transform:none}
html .ddp__pv::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(to top,rgba(0,0,0,.55),transparent);pointer-events:none}
html .ddp__pvl{position:absolute;left:14px;bottom:12px;z-index:1;color:#fff;font:600 14px/1.2 var(--sans);letter-spacing:-.01em}
html .ddp__pvl small{display:block;font:500 11.5px/1.3 var(--sans);opacity:.85;margin-top:2px}
/* ---- navigation v7 ----
   Desktop (D1): the floating capsule tightens on scroll, the sliding pill is the hover state,
   and the page you are on is written in the spectrum gradient.
   Phones (M4): the menu button grows into a floating island card at the top right; a second tap,
   Escape, or a tap outside snaps it back into the button. Never full-screen. */
html .lnav{transition:padding .45s cubic-bezier(.2,.8,.2,1)}
html .lnav__in{transition:max-width .45s cubic-bezier(.2,.8,.2,1),padding .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s}
html .lnav.scrolled{padding-top:8px}
html .lnav.scrolled .lnav__in{max-width:800px;box-shadow:0 18px 40px -24px rgba(0,0,0,.45)}
html .lnav .brand{transition:transform .45s cubic-bezier(.2,.8,.2,1);transform-origin:left center}
html .lnav.scrolled .brand{transform:scale(.92)}
/* wordmark motion (L1 + L3): QP cycles through the spectrum without end, and every 4s a band of
   the four colours sweeps across the whole word (drawn as a second copy of the text on top). */
html .lnav .brand{position:relative;isolation:isolate}
html .lnav .brand i{background:linear-gradient(90deg,#FF5C7A,#FF3E9A,#8A5CFF,#3D8BFF,#FF5C7A);background-size:400% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:wmCycle 6s linear infinite}
html .lnav .brand::after{content:"RUDQP";position:absolute;inset:0;display:inline-flex;align-items:center;font:inherit;letter-spacing:inherit;background:linear-gradient(90deg,transparent 0 36%,#FF5C7A 42%,#FF3E9A 47%,#8A5CFF 53%,#3D8BFF 58%,transparent 64% 100%);background-size:320% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:wmSweep 4.2s cubic-bezier(.45,.05,.2,1) infinite;pointer-events:none}
@keyframes wmCycle{to{background-position:-400% 0}}
@keyframes wmSweep{0%{background-position:100% 0}55%,100%{background-position:0 0}}
@media(prefers-reduced-motion:reduce){html .lnav .brand i,html .lnav .brand::after{animation:none}html .lnav .brand::after{display:none}}
html .lnav__menu a.on{background:transparent;color:transparent;background-image:var(--spec);-webkit-background-clip:text;background-clip:text;font-weight:700}
html .lnav__menu:hover a.on{background:transparent;background-image:var(--spec);-webkit-background-clip:text;background-clip:text}
html .lnav__menu .has-dd.open>a.on::after,html .lnav__menu .has-dd>a.on::after{background:#8A5CFF;opacity:1}
@media(max-width:880px){
  html .lnav .lnav__in{position:relative;z-index:3}
  /* menu open: the page behind is frozen and the sheet keeps its own scroll */
  html.menu-open,html.menu-open body{overflow:hidden!important;touch-action:none;overscroll-behavior:none}
  html.menu-open body{position:relative}
  html .lmenu{overscroll-behavior:contain;touch-action:pan-y;scrollbar-width:none}
  html .lmenu::-webkit-scrollbar{display:none}
  html.menu-open::before{content:"";position:fixed;inset:0;z-index:1;background:rgba(0,0,0,.28);backdrop-filter:blur(2px);animation:lmenuVeil .3s ease both}
  @keyframes lmenuVeil{from{opacity:0}}
  html .lmenu{display:block;position:fixed;top:calc(74px + env(safe-area-inset-top));right:14px;left:14px;max-height:calc(100dvh - 100px);overflow:auto;-webkit-overflow-scrolling:touch;margin:0;padding:6px 18px 14px;background:rgba(255,255,255,.9);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border:1px solid rgba(0,0,0,.08);border-radius:26px;box-shadow:0 30px 60px -25px rgba(0,0,0,.45);z-index:60;transform-origin:calc(100% - 30px) -20px;transform:scale(.2);opacity:0;visibility:hidden;pointer-events:none;transition:transform .22s cubic-bezier(.4,0,.6,1),opacity .18s,visibility 0s .22s}
  html .lmenu.open{display:block;transform:none;opacity:1;visibility:visible;pointer-events:auto;margin:0;border-radius:26px;box-shadow:0 30px 60px -25px rgba(0,0,0,.45);animation:none;transition:transform .5s cubic-bezier(.3,1.25,.35,1),opacity .25s}
  html .lmenu a{border:0}
  html .lmenu__hd{display:none}
  html .lmenu__row{display:flex;flex-direction:column;gap:2px;padding:13px 2px;border-radius:0;border-bottom:1px solid rgba(0,0,0,.08);position:relative;color:#1d1d1f;text-decoration:none;animation:lmenuRow .45s cubic-bezier(.2,.8,.2,1) both}
  html .lmenu__row:nth-child(3){animation-delay:.04s}html .lmenu__row:nth-child(4){animation-delay:.08s}html .lmenu__row:nth-child(5){animation-delay:.12s}html .lmenu__row:nth-child(6){animation-delay:.16s}html .lmenu__row:nth-child(7){animation-delay:.2s}
  @keyframes lmenuRow{from{opacity:0;transform:translateY(10px)}}
  html .lmenu__row b{font:700 23px/1.05 var(--display);letter-spacing:-.03em}
  html .lmenu__row span{font:400 13px/1.35 var(--sans);color:#6E6E73}
  html .lmenu__row i{position:absolute;right:6px;top:18px;font-style:normal;color:#6E6E73;transition:transform .25s}
  html .lmenu__row[aria-expanded="true"] i{transform:rotate(180deg)}
  html .lmenu__row.on{background:none}
  html .lmenu__row.on b{background:var(--spec);-webkit-background-clip:text;background-clip:text;color:transparent}
  html .lmenu__sub{padding:0 0 10px}
  html .lmenu__sub a{display:block;padding:9px 0;font:500 15px/1.2 var(--sans);color:#1d1d1f}
  html .lmenu__tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:8px 0 14px;border-bottom:1px solid rgba(0,0,0,.08)}
  html .lmenu__tiles a{position:relative;aspect-ratio:1/1;border-radius:14px;overflow:hidden;padding:0;background:#e9e9ee;display:block;animation:lmenuRow .4s cubic-bezier(.2,.8,.2,1) both}
  html .lmenu__tiles a:nth-child(2){animation-delay:.03s}html .lmenu__tiles a:nth-child(3){animation-delay:.06s}html .lmenu__tiles a:nth-child(4){animation-delay:.09s}html .lmenu__tiles a:nth-child(5){animation-delay:.12s}html .lmenu__tiles a:nth-child(6){animation-delay:.15s}
  html .lmenu__tiles img{width:100%;height:100%;object-fit:cover;display:block}
  html .lmenu__tiles a::after{content:"";position:absolute;inset:auto 0 0 0;height:60%;background:linear-gradient(to top,rgba(0,0,0,.55),transparent)}
  html .lmenu__tiles b{position:absolute;left:9px;bottom:8px;z-index:1;color:#fff;font:600 12px/1.2 var(--sans);letter-spacing:-.01em}
  html .lmenu__tiles .lmenu__all{display:grid;place-items:center;background:#F5F5F7;color:#1d1d1f;font:700 13px/1.3 var(--sans);text-align:center;padding:8px}
  html .lmenu__tiles .lmenu__all::after{display:none}
  html .lmenu__small{display:flex;flex-wrap:wrap;gap:4px 16px;justify-content:center;padding:14px 4px 0}
  html .lmenu__small a{display:inline-flex;align-items:center;min-height:40px;padding:0;font:600 12.5px/1 var(--sans);color:#6E6E73}
  html .lnav__toggle{transition:background .3s,color .3s,border-color .3s,transform .5s cubic-bezier(.3,1.25,.35,1)}
  html .lnav__toggle[aria-expanded="true"]{background:#1d1d1f;color:#fff;border-color:#1d1d1f;transform:rotate(90deg)}
}
html .lmenu__row.on{background:none}
@media(prefers-reduced-motion:reduce){html .ddp,html .ddp__list a,html .ddp__pv img,html .lmenu.open,html .lmenu__row,html .lmenu__tiles a{transition:none!important;animation:none!important;transform:none!important}}

/* ---- footer v5: five columns, tidy on every width ---- */
html .foot__grid{grid-template-columns:1.4fr 1fr 1fr 1fr 1.2fr;gap:34px 28px}
@media(max-width:1024px){html .foot__grid{grid-template-columns:1fr 1fr 1fr}html .foot__brand{grid-column:1/-1}}
@media(max-width:600px){html .foot__grid{grid-template-columns:1fr 1fr}}
html .foot .fcol a{color:#1d1d1f;opacity:1}
html .foot .fcol a:hover{opacity:.7;transform:none}
html .foot .fcol h4{color:#6E6E73}
html .foot__cta{background:#1d1d1f;color:#fff}

/* ---- home closing: the one stacked headline ---- */
html .ah-close{padding:clamp(72px,10vw,140px) 0 clamp(64px,8vw,110px);text-align:center;background:#fff}
html .ah-close .eyebrow{margin-bottom:18px}
html .ah-close__h{font-family:var(--display);font-weight:800;font-size:clamp(48px,10vw,136px);line-height:.9;letter-spacing:-.045em;text-transform:uppercase;margin:0 auto;max-width:100%;overflow:visible}
html .ah-close__h span{display:block}
html .ah-close__h .ital{font-style:normal;font-weight:800}
html .ah-close__ct{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:34px}
@media(max-width:680px){html .ah-close__ct{flex-direction:column;align-items:center}}

/* ---- contact: Book a shoot / Ask a question switch, and the question form ---- */
html .cpmode{position:relative;display:grid;grid-template-columns:1fr 1fr;background:#F5F5F7;border-radius:999px;padding:4px;max-width:440px;margin:0 auto 22px}
html .cpmode__b{position:relative;z-index:1;border:0;background:none;padding:12px 10px;border-radius:999px;font:600 14px/1 var(--sans);color:#6E6E73;cursor:pointer;min-height:44px;transition:color .25s}
html .cpmode__b.on{color:#1d1d1f}
html .cpmode__ind{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);background:#fff;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,.08);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
html .cpmode--second .cpmode__ind{transform:translateX(100%)}
html .askf{position:relative}
html .askf .cp__row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
html .askf__opt{font-weight:500;color:#6E6E73}
html .askf__hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
html .askf__alt{margin:14px 0 0;text-align:center;font-size:14px}
html .askf__alt a{color:#1d1d1f;font-weight:600}
html .askf__done{text-align:center}
html .askf__acts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:16px}
html select.cp__in{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231d1d1f' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px}
@media(max-width:680px){html .askf .cp__row{grid-template-columns:1fr}html .cpmode{margin-bottom:18px}}
@media(prefers-reduced-motion:reduce){html .cpmode__ind{transition:none}}

/* ---- homepage v2: closing heading + question form in one, compact "new at the studio", full-width layout ---- */
html .ah-close{padding:clamp(72px,10vw,140px) 0 0}
html .ah-close__lead{max-width:44ch;margin:22px auto 0;color:#6E6E73}
html .ah-close__lead a{color:#1d1d1f;font-weight:600}
html .ah-close .cp--close{padding:clamp(28px,4vw,48px) 0 clamp(64px,8vw,110px);text-align:left;background:transparent}
html .ah-close .cp--close .cp__wrap{margin:0 auto}
html .sysd-sec{padding:clamp(48px,6vw,80px) 0}
html .sysd-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
html .sysd-chips span{font:600 13px/1 var(--sans);padding:10px 14px;border-radius:999px;border:1px solid var(--line);background:#fff;color:#1d1d1f}
html .sysd-chips span:first-child{background:var(--spec);color:#fff;border-color:transparent}

/* ---- hero button B2: gradient slides in from the left on hover, arrow appears ---- */
html .ah__ct .pill--fill{position:relative;isolation:isolate;overflow:hidden;gap:8px}
html .ah__ct .pill--fill::before{content:"";position:absolute;inset:0;border-radius:999px;background:var(--spec);transform:translateX(-101%);transition:transform .45s cubic-bezier(.2,.8,.2,1);z-index:-1}
html .ah__ct .pill--fill:hover{color:#fff;border-color:transparent;background:transparent;box-shadow:0 18px 34px -16px rgba(138,92,255,.5)}
html .ah__ct .pill--fill:hover::before{transform:none}
html .ah__ct .pill--fill .ar{font-style:normal;display:inline-block;width:0;opacity:0;margin-left:-8px;transition:width .3s,opacity .3s,margin .3s}
html .ah__ct .pill--fill:hover .ar{width:14px;opacity:1;margin-left:0}
@media(prefers-reduced-motion:reduce){html .ah__ct .pill--fill::before{transition:none}}
/* ---- monthly packages ---- */
html .pksec{padding:clamp(56px,7vw,96px) 0}
html .pkgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch}
@media(max-width:960px){html .pkgrid{grid-template-columns:1fr;max-width:520px;margin:0 auto}}
html .pkgrid{max-width:1180px;margin:0 auto}
html .pk{position:relative;background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px 26px 24px;display:flex;flex-direction:column}
html .pk--hot{border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,var(--spec) border-box}
html .pk__tag{position:absolute;top:-13px;left:24px;font:800 10.5px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:#fff;background:var(--spec);padding:8px 12px;border-radius:999px}
html .pk h3{margin:0;font:800 24px/1.1 var(--sans);letter-spacing:-.02em}
html .pk__for{color:#6E6E73;font-size:14px;margin:8px 0 18px;min-height:42px}
html .pk__price{font:800 42px/1 var(--sans);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
html .pk__price small{font:600 14px/1 var(--sans);color:#6E6E73;letter-spacing:0;margin-left:6px}
html .pk__per{font:600 12px/1.4 var(--sans);color:#6E6E73;margin-top:8px}
html .pk ul{list-style:none;margin:20px 0 0;padding:18px 0 0;border-top:1px solid var(--line);display:grid;gap:10px;font-size:14px;color:#1d1d1f}
html .pk li{display:grid;grid-template-columns:18px 1fr;gap:10px;align-items:start}
html .pk li::before{content:"";width:18px;height:18px;border-radius:50%;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 12.5l3.2 3.2L17 9' stroke='%23fff' stroke-width='2.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/70% no-repeat,var(--spec);margin-top:1px}
html .pk__cta{margin-top:auto;padding-top:22px}
html .pk__cta .pill{width:100%;justify-content:center}
html .pk--hot .pk__cta .pill{background:var(--spec);color:#fff;border-color:transparent}
html .pk--custom{background:#F5F5F7;border-style:dashed;border-color:rgba(0,0,0,.18)}
html .pk__tag--soft{background:#1d1d1f}
html .pk__price--txt{font-size:34px;letter-spacing:-.02em;color:#1d1d1f}
html .pk__mail{display:block;text-align:center;margin-top:12px;font:600 13px/1.3 var(--sans);color:#6E6E73;text-decoration:none}
html .pk__mail:hover{color:#1d1d1f;text-decoration:underline}

/* ==== homepage v3 ==== */
/* gallery: spotlight. The hovered strip stays lit, the others dim; a light follows the cursor and the photo drifts under it */
html .g2 .gtile{transition:flex .55s var(--ease),filter .5s}
html .g2:hover .gtile{filter:brightness(.55) saturate(.7)}
html .g2 .gtile:hover{filter:none}
html .g2 .gtile img{transform:translate(var(--mx,0),var(--my,0)) scale(1.12);transition:transform .3s ease-out}
html .g2 .gtile::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(260px circle at var(--px,50%) var(--py,50%),rgba(255,255,255,.22),transparent 60%);opacity:0;transition:opacity .4s}
html .g2 .gtile:hover::before{opacity:1}
html .g2 .gtile .gcap{z-index:2}
/* process, design D: a progress ring that fills as steps go by, next to an accordion list */
html .procsec{padding:clamp(56px,7vw,96px) 0}
html .procD{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,72px);align-items:center;max-width:1080px;margin:0 auto}
@media(max-width:820px){html .procD{grid-template-columns:1fr;gap:30px}}
html .procD__ring{position:relative;width:min(320px,80vw);aspect-ratio:1;margin:0 auto}
html .procD__ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
html .procD__ring circle{fill:none;stroke-width:6;stroke-linecap:round}
html .procD__ring .bg{stroke:rgba(0,0,0,.08)}
html .procD__ring .fg{stroke:url(#procD-grad);stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.1s var(--ease)}
html .procD__mid{position:absolute;inset:15%;border-radius:50%;background:#fff;border:1px solid rgba(0,0,0,.10);display:grid;place-items:center;text-align:center;padding:22px;box-shadow:0 30px 60px -34px rgba(0,0,0,.18)}
html .procD__mid h2{margin:0;font:600 clamp(19px,2.3vw,25px)/1.15 var(--sans);letter-spacing:-.02em;color:#1d1d1f}
html .procD__cnt{margin-top:10px;font:600 11px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#6E6E73}
html .procD__list{display:grid}
html .procD__step{border-top:1px solid rgba(0,0,0,.10)}
html .procD__step:last-child{border-bottom:1px solid rgba(0,0,0,.10)}
html .procD__step button{all:unset;display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:16px;width:100%;padding:18px 4px;cursor:pointer;box-sizing:border-box}
html .procD__step button:focus-visible{outline:3px solid var(--ink);outline-offset:-2px;border-radius:8px}
html .procD__no{width:32px;height:32px;border-radius:50%;background:rgba(0,0,0,.05);display:grid;place-items:center;font:600 13px/1 var(--sans);color:#1d1d1f;transition:background .5s,color .5s}
html .procD__step h3{margin:0;font:600 19px/1.2 var(--sans);letter-spacing:-.015em;color:#1d1d1f;transition:transform .5s var(--ease)}
html .procD__chev{font-size:18px;color:#6E6E73;transition:transform .5s var(--ease);line-height:1}
html .procD__body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s var(--ease)}
html .procD__body>div{overflow:hidden}
html .procD__body p{margin:0;padding:0 4px 20px 54px;color:#6E6E73;max-width:52ch;font-size:15px;line-height:1.6}
html .procD__step.on .procD__no{background:#1d1d1f;color:#fff}
html .procD__step.on h3{transform:translateX(4px)}
html .procD__step.on .procD__chev{transform:rotate(45deg)}
html .procD__step.on .procD__body{grid-template-rows:1fr}
@media(max-width:820px){
  html .procD__ring{width:min(240px,66vw)}
  html .procD__body p{font-size:14.5px}
}
@media(prefers-reduced-motion:reduce){html .procD__ring .fg,html .procD__body,html .procD__step h3,html .procD__chev,html .procD__no{transition:none}}
/* media buttons */
html .sysd-chips--btn a{display:inline-flex;align-items:center;gap:6px;font:600 13px/1 var(--sans);padding:11px 15px;border-radius:999px;border:1px solid var(--line);background:#fff;color:#1d1d1f;text-decoration:none;transition:transform .25s var(--ease),box-shadow .25s,border-color .25s}
html .sysd-chips--btn a::after{content:"\2192";opacity:.5;transition:transform .25s}
html .sysd-chips--btn a:hover{transform:translateY(-2px);box-shadow:0 12px 24px -16px rgba(0,0,0,.4);border-color:#1d1d1f}
html .sysd-chips--btn a:hover::after{transform:translateX(3px);opacity:1}
html .sysd-chips--btn a:first-child{background:var(--spec);color:#fff;border-color:transparent}
/* closing title: words rise in as it scrolls into view; "remember." keeps the spectrum sweep going */
html .ah-close__h--anim span{opacity:0;transform:translateY(.35em) rotate(1.5deg);transition:opacity .7s var(--ease),transform .9s var(--ease)}
html .ah-close__h--anim.in span{opacity:1;transform:none}
html .ah-close__h--anim.in span:nth-child(2){transition-delay:.12s}html .ah-close__h--anim.in span:nth-child(3){transition-delay:.24s}html .ah-close__h--anim.in span:nth-child(4){transition-delay:.4s}
html .ah-close__h--anim .ital{position:relative;isolation:isolate;display:block;width:max-content;margin:0 auto}
html .ah-close__h--anim .ital::after{content:attr(data-text);position:absolute;inset:0;background:linear-gradient(90deg,transparent 0 36%,rgba(255,255,255,.95) 50%,transparent 64% 100%);background-size:320% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;color:transparent;animation:closeSweep 4.2s cubic-bezier(.45,.05,.2,1) infinite;pointer-events:none}
@keyframes closeSweep{0%{background-position:100% 0}55%,100%{background-position:0 0}}
@media(prefers-reduced-motion:reduce){html .ah-close__h--anim span{opacity:1;transform:none}html .ah-close__h--anim .ital::after{animation:none}}
/* ==== footer v2: mirrors the navigation; groups collapse on phones ==== */
html .foot--v2{padding:clamp(48px,6vw,80px) 0 calc(24px + env(safe-area-inset-bottom))}
html .foot--v2 .foot__top{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;padding-bottom:30px;border-bottom:1px solid var(--line)}
html .foot__wmark{font:800 34px/1 var(--display);letter-spacing:-.04em;color:#1d1d1f;text-decoration:none}
html .foot__wmark i{font-style:normal;background:var(--spec);-webkit-background-clip:text;background-clip:text;color:transparent}
html .foot__tag{margin:12px 0 18px;max-width:38ch;color:#6E6E73;font-size:15px}
html .foot__ctas{display:flex;gap:10px;flex-wrap:wrap}
html .foot__status{display:flex;flex-direction:column;gap:8px;align-items:flex-end;font-size:13px}
html .foot--v2 .foot__nav{display:grid;grid-template-columns:repeat(5,1fr);gap:28px 24px;padding:34px 0 10px}
html .fgrp{border:0}
html .fgrp summary{list-style:none;cursor:default;display:flex;align-items:center;justify-content:space-between;min-height:28px}
html .fgrp summary::-webkit-details-marker{display:none}
html .fgrp h3,html .fgrp h4,html .fgrp--contact h3,html .fgrp--contact h4{margin:0 0 12px;font:800 11.5px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#6E6E73}
html .fgrp summary i{display:none}
html .fgrp__l{display:flex;flex-direction:column;gap:2px}
html .fgrp__l a,html .fgrp__l span{font:500 14.5px/1.4 var(--sans);color:#1d1d1f;text-decoration:none;padding:5px 0;display:block}
html .fgrp__l span{color:#6E6E73}
html .fgrp__l a:hover{color:#8A5CFF}
html .foot--v2 .foot__low{margin-top:28px;padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;color:#6E6E73}
html .foot--v2 .foot__legal{display:flex;gap:18px;margin:0;opacity:1}
html .foot--v2 .foot__legal a{color:#6E6E73;text-decoration:none}
@media(max-width:1024px){html .foot--v2 .foot__nav{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){
  html .foot--v2{padding-top:40px}
  html .foot--v2 .foot__top{flex-direction:column;align-items:stretch;padding-bottom:6px}
  html .foot__status{align-items:flex-start;flex-direction:row;gap:14px;flex-wrap:wrap;padding-top:14px}
  html .foot__ctas .pill{flex:1 1 auto;justify-content:center;min-height:48px}
  html .foot--v2 .foot__nav{display:block;padding:8px 0 4px}
  html .fgrp{border-bottom:1px solid var(--line)}
  html .fgrp summary{cursor:pointer;padding:16px 0;min-height:52px}
  html .fgrp h3,html .fgrp h4{margin:0;font-size:13px;letter-spacing:.08em;text-transform:none;color:#1d1d1f;font-weight:800}
  html .fgrp summary i{display:block;width:10px;height:10px;border-right:2px solid #6E6E73;border-bottom:2px solid #6E6E73;transform:rotate(45deg);transition:transform .25s;margin-right:4px}
  html .fgrp[open] summary i{transform:rotate(225deg)}
  html .fgrp__l{padding:0 0 12px}
  html .fgrp__l a,html .fgrp__l span{min-height:44px;display:flex;align-items:center;padding:0;font-size:15px}
  html .fgrp__l--soc{flex-direction:row;flex-wrap:wrap;gap:8px}
  html .fgrp__l--soc a{min-height:40px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:13.5px;font-weight:600}
  html .fgrp--contact{padding:16px 0 6px}
  html .fgrp--contact h3,html .fgrp--contact h4{font-size:13px;letter-spacing:.08em;text-transform:none;color:#1d1d1f;font-weight:800;margin-bottom:6px}
  html .foot--v2 .foot__low{flex-direction:column;align-items:center;text-align:center;gap:10px;margin-top:18px}
}

/* ==== mobile.css ==== */
/* ============================================================================
   RUDQP mobile system (phones only: max-width 680px).
   Everything in this file is inside one media query, so tablet and desktop
   are untouched. It sets the mobile type scale, spacing rhythm, swipe rows
   for galleries and reviews, the floating tab bar, tap states and reveals.
   ========================================================================== */
@media (max-width: 680px) {
  html { --mg: 20px; --msec: 56px; --mr: 22px; --mease: cubic-bezier(.16, 1, .3, 1); }

  /* ---- rhythm ---- */
  html .wrap { padding: 0 var(--mg); }
  html main > section.sec, html .sec { padding: var(--msec) 0; }
  html .brands-sec { padding: 40px 0 36px; }
  html body { padding-bottom: 0; }
  html .foot, html .lfoot { padding: 44px 0 calc(36px + env(safe-area-inset-bottom)); }

  /* ---- type scale ---- */
  html h1.display, html .ah h1, html h1 { font-size: clamp(31px, 8.6vw, 38px); line-height: 1.03; letter-spacing: -.035em; font-weight: 700; max-width: 100%; text-wrap: balance; }
  html h2.display, html h2 { font-size: clamp(26px, 7.2vw, 31px); line-height: 1.06; letter-spacing: -.03em; font-weight: 700; text-wrap: balance; }
  html .dhead, html main h3 { font-size: 19px; line-height: 1.25; letter-spacing: -.015em; font-weight: 700; }
  html .lead, html .cp__sub, html .dsub { font-size: 16px; line-height: 1.55; max-width: 100%; margin-top: 12px; color: #515154; }
  html .eyebrow, html .cp__eyebrow { font-size: 12px; letter-spacing: .1em; text-transform: uppercase; font-weight: 600; color: #6E6E73; }
  html main p { font-size: 16px; line-height: 1.6; }
  html .fine, html .muted, html .gcap .k, html .ltile__ov, html .lq, html small { font-size: 12.5px; letter-spacing: .04em; }
  html .pill { min-height: 48px; padding: 0 22px; font-size: 15px; }
  html .pill.sm { min-height: 44px; }
  html .center .lead, html .ah__copy .lead { margin-left: auto; margin-right: auto; }

  /* ---- tap feedback (no hover on phones) ---- */
  html .pill, html .gtile, html .wtile, html .ltile, html .wcard, html .svc-card, html .lcard, html .lmenu__row { transition: transform .18s var(--mease), opacity .18s; }
  html .pill:active, html .gtile:active, html .ltile:active, html .svc-card:active, html .lcard:active, html .lmenu__row:active { transform: scale(.97); }

  /* ---- swipe rows: home categories, reviews, every photo gallery ---- */
  /* home categories keep the 1 + 2 + 2 mosaic (all five visible at once); polish only */
  html .wgrid { gap: 10px; }
  html .wtile { border-radius: var(--mr); border: 0; }
  html .wtile:first-child { border-radius: var(--mr); }
  html .wcap { padding: 14px; }
  html .wtile:first-child .wcap h3 { font-size: 26px; }
  html .wcap h3 { font-size: 17px; }
  html .gcap h3 { font-size: 24px; }

  html .wall { display: flex; gap: 12px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding: 0 var(--mg); padding: 4px var(--mg) 8px; margin: 0 calc(var(--mg) * -1); scrollbar-width: none; }
  html .wall::-webkit-scrollbar { display: none; }
  html .wall .wcard { flex: 0 0 82vw; max-width: 360px; scroll-snap-align: start; opacity: 1 !important; transform: none !important; border-radius: var(--mr); padding: 22px 22px 20px; }
  html .wcard q { font-size: 17px; line-height: 1.45; }
  html .rvacts { display: flex; gap: 10px; margin-top: 18px; }
  html .rvacts > * { flex: 1 1 0; min-height: 48px; justify-content: center; }

  html .lgal { display: flex; grid-template-columns: none; gap: 10px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding: 0 var(--mg); padding: 4px var(--mg) 8px; margin: 0 calc(var(--mg) * -1); scrollbar-width: none; }
  html .lgal::-webkit-scrollbar { display: none; }
  html .lgal .ltile { flex: 0 0 72vw; max-width: 320px; aspect-ratio: 4 / 5; scroll-snap-align: start; border-radius: var(--mr); }
  html .lgal .ltile.hide { display: none; }
  html .loadmore-wrap { margin-top: 14px; }
  html .loadmore { width: 100%; min-height: 48px; }
  html .chips { display: flex; gap: 8px; overflow-x: auto; padding: 2px var(--mg) 10px; margin: 0 calc(var(--mg) * -1) 8px; scrollbar-width: none; flex-wrap: nowrap; }
  html .chips::-webkit-scrollbar { display: none; }
  html .chip { flex: 0 0 auto; min-height: 40px; padding: 0 16px; }

  /* ---- home sections ---- */
  html .li { gap: 14px; padding-bottom: 22px; }
  html .li__b { width: 40px; height: 40px; font-size: 15px; }
  html .li__t h3 { font-size: 18px; }
  html .li__t p { font-size: 14.5px; }
  html .two-svc { gap: 12px; }
  html .svc-card { padding: 22px 20px 20px; border-radius: var(--mr); }
  html .svc-card h3 { font-size: 22px; }
  html .sysd-svc { gap: 0; margin-top: 22px; }
  html .sysd-svc div { padding: 14px 0; }
  html .sysd-dash { border-radius: var(--mr); }
  html .ah-close { padding: 64px 0 56px; }
  html .ah-close__h { font-size: clamp(38px, 12.4vw, 54px); }
  html .ah-close__ct .pill { width: 100%; max-width: 320px; justify-content: center; }
  html .cp--home { padding: 52px 20px 48px; }
  html .cp__steps li { min-height: 36px; }

  /* ---- pricing builder touch targets ---- */
  html .bqbtn { width: 44px; height: 44px; border-radius: 12px; }
  html .bqitem { padding: 14px 0; gap: 10px; }
  html .bqtipbtn, html .bqtipcustom { min-height: 44px; }

  /* ---- footer ---- */
  html .foot__grid { grid-template-columns: 1fr 1fr; gap: 26px 18px; padding-top: 34px; }
  html .foot__brand { grid-column: 1 / -1; }
  html .foot__wm { font-size: 30px; }
  html .foot__brand h3 { font-size: 16px; margin: 8px 0 14px; }
  html .foot .fcol h4 { font-size: 11px; margin-bottom: 10px; }
  html .foot .fcol a { font-size: 15px; padding: 7px 0; }
  html .foot .fcol p { font-size: 14px; }
  html .foot__bar { gap: 8px; padding-bottom: 20px; }
  html .foot__low { flex-direction: column; gap: 6px; font-size: 12.5px; }
  html .foot__cta { min-height: 48px; }

  /* ---- navigation on phones: the header menu button opens the full-screen menu; no floating bars ---- */
  html .rtop { display: none; }

  /* ---- scroll reveals (JS adds .m-reveal only on phones; nothing hides without it) ---- */
  html .m-reveal { opacity: 0; transform: translateY(18px); transition: opacity .6s var(--mease), transform .8s var(--mease); }
  html .m-reveal.m-in { opacity: 1; transform: none; }

  /* ---- tap targets: every link and control reaches 44px ---- */
  html .lnav .brand { min-height: 44px; display: inline-flex; align-items: center; }
  html .foot .fcol a { padding: 10px 0; min-height: 44px; display: flex; align-items: center; }
  html .foot__legal a, html .foot__low a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 6px; }
  html .flink, html .feat__go, html .morelist a, html .slinks a, html .dc-1 .v a, html .dc-2 .v a, html .cp__foot a, html .faq__q p a { display: inline-flex; align-items: center; min-height: 44px; }
  html .morelist li { padding: 0; }
  html .slinks { gap: 6px 14px; flex-wrap: wrap; }
  html .lmenu__row { min-height: 52px; }
  html .lmenu__small a { min-height: 44px; display: inline-flex; align-items: center; }

  /* ---- readable minimums: no text under 12px on a phone ---- */
  html .prow__meta span, html .prow__meta .cat, html .badge, html .commuter .lbl, html .sysd-live, html .oC-th span, html .fg-rhead span, html .fg-swipe, html .scope-ends span, html .wcap .wk { font-size: 12px; }

  /* ---- page rows that scroll sideways keep their intent, just with the site gutter ---- */
  html .ig-strip { scroll-padding: 0; }

  /* ---- safety: nothing wider than the screen ---- */
  html main img, html main video, html main iframe { max-width: 100%; }
}
@media (max-width: 680px) and (prefers-reduced-motion: reduce) {
  html .m-reveal { opacity: 1; transform: none; transition: none; }
  html .pill, html .gtile, html .ltile, html .svc-card { transition: none; }
}

/* ============================================================================
   One source of truth for the home categories: the same five tiles that show
   on desktop (.g2-desktop) restyle into the 1 + 2 + 2 mosaic on phones and
   tablets, so a change made once shows up on every screen.
   ========================================================================== */
@media (max-width: 1024px) {
  html .g2-desktop { display: grid !important; grid-template-columns: repeat(2, 1fr); gap: 11px; height: auto; }
  html .g2-desktop .gtile { flex: none; min-width: 0; height: auto; aspect-ratio: 1 / 1; border-radius: 15px; border: 0; }
  html .g2-desktop .gtile:first-child { grid-column: 1 / -1; height: auto; aspect-ratio: 5 / 4; }
  html .g2-desktop .gtile:hover { flex: none; }
  html .g2-desktop .gtile img { transition: transform .5s var(--ease); }
  html .g2-desktop .gtile:active { transform: scale(.985); transition: transform .3s var(--ease); }
  html .g2-desktop .gcap { padding: 13px; }
  html .g2-desktop .gcap h3 { writing-mode: horizontal-tb; transform: none; font-size: 18px; margin-top: 4px; }
  html .g2-desktop .gcap .k { font-size: 10px; letter-spacing: .18em; }
  html .g2-desktop .gcap .go { display: none; }
  html .g2-desktop .gtile:first-child .gcap { padding: 17px; }
  html .g2-desktop .gtile:first-child .gcap h3 { font-size: 27px; margin-top: 5px; }
  html .g2-desktop .gtile:first-child .gcap .go { display: inline-block; opacity: .92; transform: none; }
}

/* ---- Photography page: the seven-step map opens the page, kept deliberately small ---- */
.jrsec{padding:clamp(44px,6vw,88px) 0 clamp(36px,5vw,72px);border-bottom:1px solid var(--line)}
.jrsec .jr{margin-top:clamp(18px,2.5vw,36px);max-width:none;margin-left:auto;margin-right:auto}
.jrsec__h{font-family:var(--display);font-weight:600;line-height:1.06;letter-spacing:-.02em;font-size:clamp(30px,4.2vw,54px)}
.jrsec__lead{font-size:clamp(15px,1.3vw,18px);color:var(--muted)}
@media(max-width:680px){
  html .jrsec{padding:26px 0 22px}
  html .jrsec__h{font-size:24px}
  html .jrsec__lead{font-size:14.5px;margin-top:8px}
  html .jrsec .jr{margin-top:10px}
  html .jrsec .li{gap:12px;padding-bottom:16px}
  html .jrsec .li__b{width:34px;height:34px;font-size:13px}
  html .jrsec .li__t h3{font-size:16px}
  html .jrsec .li__t p{font-size:14px}
}

/* ---- Instagram section on phones: the strip carries it, so the dark block ends with it ---- */
@media (max-width: 680px) {
  html .igsec { padding-bottom: 34px; }
  html .igsec .split { gap: 24px; }
  html .igsec .stats { margin-top: 20px; }
  html .igsec .go { margin-top: 20px; }
  html .ig-strip { gap: 8px; padding: 4px 2px 2px; grid-auto-columns: minmax(38%, 1fr); }
  html .ig-strip a { border-radius: 12px; }
}
