@import url('/fonts/fonts.css');

:root {
  color-scheme: light;
  --ink: #262725;
  --ink-soft: #383a37;
  --paper: #f2f0e9;
  --paper-deep: #e8e5dc;
  --white: #faf9f5;
  --orange: #ed6a36;
  --orange-deep: #a43b17;
  --muted: #5c5f59;
  --line: #d4d1c8;
  --font-body: 'DM Sans', sans-serif;
  --font-display: 'Space Grotesk', sans-serif;
  --wrap: 1240px;
  --motion-quick: 180ms;
  --motion-arrival: 420ms;
  --motion-ease: cubic-bezier(.16,1,.3,1);
  --motion-toggle: cubic-bezier(.65,0,.35,1);
  --dock-surface: var(--ink);
  --dock-text: var(--paper);
  --dock-edge: var(--ink-soft);
  --dock-focus: var(--white);
  --dock-active: var(--orange);
  --dock-active-ink: var(--ink);
  --focus-ring: var(--orange-deep);
  --nav-edge: var(--ink-soft);
  --dock-shadow: 0 8px 24px #17181330;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--font-body); font-size: 16px; line-height: 1.6; }
img { display: block; max-width: 100%; }
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
.skip-link { position: absolute; z-index: 20; top: 8px; left: 8px; padding: .7rem 1rem; background: var(--white); color: var(--ink); transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.site-header { position: relative; z-index: 10; color: var(--white); background: var(--ink); }
.header-inner { width: min(calc(100% - 48px), var(--wrap)); min-height: 88px; margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; flex-direction: column; gap: 1px; width: 224px; text-decoration: none; }
.brand img { width: 210px; height: auto; }
.brand-line { align-self: flex-end; color: #f07848; font-size: 10px; letter-spacing: .11em; line-height: 1.2; margin-right: 3px; }
.primary-nav { display: flex; align-items: center; gap: clamp(20px, 3vw, 44px); }
.primary-nav a { text-decoration: none; color: #e6e4df; font-size: 13px; font-weight: 600; transition: color .2s ease; }
.primary-nav a:hover, .primary-nav a[aria-current="page"] { color: #ff8652; }
.primary-nav .nav-contact { padding: 11px 17px; border: 1px solid #777873; color: var(--white); }
.menu-toggle { display: none; border: 1px solid #777873; background: transparent; color: var(--white); width: 46px; height: 44px; cursor: pointer; align-items: center; justify-content: center; }
.menu-toggle span, .menu-toggle span::before, .menu-toggle span::after { display: block; width: 20px; height: 2px; background: currentColor; transition: transform var(--motion-quick) var(--motion-toggle); }
.menu-toggle span { position: relative; }
.menu-toggle span::before, .menu-toggle span::after { content: ''; position: absolute; left: 0; }
.menu-toggle span::before { top: -6px; }
.menu-toggle span::after { top: 6px; }
.menu-toggle[aria-expanded="true"] span { background: transparent; }
.menu-toggle[aria-expanded="true"] span::before { top: -6px; transform: translateY(6px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span::after { top: 6px; transform: translateY(-6px) rotate(-45deg); }
.hero { position: relative; min-height: min(720px, calc(100svh - 88px)); overflow: hidden; display: flex; align-items: end; color: white; background: #4b463f; }
.hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(23,24,23,.69), rgba(23,24,23,.18) 70%), linear-gradient(0deg, rgba(20,21,20,.48), transparent 55%); }
.hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 47%; animation: none; }
.hero-content { position: relative; z-index: 1; width: min(calc(100% - 48px), var(--wrap)); margin: 0 auto; padding: 80px 0 76px; animation: none; }
.eyebrow { display: flex; align-items: center; gap: 11px; margin: 0 0 21px; font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.eyebrow::before { content: ''; width: 28px; height: 2px; background: var(--orange); }
.hero h1 { max-width: 800px; margin: 0; font: 600 clamp(3.3rem, 8vw, 7.4rem)/.96 var(--font-display); letter-spacing: -.065em; }
.hero h1 em { color: #ff8754; font-style: normal; }
.hero-copy { max-width: 515px; margin: 25px 0 31px; color: #e4e1dc; font-size: clamp(1rem, 1.5vw, 1.15rem); }
.button-link { display: inline-flex; align-items: center; justify-content: center; gap: 18px; min-height: 52px; padding: 0 21px; border: 1px solid var(--orange); background: var(--orange); color: #201f1c; text-decoration: none; text-transform: uppercase; font-size: 11px; font-weight: 700; letter-spacing: .1em; transition: background .2s, color .2s, transform .2s; }
.button-link::after { content: '↗'; font-size: 17px; line-height: 1; }
.button-link:hover { background: transparent; color: var(--orange-deep); }
.hero-note { position: absolute; z-index: 2; right: max(24px, calc((100vw - var(--wrap))/2)); bottom: 36px; writing-mode: vertical-rl; color: rgba(255,255,255,.72); font-size: 10px; letter-spacing: .18em; text-transform: uppercase; }
.section-wrap { width: min(calc(100% - 48px), var(--wrap)); margin: 0 auto; }
.intro-section { padding: 116px 0 126px; }
.intro-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(40px, 9vw, 140px); align-items: start; }
.section-kicker { color: var(--orange-deep); font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.intro-section h2, .section-title { margin: 0; font: 600 clamp(2.55rem, 5.2vw, 5.2rem)/1.02 var(--font-display); letter-spacing: -.06em; }
.intro-section h2 span { color: var(--orange-deep); }
.intro-copy { max-width: 700px; padding-top: 5px; }
.intro-copy p { margin: 0 0 18px; color: #555751; font-size: clamp(1.05rem, 1.7vw, 1.35rem); line-height: 1.65; }
.text-link { display: inline-flex; gap: 14px; align-items: center; margin-top: 12px; color: var(--ink); text-decoration: none; font-weight: 700; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.text-link::after { content: '→'; color: var(--orange-deep); font-size: 20px; transition: transform .2s; }

.work-section { padding: 105px 0 116px; background: var(--ink); color: var(--white); }
.work-heading { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 44px; }
.work-heading .section-kicker { color: #f07848; }
.work-heading .section-title { max-width: 590px; margin-top: 12px; }
.work-heading p { max-width: 315px; margin: 0 0 8px; color: #bbbcb6; font-size: 14px; }
.project-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 18px; }
.project { position: relative; margin: 0; overflow: hidden; background: #44443e; }
.project:first-child { grid-row: span 2; min-height: 560px; }
.project:not(:first-child) { min-height: 271px; }
.project img { width: 100%; height: 100%; min-height: inherit; object-fit: cover; transition: transform .7s cubic-bezier(.2,.75,.25,1); }

.project figcaption { position: absolute; right: 0; bottom: 0; left: 0; padding: 58px 24px 21px; color: white; background: linear-gradient(transparent, rgba(15,16,15,.78)); font: 500 20px var(--font-display); }
.project figcaption span { display: block; margin-bottom: 5px; color: #ff8956; font: 700 10px var(--font-body); letter-spacing: .15em; text-transform: uppercase; }
.services-section { padding: 118px 0 122px; }
.services-top { display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; align-items: end; margin-bottom: 64px; }
.services-top .section-kicker { margin: 0 0 18px; }
.services-top p { max-width: 490px; margin: 0; color: var(--muted); font-size: 17px; }
.service-list { border-top: 1px solid var(--line); }
.service-row { display: grid; grid-template-columns: 70px 1fr 1fr 30px; align-items: center; gap: 24px; padding: 24px 5px; border-bottom: 1px solid var(--line); }
.service-number { color: var(--orange-deep); font: 600 14px var(--font-display); }
.service-row h3 { margin: 0; font: 500 clamp(1.3rem, 2.7vw, 2.05rem) var(--font-display); letter-spacing: -.04em; }
.service-row p { max-width: 410px; margin: 0; color: var(--muted); font-size: 14px; }
.service-mark { color: var(--orange-deep); font-size: 23px; }
.statement { padding: 82px 0; background: var(--paper-deep); }
.statement-inner { display: flex; align-items: center; justify-content: space-between; gap: 42px; }
.statement h2 { max-width: 750px; margin: 0; font: 600 clamp(2rem, 4.7vw, 4.4rem)/1.05 var(--font-display); letter-spacing: -.06em; }
.statement h2 span { color: var(--orange-deep); }
.statement .button-link { flex: none; }
.contact-section { padding: 115px 0; color: var(--white); background: var(--orange); }
.contact-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: end; }
.contact-section .section-kicker { color: #482918; }
.contact-section h2 { margin: 17px 0 0; font: 600 clamp(3rem, 7vw, 6.5rem)/.96 var(--font-display); letter-spacing: -.07em; }
.contact-details { border-top: 1px solid rgba(45,32,23,.3); }
.contact-details a { display: flex; justify-content: space-between; align-items: center; padding: 17px 0; border-bottom: 1px solid rgba(45,32,23,.3); color: #2e2823; text-decoration: none; font: 500 clamp(1rem, 2vw, 1.45rem) var(--font-display); }
.contact-details a::after { content: '↗'; font-size: 20px; }
.contact-details a:hover { color: var(--white); }
.site-footer { padding: 32px 0; color: #d0d0ca; background: #20211f; }
.footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.footer-brand { width: 170px; }
.footer-brand img { width: 165px; }
.footer-brand .brand-line { font-size: 8px; }
.footer-small { margin: 10px 0 0; color: #92948e; font-size: 11px; }
.footer-links { display: flex; flex-wrap: wrap; justify-content: end; gap: 24px; }
.footer-links a { color: #d0d0ca; text-decoration: none; font-size: 12px; }
.footer-links a:hover { color: #ff8956; }
.legal-hero { padding: 78px 0 62px; background: var(--paper-deep); border-bottom: 1px solid var(--line); }
.legal-hero .section-kicker { margin: 0 0 15px; }
.legal-hero h1 { margin: 0; font: 600 clamp(3rem, 7vw, 6.4rem)/.98 var(--font-display); letter-spacing: -.07em; }
.legal-hero p { max-width: 670px; margin: 20px 0 0; color: var(--muted); font-size: 17px; }
.draft-alert { margin-top: 30px; padding: 17px 20px; border-left: 4px solid var(--orange); background: #f8e6db; color: #503626; font-size: 14px; }
.draft-alert strong { display: block; margin-bottom: 3px; color: #3c2b21; text-transform: uppercase; font-size: 11px; letter-spacing: .09em; }
.legal-content { width: min(calc(100% - 48px), 850px); margin: auto; padding: 64px 0 105px; }
.legal-content h2 { margin: 45px 0 12px; font: 600 27px/1.15 var(--font-display); letter-spacing: -.035em; }
.legal-content h2:first-child { margin-top: 0; }
.legal-content p, .legal-content li { color: #555751; }
.legal-content ul { padding-left: 22px; }
.legal-content li { padding: 3px 0; }
.legal-content a { color: var(--orange-deep); }
.legal-meta { margin-bottom: 34px; color: var(--muted); font-size: 13px; }
.legal-contact { padding: 22px; margin-top: 34px; background: var(--paper-deep); }



@media (max-width: 760px) {
  .header-inner { width: min(calc(100% - 36px), var(--wrap)); min-height: 74px; }
  .brand { width: 190px; }
  .brand img { width: 180px; }
  .menu-toggle { display: flex; }
  .primary-nav { display: none; position: absolute; top: 100%; right: 0; left: 0; flex-direction: column; align-items: stretch; gap: 0; padding: 8px 18px 20px; background: var(--ink); border-top: 1px solid #484a46; }
  .primary-nav.is-open { display: flex; }
  .primary-nav a { padding: 13px 8px; border-bottom: 1px solid #484a46; }
  .primary-nav .nav-contact { margin-top: 12px; text-align: center; border: 1px solid #777873; }
  .hero { min-height: 670px; min-height: calc(87svh - 74px); }
  .hero-content { width: min(calc(100% - 38px), var(--wrap)); padding: 74px 0 64px; }
  .hero h1 { font-size: clamp(3.25rem, 13vw, 5.5rem); }
  .hero-note { right: 15px; bottom: 24px; font-size: 8px; }
  .section-wrap { width: min(calc(100% - 38px), var(--wrap)); }
  .intro-section, .services-section { padding: 78px 0; }
  .intro-grid, .services-top, .contact-inner { grid-template-columns: 1fr; gap: 28px; }
  .intro-section h2 { font-size: clamp(2.6rem, 10vw, 4rem); }
  .work-section { padding: 78px 0; }
  .work-heading { align-items: start; flex-direction: column; margin-bottom: 30px; }
  .project-grid { grid-template-columns: 1fr; gap: 12px; }
  .project:first-child { grid-row: auto; min-height: 360px; }
  .project:not(:first-child) { min-height: 255px; }
  .project img { min-height: inherit; }
  .services-top { gap: 20px; margin-bottom: 38px; }
  .service-row { grid-template-columns: 34px 1fr 22px; gap: 14px; padding: 21px 0; }
  .service-row p { grid-column: 2 / 3; grid-row: 2; }
  .service-mark { grid-column: 3; grid-row: 1; }
  .statement { padding: 60px 0; }
  .statement-inner { align-items: start; flex-direction: column; gap: 28px; }
  .contact-section { padding: 76px 0; }
  .contact-inner { gap: 38px; }
  .contact-section h2 { font-size: clamp(3.1rem, 13vw, 5rem); }
  .footer-inner { align-items: start; flex-direction: column; }
  .footer-links { justify-content: start; gap: 12px 20px; }
  .legal-hero { padding: 58px 0 42px; }
  .legal-hero .section-wrap { width: min(calc(100% - 38px), var(--wrap)); }
  .legal-content { width: min(calc(100% - 38px), 850px); padding: 44px 0 75px; }
  .legal-content h2 { margin-top: 36px; font-size: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Section typography: mobile first, with separate desktop measures. */
.section-title>span{display:block}
.work-gallery-link{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:38px;padding-top:28px;border-top:1px solid #4a4c45}
.work-gallery-link p{margin:0;color:#bbbcb6;font-size:14px}.desktop-break{display:none}
@media(min-width:761px){
  .hero h1{max-width:940px;font-size:clamp(4rem,6.1vw,5.6rem);line-height:1.03;letter-spacing:-.055em}
  .intro-grid{grid-template-columns:1.1fr 1fr;gap:70px}
  .intro-section h2,.section-title{font-size:clamp(2.4rem,3.8vw,3.6rem);line-height:1.1;letter-spacing:-.045em}
  .work-heading{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(240px,1fr);gap:56px;align-items:end}
  .work-heading .section-title{max-width:none}.work-heading>div{min-width:0}.work-heading>p{max-width:330px;justify-self:end}
  .section-title>span{white-space:nowrap}
  .services-top{grid-template-columns:minmax(0,1.35fr) minmax(240px,1fr);gap:64px}.services-top>p{font-size:16px;max-width:430px}
  .statement h2{font-size:clamp(2rem,3.3vw,3.15rem);line-height:1.15;letter-spacing:-.045em}
  .contact-section{padding:80px 0}.contact-inner{grid-template-columns:1.1fr 1fr;align-items:center;gap:64px}
  .contact-section h2{font-size:clamp(2.3rem,3.7vw,3.5rem);line-height:1.12;letter-spacing:-.045em;max-width:560px}
  .desktop-break{display:initial}.legal-hero h1{font-size:clamp(3rem,5vw,4.5rem)}
}
@media(max-width:760px){.section-title{font-size:clamp(2.1rem,8.7vw,3.3rem);line-height:1.1;letter-spacing:-.045em}.work-heading .section-title{max-width:none}.work-gallery-link{align-items:start;flex-direction:column;gap:18px}.contact-section h2{font-size:clamp(2.45rem,10vw,3.6rem);line-height:1.08;letter-spacing:-.045em;max-width:12ch}}

.footer-legal{margin:26px 0 0;padding-top:22px;border-top:1px solid #41433d;color:#bfc1b8;font-size:12px;line-height:1.9}.footer-legal a{text-underline-offset:3px}.footer-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px 28px;padding-top:22px;margin-top:22px;border-top:1px solid #41433d;color:#a7aaa0;font-size:12px}.footer-credit a{color:#d0d0ca;text-underline-offset:3px}.footer-credit a:hover{color:#ff8956}

/* Shared section bookmarks, About layout and native FAQ accordions. */
main section[id]{scroll-margin-top:24px}main section:target>h2,.legal-content section:target h2{color:var(--orange-deep)}.contact-conduct{grid-column:1/-1;margin:0;font-size:12px;color:#482918}.contact-conduct a{text-underline-offset:3px}.contact-inner:has(.contact-conduct){row-gap:28px}
.about-hero{padding:72px 0 64px;background:var(--paper-deep);border-bottom:1px solid var(--line)}.about-intro{display:grid;grid-template-columns:1.4fr 1fr;gap:70px;align-items:end}.about-intro h1{margin:12px 0 0;font:600 clamp(2.8rem,4.2vw,3.8rem)/1.1 var(--font-display);letter-spacing:-.045em}.about-intro>p{margin:0;max-width:430px;color:var(--muted);font-size:17px}.about-section{padding:76px 0}.about-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:90px}.about-grid h2{margin:14px 0 0;font:500 clamp(2rem,3vw,2.8rem)/1.15 var(--font-display);letter-spacing:-.04em}.about-grid>div>p:first-child{margin-top:0}.about-grid>div>p{color:var(--muted);max-width:620px}.about-services{padding:60px 0;background:var(--ink);color:var(--white)}.about-services .section-kicker{color:#ff8956}.about-service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 54px;margin-top:24px}.about-service-grid article{border-top:1px solid #50524b;padding-top:24px}.about-service-grid h2{font:500 25px var(--font-display);letter-spacing:-.035em;margin:0 0 12px}.about-service-grid p{font-size:14px;color:#bfc1b8;margin:0;max-width:480px}.about-process{list-style:none;counter-reset:process;margin:0;padding:0}.about-process li{position:relative;counter-increment:process;padding:0 0 22px 42px;margin-bottom:22px;border-bottom:1px solid var(--line)}.about-process li::before{content:'0' counter(process);position:absolute;left:0;top:2px;font-size:12px;color:var(--orange-deep)}.about-process strong{font-size:17px;font-weight:600}.about-process p{margin:8px 0 0;font-size:14px;color:var(--muted)}.about-company{padding:64px 0;background:var(--paper-deep)}.about-company dl{margin:0}.about-company dl>div{display:grid;grid-template-columns:135px 1fr;gap:20px;padding:13px 0;border-bottom:1px solid var(--line);font-size:14px}.about-company dt{color:var(--muted)}.about-company dd{margin:0;overflow-wrap:anywhere}.about-address-note{font-size:12px;line-height:1.8}.legal-content section{padding-bottom:10px}.legal-content section>h2{margin-top:32px}
.faq-section{padding:72px 0 80px;background:var(--white);border-top:1px solid var(--line)}.faq-heading{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:32px}.faq-heading h2{margin:12px 0 0;font:500 clamp(1.8rem,2.8vw,2.6rem)/1.15 var(--font-display);letter-spacing:-.04em}.faq-heading>p{margin:0;font-size:13px;color:var(--muted)}.faq-heading a{text-underline-offset:3px}.faq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px;align-items:start}.faq-item{border-top:1px solid var(--line);min-width:0}.faq-item summary{list-style:none;display:flex;align-items:center;gap:14px;min-height:91px;padding:23px 0;cursor:pointer}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary::marker{content:''}.faq-index{font-size:11px;line-height:1.5;color:var(--orange-deep);flex:0 0 22px}.faq-item h3{flex:1;margin:0;font:500 16px/1.5 var(--font-display);letter-spacing:-.025em}.faq-plus{flex:0 0 26px;width:26px;height:26px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;font-size:20px;font-weight:400;line-height:1;transition:transform .2s ease,background .2s ease}.faq-item[open] .faq-plus{transform:rotate(45deg);background:var(--orange);border-color:var(--orange)}.faq-answer{padding:0 30px 24px 36px}.faq-answer p{margin:0;font-size:14px;line-height:1.8;color:var(--muted)}.faq-item summary:focus-visible{outline:2px solid var(--orange-deep);outline-offset:5px}.faq-item:target{border-color:var(--orange-deep)}
@media(max-width:760px){.about-hero{padding:44px 0}.about-intro,.about-grid{grid-template-columns:1fr;gap:24px}.about-intro h1{font-size:clamp(2.3rem,9vw,3.4rem)}.about-intro>p{font-size:15px}.about-section{padding:48px 0}.about-grid h2{font-size:30px}.about-services,.about-company{padding:44px 0}.about-service-grid{grid-template-columns:1fr;gap:26px}.about-company dl>div{grid-template-columns:1fr;gap:5px}.about-process li:last-child{margin-bottom:0}.faq-section{padding:46px 0 54px}.faq-heading{align-items:start;flex-direction:column;gap:16px;margin-bottom:24px}.faq-grid{grid-template-columns:1fr}.faq-item summary{min-height:83px;padding:20px 0;gap:10px}.faq-item h3{font-size:15px}.faq-answer{padding:0 8px 22px 32px}}
@media(prefers-reduced-motion:reduce){.faq-plus{transition:none}}

/* Text-file service pages. */
.service-row{position:relative}.service-row h3 a{color:inherit;text-decoration:none}.service-row h3 a::after{content:'';position:absolute;inset:0}.service-row:hover h3{color:var(--orange-deep)}.service-row:has(a:focus-visible){outline:2px solid var(--orange-deep);outline-offset:5px}.about-service-grid h2 a{text-decoration:none;color:inherit}.about-service-grid h2 a:hover{color:#ff8956}.service-hero{padding:68px 0;background:var(--paper-deep);border-bottom:1px solid var(--line)}.service-hero-grid{display:grid;grid-template-columns:1.3fr 1fr;align-items:end;gap:70px}.service-hero h1{font:600 clamp(2.6rem,4vw,3.6rem)/1.1 var(--font-display);letter-spacing:-.045em;margin:14px 0 0}.service-hero p{margin:0;color:var(--muted);font-size:17px;max-width:470px}.service-content{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(260px,1fr);gap:90px;padding-block:64px 76px;align-items:start}.service-article section{padding-bottom:30px;border-bottom:1px solid var(--line);margin-bottom:30px}.service-article h2{font:500 clamp(1.5rem,2.3vw,2rem)/1.2 var(--font-display);letter-spacing:-.035em;margin:0 0 20px}.service-article p,.service-article li{font-size:15px;color:var(--muted);line-height:1.85}.service-article p:last-child{margin-bottom:0}.service-article ul{padding-left:20px;margin:0}.service-article li{padding:5px 0}.service-enquiry{position:sticky;top:28px;padding:28px;background:var(--paper-deep);border-top:3px solid var(--orange)}.service-enquiry h2{font:500 25px/1.2 var(--font-display);letter-spacing:-.035em;margin:16px 0}.service-enquiry>p{font-size:13px;color:var(--muted);line-height:1.8}.service-enquiry .button-link{margin-top:8px;font-size:11px;padding:13px 16px}.service-phone{display:block;margin:24px 0 18px;font:500 20px var(--font-display);text-decoration:none}.service-enquiry .service-conduct{margin:24px 0 0;font-size:11px}.other-services{background:var(--paper-deep);padding:40px 0}.other-services nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.other-services nav a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;border-top:1px solid var(--line);text-decoration:none;font-size:16px;font-weight:500}.other-services nav span{color:var(--orange-deep)}.other-services nav a:hover{color:var(--orange-deep)}@media(max-width:900px){.service-content{gap:40px}.service-hero-grid{gap:40px}}@media(max-width:760px){.service-hero{padding:44px 0}.service-hero-grid,.service-content{grid-template-columns:1fr;gap:24px}.service-hero h1{font-size:clamp(2.2rem,9vw,3.2rem)}.service-hero p{font-size:15px}.service-content{padding-block:40px}.service-enquiry{position:static}.other-services nav{grid-template-columns:1fr;gap:0}}

/* webdesign: existing photographic portfolio; scope: motion and mobile quick actions.
   Initial viewport and LCP static. One observer. No persistent visitor state.
   Review: hierarchy 4, specificity 4, restraint 5; runtime evidence in checks/. */
html,body{overflow-x:clip}
h1,h2,h3{min-width:0;overflow-wrap:anywhere}
.mobile-dock{display:none}
@media(max-width:760px){
  body{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
  html{scroll-padding-bottom:calc(112px + env(safe-area-inset-bottom,0px))}
  .mobile-dock{position:fixed;z-index:30;left:12px;right:12px;bottom:12px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:6px 6px calc(6px + env(safe-area-inset-bottom,0px));border:1px solid var(--dock-edge);border-radius:12px;background:var(--dock-surface);color:var(--dock-text);box-shadow:var(--dock-shadow)}
  .mobile-dock a{display:flex;min-width:0;min-height:60px;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:8px 0;border-radius:6px;text-decoration:none;font:600 11px/1 var(--font-body);white-space:nowrap;transition:background-color var(--motion-quick) var(--motion-ease),color var(--motion-quick) var(--motion-ease)}
  .mobile-dock svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
  .mobile-dock a[aria-current]{background:var(--dock-active);color:var(--dock-active-ink)}
  .mobile-dock a:active{background:var(--dock-edge);color:var(--dock-text)}
  .mobile-dock a:focus-visible{outline:2px solid var(--dock-focus);outline-offset:-4px;transition:none}
}
@media(prefers-reduced-motion:no-preference){
  html.johnny-motion .motion-item{opacity:0;transform:translateY(8px);transition:opacity var(--motion-arrival) var(--motion-ease),transform var(--motion-arrival) var(--motion-ease)}
  html.johnny-motion .motion-item.motion-ready{opacity:1;transform:none}
  html.johnny-motion .motion-item.motion-ready[data-motion-order="1"]{transition-delay:80ms}
  html.johnny-motion .motion-item.motion-ready[data-motion-order="2"]{transition-delay:160ms}
  html.johnny-motion .motion-item.motion-ready[data-motion-order="3"]{transition-delay:240ms}
  html.johnny-motion .motion-item:focus-within{opacity:1;transform:none;transition:none}
  .primary-nav.is-open{animation:johnny-menu-in var(--motion-quick) var(--motion-ease) both}
  @keyframes johnny-menu-in{from{opacity:.5;transform:translateY(-4px)}to{opacity:1;transform:none}}
  .faq-answer{transition:opacity var(--motion-quick) var(--motion-ease),transform var(--motion-quick) var(--motion-ease)}
  @starting-style{.faq-item[open] .faq-answer{opacity:0;transform:translateY(-4px)}}
}
@media(hover:hover) and (pointer:fine){
  .mobile-dock a:hover{background:var(--dock-edge);color:var(--dock-text)}
  .text-link:hover::after{transform:translateX(3px)}
  .project a:hover{outline:2px solid var(--orange);outline-offset:-2px}
}
@media(prefers-reduced-motion:reduce){
  html.johnny-motion .motion-item{opacity:1;transform:none;transition:none}
  .hero-image,.hero-content,.primary-nav.is-open{animation:none}
  .project img,.gallery-photo img,.button-link:hover,.text-link:hover::after{transform:none}
}
@media print{.mobile-dock{display:none!important}html.johnny-motion .motion-item{opacity:1!important;transform:none!important}body{padding-bottom:0}}

.hero .button-link:hover,.work-section .button-link:hover,.about-services .button-link:hover{color:var(--white)}
.mobile-dock a[aria-current]:focus-visible{outline-color:var(--dock-active-ink)}

/* The section strip is desktop-only; mobile bookmarks live in the main menu. */
.section-links,.mobile-section-menu{display:none}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--focus-ring);outline-offset:4px;transition:none}
.site-header :focus-visible,.site-footer :focus-visible{outline-color:var(--white)}
@media(max-width:760px){
  .primary-nav{max-height:calc(100dvh - 192px);overflow-y:auto;overscroll-behavior:contain}
  .mobile-section-menu{display:block;border-top:1px solid var(--nav-edge);margin-top:12px;padding-top:4px}
  .mobile-section-menu summary{display:flex;align-items:center;justify-content:space-between;gap:16px;list-style:none;min-height:48px;padding:12px 8px;color:var(--paper);font-size:13px;font-weight:600;cursor:pointer}
  .mobile-section-menu summary::-webkit-details-marker{display:none}
  .mobile-section-menu summary::after{content:'';width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-right:4px}
  .mobile-section-menu[open] summary::after{transform:rotate(225deg)}
  .mobile-section-menu>div{padding:0 8px 8px}
  .primary-nav .mobile-section-menu a{display:flex;align-items:center;min-height:44px;padding:12px 8px;font-size:13px;color:var(--paper);font-weight:400}
  .mobile-section-menu a:active{background:var(--ink-soft)}
}

/* Accessibility: dark ink on orange; strong accent text on cream. */
.contact-section{color:var(--ink)}
.contact-section .section-kicker,.contact-conduct{color:var(--ink)}
.contact-details a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.project figcaption{background:var(--ink);padding:18px 24px}
.project figcaption span{color:var(--orange)}

.contact-section :focus-visible{outline-color:var(--ink)}
.hero :focus-visible{outline-color:var(--white)}

.primary-nav>a{display:inline-flex;align-items:center;min-height:44px}.brand{min-height:44px;justify-content:center}

.contact-details a{display:grid;grid-template-columns:24px minmax(0,1fr) 20px;align-items:center;gap:12px;min-height:64px}
.contact-details a>svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.contact-details a>span{min-width:0;white-space:nowrap}
.contact-details a::after{justify-self:end}
@media(max-width:760px){.contact-details a{font-size:clamp(13px,3.6vw,16px)}}


.contact-details .whatsapp-icon{fill:currentColor;stroke:none}

@media(prefers-reduced-motion:no-preference){
  html.johnny-motion .intro-grid>.motion-item,
  html.johnny-motion .work-heading>.motion-item,
  html.johnny-motion .services-top>.motion-item,
  html.johnny-motion .statement-inner>.motion-item{transform:translateY(12px)}
  html.johnny-motion .intro-grid>.motion-ready,
  html.johnny-motion .work-heading>.motion-ready,
  html.johnny-motion .services-top>.motion-ready,
  html.johnny-motion .statement-inner>.motion-ready{transform:none}
}

@media(prefers-reduced-motion:no-preference){
  html.johnny-motion .contact-inner>div:first-child.motion-item{transform:translateY(12px)}
  html.johnny-motion .contact-inner>div:first-child.motion-ready{transform:none}
  html.johnny-motion .contact-details>.motion-item{transform:translateX(8px)}
  html.johnny-motion .contact-details>.motion-ready{transform:none}
  html.johnny-motion .contact-details>.motion-item:focus{opacity:1;transform:none;transition:none}
}