:root{--burgundy:#521b1b;--burgundy-dark:#3c1114;--blush:#fff8f8;--text:#453d3a;--muted:#736b69;--line:#e8d9d7;--serif:'Cormorant Garamond',Georgia,serif;--book:'Libre Baskerville',Georgia,serif;--sans:'DM Sans',Arial,sans-serif;--wrap:1180px}
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fff;color:var(--text);font-family:var(--sans);font-size:15px;line-height:1.7}img{display:block;width:100%;height:100%;object-fit:cover}a{color:inherit;text-decoration:none}button{font:inherit}h1,h2,h3,p,blockquote{margin-top:0}h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.08;color:var(--burgundy)}h2{font-size:clamp(36px,4vw,53px)}h3{font-size:27px}.wrap{width:min(calc(100% - 64px),var(--wrap));margin-inline:auto}.section-pad{padding-block:76px}.eyebrow{font:600 10px/1.5 var(--sans);letter-spacing:.25em;text-transform:uppercase;color:#955252}.centered{text-align:center}.section-heading{margin-bottom:36px}.section-heading h2{margin-bottom:10px}.section-heading>p:last-child{max-width:650px;margin:0 auto}.button{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-height:45px;padding:12px 25px;border:1px solid var(--burgundy);font:600 10px/1.3 var(--sans);letter-spacing:.15em;text-transform:uppercase;transition:background .2s,color .2s,transform .2s}.button:hover{transform:translateY(-2px)}.button-solid{background:var(--burgundy);color:white}.button-solid:hover{background:#712c2c}.button-outline{color:var(--burgundy);background:transparent}.button-outline:hover{background:var(--burgundy);color:#fff}.button-inverse-border{border-color:#e5c2c1}.skip-link{position:absolute;top:-80px;left:20px;z-index:99;padding:12px;background:#fff}.skip-link:focus{top:12px}
/* Shared header */
.site-header{position:relative;z-index:20;background:#fff;border-bottom:1px solid #f2eceb}.header-inner{height:82px;display:flex;align-items:center;gap:28px;justify-content:space-between}.brand{display:flex;align-items:center;gap:11px;flex-shrink:0}.brand-mark{font-family:var(--serif);font-size:42px;line-height:1;color:#b98585;font-weight:400}.brand-type{display:flex;flex-direction:column;align-items:center;gap:2px}.brand-type strong{font:400 22px/1 var(--serif);letter-spacing:.08em;color:#291e1e;white-space:nowrap}.brand-type small{font:600 7px/1.5 var(--sans);letter-spacing:.28em;color:#554646}.desktop-nav{display:flex;align-items:center;gap:21px}.desktop-nav a,.footer-top nav a{font:500 11px/1.4 var(--sans);white-space:nowrap;transition:color .2s}.desktop-nav a:hover,.desktop-nav a[aria-current=page],.footer-top nav a:hover{color:#a75959}.desktop-nav a[aria-current=page]{text-decoration:underline;text-underline-offset:6px}.header-cta{min-height:42px;padding:12px 17px;white-space:nowrap}.menu-toggle{display:none}.mobile-nav[hidden]{display:none}
/* Home hero */
.hero-home{min-height:760px;background-image:linear-gradient(90deg,rgba(17,15,13,.82) 0%,rgba(17,15,13,.66) 38%,rgba(17,15,13,.22) 74%,rgba(17,15,13,.1) 100%),url('../images/home-hero.jpg');background-color:#4f4037;background-position:center center;background-size:cover;background-repeat:no-repeat}.hero-overlay{min-height:inherit;display:flex;align-items:center}.hero-content{color:#fff;padding-block:68px}.hero-content .eyebrow{color:#f7e9e5;margin-bottom:18px}.hero h1{color:#fff;font-size:clamp(49px,6.2vw,88px);line-height:.96;max-width:700px;margin-bottom:25px}.hero h1 em{font-weight:400}.hero-content>p:not(.eyebrow){max-width:320px;font-size:14px;line-height:1.7;margin-bottom:23px}
/* Intro */
.intro-grid{display:grid;grid-template-columns:1fr 1.14fr;gap:clamp(45px,7vw,100px);align-items:center}.intro-copy{max-width:450px}.intro-copy h2{margin-bottom:20px}.intro-copy h2 em{font-weight:400}.intro-copy>p:not(.eyebrow){color:#665d58;max-width:410px}.service-lines{border-left:2px solid #b26d6d;display:flex;flex-direction:column;gap:6px;padding-left:18px;margin:25px 0}.service-lines span{font:600 10px/1.6 var(--sans);text-transform:uppercase;letter-spacing:.15em;color:#9f5b5b}.intro-image{height:440px}.image-frame{background:linear-gradient(135deg,#ead9d1,#f8f2ed 55%,#d6c1b9);overflow:hidden}.image-frame img{transition:transform .5s}.image-frame:hover img{transform:scale(1.025)}.image-frame img.image-unavailable{opacity:0}
/* Process */
.process{padding-top:30px;padding-bottom:76px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}.step{text-align:center;position:relative;padding-inline:10px}.step:not(:last-child)::after{content:'';position:absolute;top:30px;left:calc(50% + 50px);width:calc(100% - 68px);height:1px;background:#d8c4c2}.step-circle{width:64px;height:64px;border:1px solid #d9aaa9;border-radius:50%;display:grid;place-items:center;margin:0 auto 18px;color:var(--burgundy);font:24px var(--serif)}.step h3{font:500 16px var(--serif);letter-spacing:.075em;text-transform:uppercase;margin-bottom:8px}.step p{font-size:13px;color:var(--muted);max-width:200px;margin:0 auto}
/* Packages */
.packages{background:var(--burgundy);color:#fff}.inverse h2,.inverse .eyebrow{color:#fff}.inverse>p:last-child{color:#f0dfdb}.package-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:45px}.package-card{background:#fff;color:var(--text);padding:44px 28px 30px;text-align:center;min-height:280px;position:relative;display:flex;flex-direction:column;align-items:center}.package-card h3{font-size:32px;margin-bottom:9px}.package-price{font:italic 24px var(--serif);color:var(--burgundy);margin-bottom:15px}.package-card>p:not(.package-price){font-size:13px;color:#716865;max-width:230px;flex:1}.package-card .button{width:100%;max-width:250px}.package-ribbon{position:absolute;top:-19px;background:#fff;color:var(--burgundy);padding:7px 14px;text-transform:uppercase;letter-spacing:.15em;font:600 9px var(--sans)}.price-note{font-size:11px;text-align:center;color:#efd8d8;margin:22px 0 0}
/* Testimonial */
.review-wrap{text-align:center}.review-wrap h2{margin-bottom:23px}.review-controls{display:flex;align-items:center;justify-content:space-between;gap:28px}.review-body{max-width:670px}.review-body blockquote{font:italic 29px/1.35 var(--serif);color:#625150;margin:0 auto 18px}.review-credit{text-transform:uppercase;letter-spacing:.18em;font-size:10px;font-weight:600;color:#a06060;margin:0}.review-arrow{width:35px;height:35px;border:1px solid #d4a3a1;border-radius:50%;background:#fff;color:var(--burgundy);font:24px/1 var(--serif);cursor:pointer}.review-arrow:hover{background:var(--blush)}
/* Instagram & CTA */
.instagram{padding-top:26px;padding-bottom:70px}.instagram-top{display:flex;justify-content:space-between;align-items:end;margin-bottom:22px}.instagram-top h2{font-size:38px;margin:0}.small-button{padding:10px 18px;min-height:40px}.instagram-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.instagram-grid .image-frame{aspect-ratio:1/1}.social-note{font-size:11px;color:#857975;margin-top:13px}.closing-banner{background-image:linear-gradient(rgba(30,21,18,.7),rgba(30,21,18,.7)),url('../images/closing-banner-fernside.jpg');background-color:#59463e;background-size:cover;background-position:center}.closing-content{text-align:center;padding-block:70px;color:#fff}.closing-content h2{color:#fff;margin-bottom:5px}.closing-content p{margin-bottom:22px}
/* Shared footer */
.site-footer{background:#fff}.footer-top{display:flex;justify-content:space-between;align-items:center;gap:30px;padding-block:24px}.footer-top nav{display:flex;flex-wrap:wrap;justify-content:center;gap:16px}.footer-contact{font-size:11px;color:var(--burgundy);text-transform:uppercase;letter-spacing:.1em}.footer-bottom{border-top:1px solid var(--line);padding-block:15px;display:flex;justify-content:space-between;gap:20px;color:#897e79;font-size:10px}
@media(max-width:1100px){.desktop-nav{gap:12px}.desktop-nav a{font-size:10px}.header-inner{gap:16px}.header-cta{padding-inline:12px}.brand-type strong{font-size:20px}}
@media(max-width:900px){.desktop-nav,.header-cta{display:none}.menu-toggle{display:flex;width:42px;height:42px;border:1px solid var(--line);background:#fff;flex-direction:column;justify-content:center;align-items:center;gap:5px;cursor:pointer}.menu-toggle span{width:18px;height:1px;background:var(--burgundy)}.mobile-nav:not([hidden]){display:flex;flex-direction:column;gap:0;padding:14px 32px 25px;background:#fff;border-top:1px solid var(--line)}.mobile-nav a{padding:10px;font-size:13px;border-bottom:1px solid #f3eeee}.mobile-enquire{color:var(--burgundy);font-weight:700}.intro-grid{gap:40px}.package-grid{gap:12px}.package-card{padding-inline:18px}}
@media(max-width:650px){.wrap{width:min(calc(100% - 36px),var(--wrap))}.header-inner{height:69px}.section-pad{padding-block:52px}.hero-home{min-height:650px;background-position:60% center}.hero-content{padding-block:55px}.hero h1{font-size:clamp(46px,11vw,64px)}.intro-grid{grid-template-columns:1fr;gap:28px}.intro-copy{max-width:none}.intro-image{height:310px}.steps{grid-template-columns:repeat(2,1fr);row-gap:35px}.step:not(:last-child)::after{display:none}.process{padding-block:35px 55px}.package-grid{grid-template-columns:1fr;gap:26px}.package-card{min-height:240px;padding-block:30px}.reviews .review-body blockquote{font-size:24px}.review-controls{gap:10px}.review-arrow{width:28px;height:28px;flex-shrink:0}.instagram-top{align-items:start;gap:14px}.instagram-top h2{font-size:32px}.instagram-grid{grid-template-columns:repeat(2,1fr);gap:9px}.closing-content{padding-block:55px}.footer-top{flex-direction:column}.footer-bottom{flex-direction:column;text-align:center;align-items:center;gap:6px}.footer-top nav{gap:10px 15px}.social-note{line-height:1.5}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}

/* Live posts use exactly the same grid treatment as the placeholders. */
.instagram-live-feed{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.instagram-live-feed .instagram-post{display:block;aspect-ratio:1/1}
.instagram-live-feed[hidden],.instagram-grid[hidden]{display:none!important}
@media(max-width:650px){.instagram-live-feed{grid-template-columns:repeat(2,1fr);gap:9px}}


/* About page — same shared brand system as homepage */
.about-hero{min-height:360px;background:#594f48 url('../images/about-hero-client-bw.jpg') center 30%/cover no-repeat;position:relative;isolation:isolate}
.about-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(24,17,16,.84),rgba(24,17,16,.48) 51%,rgba(24,17,16,.06));z-index:-1}
.about-hero-inner{min-height:360px;display:flex;align-items:center}
.about-hero-copy{max-width:460px;color:white;padding:50px 0}
.about-hero-copy .eyebrow{color:#f5e5e1}
.about-hero h1{font-size:clamp(58px,6vw,88px);color:white;margin:0 0 6px}
.about-hero-kicker{text-transform:uppercase;letter-spacing:.21em;font-size:12px;font-weight:600;line-height:1.6;max-width:340px}
.about-hero-copy>p:last-child{max-width:350px;font-size:14px;line-height:1.8;margin-bottom:0}
.about-story{background:var(--blush)}
.about-story-grid{display:grid;grid-template-columns:1fr 1.06fr 1fr;gap:clamp(25px,3.8vw,55px);align-items:start}
.about-story h2{font-size:clamp(33px,3.2vw,44px);margin-bottom:19px}
.about-story p:not(.eyebrow){font-size:14px;color:#655b58}
.about-story-copy .button{margin-top:18px}
.about-feature-image{height:470px}
.about-approach-list{display:grid;gap:19px;margin-top:28px}
.about-approach-list div{padding-bottom:15px;border-bottom:1px solid var(--line)}
.about-approach-list strong{display:block;color:var(--burgundy);font:500 22px/1.1 var(--serif)}
.about-approach-list span{font-size:12px;color:var(--muted)}
.about-values{background:#fff}
.about-values .section-heading p:last-child{font-size:14px;color:var(--muted)}
.about-values-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.about-values-grid>div{text-align:center;padding:0 24px;border-right:1px solid var(--line)}
.about-values-grid>div:last-child{border:0}
.about-values-grid span{display:block;color:#bd8683;font:italic 29px var(--serif);margin-bottom:9px}
.about-values-grid h3{font:500 24px var(--serif);margin-bottom:8px}
.about-values-grid p{font-size:12px;color:var(--muted)}
.about-services{background:var(--blush)}
.about-services .section-heading p:last-child{font-size:14px;color:var(--muted)}
.about-service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.about-service-grid .image-frame{height:200px}
.about-service-grid h3{text-align:center;font-size:24px;margin:15px 0 5px}
.about-service-grid p{text-align:center;font-size:12px;color:var(--muted)}
.about-founder{display:grid;grid-template-columns:41% 59%;background:white}
.about-founder-photo{min-height:380px}
.about-founder-text{max-width:650px;padding:clamp(36px,6vw,86px)}
.about-founder h2{font-size:clamp(35px,4vw,53px)}
.about-founder-text p:not(.eyebrow){font-size:14px;color:#655b58;max-width:470px}
.about-founder-text .founder-signature{font:italic 29px var(--serif);color:var(--burgundy);margin-top:30px}
.about-bottom-cta{padding:62px 0;color:white;background:linear-gradient(90deg,rgba(31,14,14,.88),rgba(31,14,14,.58)),url("https://images.unsplash.com/photo-1519225421980-715cb0215aed?auto=format&fit=crop&w=1800&q=80") center/cover}
.about-cta-content{text-align:center}
.about-bottom-cta .eyebrow,.about-bottom-cta h2{color:#fff}
.about-bottom-cta h2{margin-bottom:10px}
.about-bottom-cta p:not(.eyebrow){font-size:14px;margin-bottom:20px}
@media (max-width:960px){.about-story-grid{grid-template-columns:1fr 1fr}.about-approach{grid-column:1/-1}.about-feature-image{height:420px}.about-service-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:650px){.about-hero,.about-hero-inner{min-height:340px}.about-hero h1{font-size:64px}.about-story-grid{grid-template-columns:1fr}.about-feature-image{height:340px}.about-approach{grid-column:auto}.about-values-grid{grid-template-columns:1fr 1fr;row-gap:30px}.about-values-grid>div:nth-child(2){border-right:0}.about-service-grid{gap:14px}.about-service-grid .image-frame{height:150px}.about-founder{grid-template-columns:1fr}.about-founder-photo{min-height:270px;max-height:300px}.about-founder-text{padding:40px 24px}.about-bottom-cta{padding:48px 0}}


/* About page v2: quiet editorial alternating image/text layout */
.hero-about{background-image:linear-gradient(90deg,rgba(17,15,13,.76) 0%,rgba(17,15,13,.45) 38%,rgba(17,15,13,.06) 77%),url("https://images.unsplash.com/photo-1519741497674-611481863552?auto=format&fit=crop&w=2200&q=85")}
.hero-about h1{max-width:580px}
.about-editorial{background:#fff}
.about-editorial-alt{background:var(--blush)}
.about-editorial-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,7vw,105px);align-items:center}
.about-editorial-copy{max-width:480px}
.about-editorial-copy h2{font-size:clamp(48px,5vw,68px);margin:0 0 25px}
.about-editorial-copy p:not(.eyebrow){font-size:15px;color:var(--muted);line-height:1.9;margin-bottom:18px}
.about-editorial-copy .button{margin-top:17px}
.about-editorial-photo{margin:0;height:490px}
.about-simple-cta{text-align:center;background:#fff;padding:66px 0 82px}
.about-simple-cta h2{margin-bottom:25px}
@media(max-width:760px){.about-editorial-grid{grid-template-columns:1fr;gap:30px}.about-editorial-photo{height:350px}.about-editorial-alt .about-editorial-photo{order:2}.about-editorial-alt .about-editorial-copy{order:1}.about-editorial-copy h2{font-size:48px}.hero-about{min-height:650px}}

/* All heroes share the home hero layout, height, typographic scale and spacing. */
.hero-about h1{max-width:700px}
.hero-faq,.hero-services{background-image:linear-gradient(90deg,rgba(17,15,13,.77) 0%,rgba(17,15,13,.58) 38%,rgba(17,15,13,.18) 74%,rgba(17,15,13,.08) 100%),url('../images/services-hero-roberts.jpg');background-position:center 48%;background-size:cover}
/* Contact inherits the home hero height, type scale, alignment and overlay.
   Only the photograph changes. */
.hero-contact{background-image:linear-gradient(90deg,rgba(17,15,13,.82) 0%,rgba(17,15,13,.66) 38%,rgba(17,15,13,.22) 74%,rgba(17,15,13,.1) 100%),url('../images/romantic-couple.jpg')}

.hero-pricing{background-image:linear-gradient(90deg,rgba(17,15,13,.74) 0%,rgba(17,15,13,.53) 35%,rgba(17,15,13,.05) 75%);background-color:#521b1b}

/* Actual Extra Fleur logo in shared header and footer */
.brand-logo { display:block; width:auto; height:55px; max-width:205px; object-fit:contain; object-position:left center; }
.footer-brand .brand-logo { height:54px; }
@media (max-width:650px) { .brand-logo { height:43px; max-width:175px; } .footer-brand .brand-logo {height:43px;} }

/* Wedding calculator */
.pricing-builder{background:#fff}.pricing-intro{display:grid;grid-template-columns:1fr 1fr;gap:45px;align-items:end;margin-bottom:32px}.pricing-intro h2{margin-bottom:0}.pricing-intro>p{margin:0 0 5px;font-size:14px;color:var(--muted);max-width:440px}.pricing-year-row{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-bottom:22px}.pricing-year-row label{font-family:var(--book);color:var(--burgundy);font-size:14px}.pricing-year-row select{padding:10px 39px 10px 15px;color:var(--burgundy);border:1px solid #d9c6c4;background:#fff;font:600 14px var(--sans)}.pricing-year-row p{margin:0;font-size:12px;color:var(--muted)}.pricing-table-wrap{overflow-x:auto}.pricing-table{border-collapse:collapse;width:100%;min-width:670px}.pricing-table th,.pricing-table td{padding:12px 17px;border-bottom:1px solid #e9dfdd;text-align:left;vertical-align:middle}.pricing-table thead th{font:600 10px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#8f5353;border-bottom:1px solid #bfa4a2}.pricing-table tbody th{font:500 20px/1.2 var(--serif);color:var(--burgundy);max-width:480px}.pricing-table .pricing-group th{background:var(--blush);font:600 11px var(--sans);letter-spacing:.17em;text-transform:uppercase;padding-top:13px;padding-bottom:13px}.pricing-table .price-number{font-family:var(--book);font-size:12px;white-space:nowrap}.qty-control{display:flex;align-items:center;width:max-content;border:1px solid #ddd0ce}.qty-control button{background:#fff;color:var(--burgundy);border:0;padding:5px 11px;min-width:35px;min-height:36px;font-size:20px;cursor:pointer}.qty-control button:disabled{opacity:.3;cursor:default}.qty-control span{text-align:center;min-width:35px;font-size:14px}.pricing-caveat{max-width:740px;font-size:12px;color:var(--muted);margin:22px 0 0}.pricing-enquiry{background:var(--blush)}.pricing-enquiry-grid{display:grid;grid-template-columns:0.85fr 1.15fr;gap:27px}.estimate-box,.enquiry-fields{border:1px solid #eadbda;padding:30px;background:#fff}.estimate-box h3{font-size:32px;margin-bottom:4px}.estimate-year{font-size:12px;color:var(--muted)}.estimate-items{min-height:80px;margin:24px 0;color:#736967;font-size:13px}.estimate-item{display:flex;gap:12px;align-items:start;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line)}.estimate-item strong{color:var(--burgundy);white-space:nowrap}.estimate-total-line{display:flex;justify-content:space-between;align-items:center;padding:20px 0;border-top:1px solid #e4c9c7;font-family:var(--serif);color:var(--burgundy);font-size:24px}.estimate-total-line strong{font-size:35px;font-weight:500}.estimate-box>p:last-of-type{font-size:12px;color:var(--muted)}.estimate-reset{margin-top:15px}.enquiry-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.enquiry-form-grid label{display:flex;flex-direction:column;font:500 12px var(--sans);color:#594c49;gap:6px}.enquiry-form-grid span{color:#9d4d4d}.enquiry-form-grid small{font-size:11px;color:var(--muted)}.enquiry-form-grid label.wide{grid-column:1/-1}.enquiry-form-grid input,.enquiry-form-grid textarea{border:1px solid #e3d6d4;padding:12px;font:14px var(--sans);color:var(--text);background:#fff;min-height:44px;border-radius:0;width:100%}.enquiry-form-grid textarea{resize:vertical}.enquiry-send{width:100%;margin-top:22px}.submit-note{font-size:11px;color:var(--muted);margin:13px 0 0}.hero-pricing{background-image:linear-gradient(90deg,#451919,#712c32);background-color:var(--burgundy)}
@media(max-width:760px){.pricing-intro{grid-template-columns:1fr;gap:12px}.pricing-enquiry-grid{grid-template-columns:1fr}.pricing-table th,.pricing-table td{padding:12px 10px}.enquiry-form-grid{grid-template-columns:1fr}.enquiry-form-grid label.wide{grid-column:auto}.estimate-box,.enquiry-fields{padding:23px}}

/* Step 4 — restrained accordion and estimate modal */
.pricing-accordion{border-top:1px solid var(--line)}
.category-section{border-bottom:1px solid var(--line)}
.category-trigger{display:flex;align-items:center;width:100%;text-align:left;background:white;border:0;min-height:90px;padding:18px 23px;cursor:pointer;color:var(--burgundy);gap:20px}
.category-trigger:hover,.category-trigger[aria-expanded=true]{background:var(--blush)}
.category-name{font:500 clamp(25px,3vw,33px)/1.1 var(--serif);flex:1}
.category-count{font:500 12px var(--sans);color:var(--muted)}
.category-indicator{font:30px var(--serif);width:24px;text-align:center}
.category-panel{padding:0 20px 18px;overflow-x:auto}
.category-panel[hidden],.estimate-modal[hidden]{display:none!important}
.pricing-summary-bar{margin-top:34px;padding:27px 33px;background:var(--blush);display:flex;align-items:center;justify-content:space-between;gap:25px}
.pricing-summary-bar>div{display:flex;flex-direction:column}
.pricing-summary-bar strong{font:500 43px/1.05 var(--serif);color:var(--burgundy);margin:5px 0}
.pricing-summary-bar>div>span:last-child{font-size:12px;color:var(--muted)}
.estimate-modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:24px}
.estimate-backdrop{position:absolute;inset:0;background:rgba(30,18,18,.65)}
.estimate-dialog{position:relative;width:min(100%,1050px);max-height:min(92vh,920px);overflow-y:auto;background:#fff;box-shadow:0 20px 80px #150b0b55;padding:30px}
.modal-open{overflow:hidden}.modal-head{display:flex;justify-content:space-between;gap:25px;align-items:start;border-bottom:1px solid var(--line);margin-bottom:24px;padding-bottom:15px}
.modal-head h2{font-size:clamp(33px,4vw,50px);margin:0}
.modal-close{background:transparent;border:0;color:var(--burgundy);font-size:38px;line-height:1;cursor:pointer;padding:0 8px}
.modal-body{display:grid;grid-template-columns:.8fr 1.2fr;gap:18px;align-items:start}
.modal-body .estimate-box,.modal-body .enquiry-fields{padding:22px}
.modal-body .enquiry-fields h3{font-size:30px;margin-bottom:20px}
.modal-body .estimate-items{max-height:260px;overflow:auto}
@media(max-width:750px){.category-trigger{min-height:76px;padding:12px}.category-panel{padding:0 3px 15px}.category-panel .pricing-table{min-width:540px}.pricing-summary-bar{padding:20px;align-items:stretch;flex-direction:column}.pricing-summary-bar .button{width:100%}.estimate-modal{padding:8px}.estimate-dialog{padding:17px;max-height:96vh}.modal-body{grid-template-columns:1fr}.modal-body .estimate-box,.modal-body .enquiry-fields{padding:15px}.modal-head{margin-bottom:12px}}

/* Step 5 — editorial calculator introduction and bespoke year selector */
.pricing-builder.section-pad{padding-top:60px}
.pricing-intro{grid-template-columns:minmax(0,1.05fr) minmax(290px,.8fr);gap:clamp(35px,7vw,105px);align-items:center;margin-bottom:34px}
.pricing-intro h2{font-size:clamp(40px,4.25vw,62px);line-height:1.04;max-width:620px;letter-spacing:-.018em}
.pricing-intro .eyebrow{margin-bottom:14px}
.pricing-intro>p{max-width:370px;font-size:14px;line-height:1.85;margin:14px 0 0}
.pricing-year-row{display:flex;align-items:end;gap:24px;padding:22px 0 30px;margin-bottom:12px;border-bottom:1px solid var(--line)}
.pricing-year-row .year-select-group{display:flex;align-items:center;gap:18px;flex-shrink:0}
.pricing-year-row label{font:500 23px/1.2 var(--serif);color:var(--burgundy);white-space:nowrap}
.year-select-wrap{position:relative;width:142px}
.pricing-year-row .year-select-wrap select{appearance:none;-webkit-appearance:none;width:100%;min-height:52px;padding:11px 45px 11px 18px;border:1px solid #c9aaa6;border-radius:2px;background:var(--blush);font:600 15px/1.3 var(--sans);letter-spacing:.035em;color:var(--burgundy);cursor:pointer;box-shadow:none;transition:border-color .18s,background .18s,box-shadow .18s}
.year-select-wrap svg{position:absolute;right:15px;top:50%;width:18px;height:18px;transform:translateY(-50%);color:var(--burgundy);pointer-events:none}
.pricing-year-row .year-select-wrap select:hover{background:#f9efef;border-color:var(--burgundy)}
.pricing-year-row .year-select-wrap select:focus-visible{outline:2px solid var(--burgundy);outline-offset:3px;box-shadow:0 0 0 4px #fff8f8}
.pricing-year-row>p{font-size:12px;line-height:1.6;margin:0 0 15px;color:var(--muted);max-width:430px}
@media(max-width:800px){.pricing-intro{grid-template-columns:1fr;gap:12px;margin-bottom:24px}.pricing-intro>p{margin:0;max-width:540px}.pricing-year-row{align-items:start;flex-direction:column;gap:12px}.pricing-year-row>p{margin:0}}
@media(max-width:480px){.pricing-builder.section-pad{padding-top:42px}.pricing-intro h2{font-size:43px}.pricing-year-row .year-select-group{width:100%;justify-content:space-between}.year-select-wrap{width:138px}}

/* Fixed carriage charge summary */
.estimate-charge-line{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13px}.estimate-charge-line strong{font-weight:600;color:var(--burgundy)}.carriage-inline-note{display:block;font-size:12px;color:var(--muted);margin-top:2px}

/* Step 10: refined responsive pricing rows. Step 6 visual language preserved. */
.pricing-table{table-layout:fixed;min-width:0}
.pricing-table th:first-child{width:56%}
.pricing-table th:nth-child(2){width:15%}
.pricing-table th:nth-child(3){width:17%}
.pricing-table th:nth-child(4){width:12%}
.pricing-table tbody th{font-size:clamp(19px,1.7vw,24px);line-height:1.26;font-weight:500;overflow-wrap:break-word}
.pricing-table td.price-number{font-size:12px}
.category-panel{overflow:visible}
.pricing-table .qty-control{max-width:100%}
@media(max-width:1100px){
 .pricing-table,.pricing-table tbody{display:block;width:100%;min-width:0}
 .pricing-table thead{display:none}
 .pricing-table tbody tr{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'name name' 'price quantity';align-items:center;gap:8px 16px;padding:18px 2px;border-bottom:1px solid var(--line)}
 .pricing-table tbody tr:last-child{border-bottom:0}
 .pricing-table tbody th,.pricing-table tbody td{display:block;width:auto!important;border:0;padding:0;min-width:0}
 .pricing-table tbody th{grid-area:name;font:500 clamp(19px,2.4vw,24px)/1.2 var(--serif);color:var(--burgundy)}
 .pricing-table tbody td:nth-child(2){grid-area:price;font:400 14px var(--book);color:var(--burgundy)}
 .pricing-table tbody td:nth-child(3){grid-area:quantity;justify-self:end}
 .pricing-table tbody td:nth-child(4){display:none}
 .category-panel{padding:0 17px 14px}
 .qty-control button{min-width:40px;min-height:40px}
 .qty-control span{min-width:30px}
}
@media(max-width:600px){
 .pricing-builder.section-pad{padding-top:38px}
 .pricing-intro h2{font-size:clamp(38px,9vw,50px)}
 .pricing-year-row{padding:12px 0 24px}
 .pricing-year-row .year-select-group{flex-wrap:wrap;justify-content:flex-start;gap:12px}
 .pricing-year-row label{font-size:24px}
 .category-trigger{min-height:72px;padding:12px 8px;gap:10px}
 .category-name{font-size:clamp(25px,7vw,31px)}
 .category-count{font-size:11px;text-align:right}
 .category-panel{padding:0 5px 9px}
 .pricing-table tbody tr{padding:16px 0;gap:11px 12px}
 .pricing-table tbody th{font-size:21px;line-height:1.18}
 .pricing-table tbody td:nth-child(2){font-size:13px}
 .qty-control button{min-width:38px;min-height:40px;padding:5px 8px}
 .pricing-summary-bar{margin-top:23px}
}

/* Step 12: true responsive grid, independent of HTML table sizing. */
.pricing-items{width:100%;min-width:0}
.pricing-item{display:grid;grid-template-columns:minmax(0,1fr) 105px 142px 95px;align-items:center;gap:14px;padding:17px 8px;border-bottom:1px solid var(--line);min-width:0}
.pricing-item:last-child{border-bottom:0}
.pricing-item-name{font:500 clamp(19px,1.8vw,23px)/1.23 var(--serif);color:var(--burgundy);min-width:0;overflow-wrap:anywhere}
.pricing-item-price,.pricing-item-total{font:400 12px/1.5 var(--book);white-space:nowrap;color:var(--burgundy)}
.pricing-item .qty-control{display:flex;width:142px;max-width:100%;justify-self:end}
.pricing-item .qty-control button{width:43px;min-width:0;min-height:40px;flex:1;padding:4px 0}
.pricing-item .qty-control span{width:42px;min-width:0;flex:1;align-self:center;text-align:center}
.category-panel{min-width:0;max-width:100%;overflow:hidden}
@media(max-width:1080px){
 .pricing-item{grid-template-columns:minmax(0,1fr) 142px;grid-template-areas:"name name" "price controls";gap:8px 12px;padding:16px 4px}
 .pricing-item-name{grid-area:name;font-size:clamp(20px,2.3vw,24px)}
 .pricing-item-price{grid-area:price;font-size:13px}
 .pricing-item .qty-control{grid-area:controls}
 .pricing-item-total{display:none}
}
@media(max-width:480px){
 .pricing-item{grid-template-columns:minmax(0,1fr) 124px;gap:10px 8px;padding:15px 2px}
 .pricing-item-name{font-size:21px;line-height:1.2}
 .pricing-item .qty-control{width:124px}
 .pricing-item .qty-control button{min-height:40px}
 .category-panel{padding-left:3px;padding-right:3px}
}

/* Standalone FAQ page. Shared nav, hero and footer retained. */
.faq-section{background:var(--blush)}
.faq-layout{display:grid;grid-template-columns:minmax(230px,.75fr) minmax(0,1.65fr);gap:clamp(35px,8vw,120px);align-items:start}
.faq-introduction{max-width:370px}
.faq-introduction h2{font-size:clamp(35px,4vw,52px);margin-bottom:22px}
.faq-introduction p:not(.eyebrow){color:var(--muted);font-size:14px;line-height:1.85}
.faq-introduction .button{margin-top:15px}
.faq-questions{min-width:0;border-top:1px solid #d9c7c5}
.faq-item{border-bottom:1px solid #d9c7c5}
.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:28px;list-style:none;cursor:pointer;padding:18px 6px;color:var(--burgundy);font:500 clamp(22px,2.4vw,29px)/1.18 var(--serif)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:#8b4141}
.faq-item .faq-sign{flex-shrink:0;position:relative;width:18px;height:18px}
.faq-sign::before,.faq-sign::after{content:"";position:absolute;background:var(--burgundy);top:8px;left:1px;width:16px;height:1.5px}
.faq-sign::after{transform:rotate(90deg);transition:transform .18s}
.faq-item[open] .faq-sign::after{transform:rotate(0)}
.faq-answer{padding:0 46px 19px 6px}
.faq-answer p{margin:0;color:var(--muted);font-size:14px;line-height:1.8}
.faq-cta-section{padding:62px 0;background:#fff}
.faq-cta-inner{display:flex;align-items:center;justify-content:space-between;gap:32px}
.faq-cta-inner h2{margin-bottom:8px}
.faq-cta-inner p:last-child{font-size:14px;color:var(--muted);margin-bottom:0}
@media(max-width:800px){.faq-layout{grid-template-columns:1fr;gap:30px}.faq-introduction{max-width:610px}.faq-cta-inner{align-items:flex-start;flex-direction:column}}
@media(max-width:500px){.faq-item summary{padding:17px 2px;font-size:23px;gap:14px}.faq-answer{padding-right:14px}.faq-section{padding-block:50px}.faq-cta-section{padding-block:44px}}

/* Step 14: larger, simpler shared navigation */
.desktop-nav a{font-size:14px;letter-spacing:.015em}
.footer-top nav a{font-size:13px}
.desktop-nav{gap:clamp(14px,2vw,29px)}
@media (max-width:1100px){.desktop-nav a{font-size:13px}}

/* Shared navigation polish: accessible, understated social icons */
.header-actions{display:flex;align-items:center;gap:19px;flex-shrink:0}
.header-social{display:flex;align-items:center;gap:9px}
.social-link{display:inline-flex;justify-content:center;align-items:center;width:34px;height:34px;color:var(--burgundy);border:1px solid transparent;border-radius:50%;transition:background .2s,color .2s,border-color .2s;flex-shrink:0}
.social-link:hover,.social-link:focus-visible{background:var(--blush);border-color:var(--line);color:#8b4b4b}
.social-link:focus-visible{outline:2px solid var(--burgundy);outline-offset:2px}
.mobile-social{display:none}
@media(max-width:900px){.header-social{gap:4px}.header-actions{gap:10px}}
@media(max-width:760px){.header-social{display:none}.mobile-social{display:flex;gap:10px;padding:15px 8px}.mobile-social .social-link{border-color:var(--line)}.header-actions .header-cta{display:none}}

/* Step 18: visibly taller hero across devices. */
@media (min-width: 651px) and (max-width: 1024px){.hero-home{min-height:700px}}

/* Step 19: Contact page. Uses existing shared three-line hero and typography. */
.contact-section{background:var(--blush)}
.contact-layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(35px,7vw,110px);align-items:start}
.contact-intro{padding-top:25px}.contact-intro h2{font-size:clamp(43px,4.3vw,65px);margin-bottom:22px;max-width:420px}.contact-intro h2 em{font-weight:400}.contact-intro>p:not(.eyebrow){font-size:15px;color:var(--muted);max-width:385px;line-height:1.85}.contact-hairline{height:1px;background:#c89b99;width:72px;margin:33px 0 24px}.contact-intro .contact-small{font-family:var(--serif);font-size:25px!important;font-style:italic;color:var(--burgundy)!important}
.contact-form-panel{padding:clamp(24px,3.7vw,48px);background:#fff;border:1px solid #e9d9d8}.contact-form-panel h3{font-size:clamp(29px,3vw,38px);margin-bottom:28px}.contact-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:17px;row-gap:18px}.form-field{min-width:0}.form-field-full{grid-column:1/-1}.form-field label{display:block;font:600 12px/1.5 var(--sans);letter-spacing:.02em;color:var(--burgundy);margin-bottom:7px}.form-field label>span:not(.optional),.consent-label span span{color:#a14d4d}.form-field label .optional{color:#8b7d79;font-weight:400}.form-field input,.form-field textarea{display:block;width:100%;min-height:49px;background:#fff;color:#453d3a;border:1px solid #ded0ce;border-radius:0;padding:12px 14px;font:14px/1.5 var(--sans);transition:border-color .2s,box-shadow .2s}.form-field textarea{resize:vertical;min-height:130px}.form-field input:focus,.form-field textarea:focus{outline:none;border-color:#8c4c4a;box-shadow:0 0 0 2px #f3e8e6}.form-field input::placeholder,.form-field textarea::placeholder{color:#9a8f8d}.consent-field{margin:20px 0}.consent-label{display:flex;align-items:flex-start;gap:12px;font:12px/1.65 var(--sans);color:#665c59}.consent-label input{width:17px;height:17px;accent-color:#521b1b;flex:none;margin-top:2px}.contact-submit{width:100%;cursor:pointer;font-size:12px;padding-block:16px}.contact-form-note{font-size:11px;line-height:1.65;color:#867a77;margin:12px 0 0}.contact-form-state{font-size:12px;color:#521b1b;margin:0 0 12px}.contact-form-state:empty{display:none}.contact-closing{padding:68px 20px;text-align:center;background:#fff}.contact-closing h2{margin-bottom:9px}.contact-closing p:last-child{margin-bottom:0;font-size:14px;color:var(--muted)}
@media(max-width:900px){.contact-layout{grid-template-columns:1fr;gap:35px}.contact-intro{padding-top:0}.contact-intro>p:not(.eyebrow){max-width:670px}}
@media(max-width:600px){.contact-section{padding-block:48px}.contact-fields{grid-template-columns:1fr}.form-field-full{grid-column:auto}.contact-form-panel{padding:23px 18px}.contact-intro h2{font-size:44px}.contact-closing{padding-block:48px}}

/* Homepage only: keep button appearance, omit decorative arrows. */
.home-page .button > span[aria-hidden="true"]{display:none}

/* Step 22: pricing row layout corrected for long ranges, no clipping */
.pricing-items{width:100%;min-width:0}
.pricing-item{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,220px) 138px;column-gap:22px;row-gap:10px;align-items:center;width:100%;min-width:0;padding:19px 12px;border-bottom:1px solid var(--line)}
.pricing-item-name{min-width:0;font:500 clamp(20px,1.9vw,25px)/1.3 var(--serif);overflow-wrap:normal;word-break:normal}
.pricing-item-price{min-width:0;font:400 12px/1.6 var(--book);white-space:normal;overflow-wrap:normal}
.pricing-item .qty-control{width:138px;min-width:0;max-width:100%;justify-self:end}
.pricing-item-total{display:none}
@media(max-width:1000px){
 .pricing-item{grid-template-columns:minmax(0,1fr) 138px;grid-template-areas:'name name' 'price controls';gap:10px 15px;padding:17px 6px}
 .pricing-item-name{grid-area:name;font-size:clamp(21px,3vw,26px)}
 .pricing-item-price{grid-area:price;font-size:12px;align-self:center;white-space:normal;overflow-wrap:anywhere}
 .pricing-item .qty-control{grid-area:controls;width:138px}
}
@media(max-width:500px){
 .pricing-item{grid-template-columns:minmax(0,1fr) 126px;gap:9px 12px;padding:16px 2px}
 .pricing-item-name{font-size:22px;line-height:1.25}
 .pricing-item .qty-control{width:126px}
 .pricing-item-price{font-size:11px}
}

/* Step 23 — Our Services, editorial page */
.services-intro{max-width:740px;text-align:center}.services-intro h2{margin:0 0 20px}.services-intro>p:last-child{font-size:17px;color:var(--muted);line-height:1.8;margin:0 auto}
.service-editorial{background:#fff}.service-editorial-alt{background:var(--blush)}
.service-editorial-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.07fr);align-items:center;gap:clamp(35px,6vw,90px)}
.service-editorial-copy{max-width:490px}.service-editorial-copy h2{margin-bottom:21px}.service-editorial-copy>p:not(.eyebrow){color:var(--muted);font-size:15px}
.service-editorial-image{height:480px;margin:0}.service-lines-simple{margin-top:28px;border-top:1px solid var(--line)}
.service-lines-simple p{padding:13px 0;margin:0;border-bottom:1px solid var(--line);font-size:14px;color:var(--text);line-height:1.5}
.services-end{background:var(--blush)}.services-end-inner{text-align:center}.services-end-inner>p:not(.eyebrow){color:var(--muted);font-size:15px}.services-end-inner .button{margin-top:14px}
@media(max-width:850px){.service-editorial-grid{gap:30px}.service-editorial-image{height:370px}}
@media(max-width:680px){.service-editorial-grid{grid-template-columns:1fr}.service-editorial-image{height:320px}.service-editorial-alt .service-editorial-image{order:2}.service-editorial-alt .service-editorial-copy{order:1}.services-intro>p:last-child{font-size:15px}}

/* Step 24: single stable header geometry across all pages. */
html{scrollbar-gutter:stable}
@media (min-width:901px){
  .site-header .header-inner{
    display:grid;
    grid-template-columns:minmax(205px,1fr) auto minmax(205px,1fr);
    column-gap:24px;
    align-items:center;
    justify-content:initial;
  }
  .site-header .header-inner>.brand{justify-self:start;min-width:0}
  .site-header .desktop-nav{justify-self:center;justify-content:center;gap:clamp(15px,1.7vw,28px)}
  .site-header .header-actions{justify-self:end}
}
@media (min-width:901px) and (max-width:1100px){
  .site-header .header-inner{grid-template-columns:minmax(155px,1fr) auto minmax(155px,1fr);column-gap:12px}
  .site-header .desktop-nav{gap:12px}
}
@media (max-width:900px){
  .site-header .header-inner{display:flex;align-items:center;justify-content:space-between}
}
/* Buttons no longer include decorative arrows; preserve their shared shape. */

/* Consistent text-only testimonial controls: no arrow glyphs on buttons. */
.review-arrow{width:auto;height:auto;min-width:88px;min-height:39px;padding:9px 14px;border-radius:0;font:600 10px/1.4 var(--sans);text-transform:uppercase;letter-spacing:.12em;background:transparent;color:var(--burgundy);white-space:nowrap;transition:background .2s,color .2s}
.review-arrow:hover{background:var(--burgundy);color:white}
@media(max-width:650px){.review-controls{gap:10px}.review-arrow{min-width:68px;padding:8px;font-size:9px}}

/* Step 26: founder welcome from client brochure */
.about-welcome-line{font:italic 1.65rem/1.35 var(--serif);color:var(--burgundy)!important;margin-top:-4px;margin-bottom:18px}
.about-welcome-signoff{font:italic 1.3rem/1.5 var(--serif);color:var(--burgundy)!important;margin-top:20px}
.about-welcome-signoff span{display:block;font-style:normal;font:500 .88rem var(--sans);letter-spacing:.09em;margin-top:12px}

/* Client revision, shared across all pages */
.footer-details{border-top:1px solid var(--line);display:grid;grid-template-columns:1.25fr .8fr 1.6fr .7fr;gap:30px;padding:29px 0 25px;color:#655b58;font-size:13px}
.footer-details strong{display:block;font:500 23px/1.2 var(--serif);color:var(--burgundy);margin-bottom:10px}
.footer-details address{font-style:normal}.footer-details a{display:block;overflow-wrap:anywhere}.footer-details a:hover{text-decoration:underline;text-underline-offset:3px}
.footer-social-links{display:flex;gap:8px}.footer-social-links a{display:inline-flex}
.founder-portraits{display:grid;grid-template-columns:1fr 1fr;gap:15px;min-height:340px}.founder-portrait{background:#ebe3e1;filter:grayscale(1);display:flex;align-items:end;justify-content:center;min-height:340px}.founder-portrait span{font:italic 25px var(--serif);color:#6f5e5b;padding:20px}.about-founders{margin:0}.about-founders figcaption{text-align:center;color:var(--burgundy);font:italic 26px var(--serif);margin:12px 0}
.funeral-photo-placeholder{height:100%;min-height:365px;background:linear-gradient(140deg,#f2e9e7,#e8d9d7);display:grid;place-items:center;text-align:center;padding:30px;color:#805f5d;font:italic 25px var(--serif)}
@media(max-width:850px){.footer-details{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px}}
@media(max-width:520px){.footer-details{grid-template-columns:1fr;gap:21px}.founder-portraits{gap:8px;min-height:230px}.founder-portrait{min-height:230px}.founder-portrait span{font-size:20px}.funeral-photo-placeholder{min-height:275px}}

/* Step 28: Actual Extra Fleur portrait photography */
.founder-portrait{position:relative;overflow:hidden;display:block;min-width:0;aspect-ratio:3/4;min-height:0;background:#eae3e0;filter:none}
.founder-portrait img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 42%;filter:grayscale(100%);transition:transform .45s ease}
.founder-portrait span{position:absolute;inset:auto 0 0;display:block;text-align:center;color:white;padding:34px 12px 15px;background:linear-gradient(transparent,rgba(24,12,12,.6));text-shadow:0 1px 4px #271414}
@media(max-width:650px){.founder-portraits{min-height:0}.founder-portrait{min-height:0}.founder-portrait span{font-size:19px}}

/* Step 29: larger, uninterrupted black-and-white founder portraits. */
.about-page .about-editorial-grid:has(.about-founders){grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,4vw,64px)}
.about-page .about-founders{width:100%;min-width:0}
.about-page .founder-portraits{gap:12px;min-height:0;grid-template-columns:repeat(2,minmax(0,1fr))}
.about-page .founder-portrait{aspect-ratio:3/4;min-height:0;overflow:hidden}
.about-page .founder-portrait img{object-fit:cover;width:100%;height:100%;filter:grayscale(1)}
@media(max-width:900px){.about-page .about-editorial-grid:has(.about-founders){grid-template-columns:1fr;gap:32px}.about-page .founder-portraits{max-width:760px;margin:auto}}
@media(max-width:480px){.about-page .founder-portraits{gap:9px}}

/* Google review integration */
.google-reviews-meta{font:600 12px/1.6 var(--sans);letter-spacing:.055em;color:var(--burgundy);margin:24px auto 6px;text-align:center}
.google-reviews-link{font:500 12px/1.6 var(--sans);color:#865050;text-decoration:underline;text-underline-offset:4px;display:inline-block}
.google-reviews-link:hover{color:var(--burgundy)}

/* Keep review navigation hidden until genuine review data is available. */
.review-arrow[hidden]{display:none!important}

/* Step 33: hands-free testimonial carousel */
.review-controls{justify-content:center;}
.review-body{margin-inline:auto;transition:opacity .28s ease;outline-offset:8px;}
.review-body.is-changing{opacity:0;}
@media (prefers-reduced-motion:reduce){.review-body{transition:none;}}


/* Step 34: Mobile editorial alignment. Desktop remains untouched. */
@media (max-width: 650px) {
  /* Identical centered hero composition on every page. */
  .hero .hero-content, .hero-content, .hero-overlay .hero-content {
    text-align:center;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
  }
  .hero .hero-content h1, .hero-content h1 {
    width:100%;max-width:100%;text-align:center;
  }
  .hero-content .eyebrow,.hero-content>p:not(.eyebrow){text-align:center;}
  .hero-content>p:not(.eyebrow){max-width:340px;margin-left:auto;margin-right:auto;}
  .hero-content .button{align-self:center;}
  .hero-home { background-position: 56% center; }

  /* Introductory copy and short editorial copy are intentionally centered. */
  .intro-copy, .about-editorial-copy, .service-editorial-copy,
  .faq-introduction, .contact-intro, .services-intro,
  .section-heading, .services-end-inner, .about-simple-cta,
  .about-cta-content, .review-wrap {
    text-align:center;
    margin-left:auto;
    margin-right:auto;
  }
  .intro-copy h2, .about-editorial-copy h2, .service-editorial-copy h2,
  .faq-introduction h2, .contact-intro h2 {
    text-align:center;margin-left:auto;margin-right:auto;
  }
  .intro-copy .button, .about-editorial-copy .button,
  .service-editorial-copy .button, .faq-introduction .button,
  .contact-intro .button {margin-inline:auto;}
  /* Long narrative paragraphs read better flush-left. */
  .about-editorial-copy p:not(.eyebrow),
  .service-editorial-copy>p:not(.eyebrow),
  .contact-intro>p:not(.eyebrow),
  .faq-introduction>p:not(.eyebrow) {text-align:left;}
  .intro-copy>p:not(.eyebrow){text-align:center;}
  .intro-copy .service-lines {text-align:center;border-left:0;padding-left:0;}
  .service-lines-simple {text-align:left;}
  .contact-hairline {margin-left:auto;margin-right:auto;}

  /* Footer and the Instagram section form a centered mobile composition. */
  .instagram-top {flex-direction:column;align-items:center;text-align:center;gap:18px;}
  .instagram-top .button{align-self:center;}
  .footer-top {flex-direction:column;text-align:center;gap:16px;}
  .footer-details {text-align:center;}
  .footer-details .footer-social-links {justify-content:center;}
  .footer-details strong, .footer-details address {text-align:center;}
  .footer-bottom {text-align:center;justify-content:center;gap:10px;flex-wrap:wrap;}

  /* Functional interface elements keep their proven left alignment. */
  .pricing-builder, .pricing-category, .pricing-item, .pricing-item-name,
  .pricing-item-price, .pricing-year-row, .pricing-enquiry,
  .pricing-modal, .faq-questions, .faq-item, .contact-form,
  .contact-form label, .contact-form input, .contact-form textarea {
    text-align:left;
  }
}


/* Step 35: consistent centred editorial text on phones. Functional controls remain readable. */
@media (max-width: 650px) {
  /* About, services, FAQ and contact section introductions. */
  .about-page .about-editorial-copy,
  .services-page .services-intro,
  .services-page .service-editorial-copy,
  .faq-page .faq-introduction,
  .contact-page .contact-intro,
  .faq-page .faq-cta-inner,
  .contact-page .contact-closing {
    text-align: center;
  }
  .about-page .about-editorial-copy p,
  .services-page .services-intro p,
  .services-page .service-editorial-copy p,
  .faq-page .faq-introduction p,
  .contact-page .contact-intro p,
  .faq-page .faq-cta-inner p,
  .contact-page .contact-closing p {
    text-align: center;
  }
  .about-page .about-editorial-copy h2,
  .services-page .services-intro h2,
  .services-page .service-editorial-copy h2,
  .faq-page .faq-introduction h2,
  .contact-page .contact-intro h2,
  .faq-page .faq-cta-inner h2,
  .contact-page .contact-closing h2 {
    text-align: center;
  }
  /* The services are short individual statements and should align with their introduction. */
  .services-page .service-lines-simple,
  .services-page .service-lines-simple p {text-align:center;}
  /* A button should sit beneath its centred copy, not against the left edge. */
  .faq-page .faq-introduction .button,
  .about-page .about-editorial-copy .button,
  .services-page .service-editorial-copy .button {display:table;margin-inline:auto;}
  .faq-page .faq-cta-inner {align-items:center;justify-content:center;gap:18px;}
  /* Form title centres, but labels, inputs and validation stay left aligned. */
  .contact-page .contact-form-panel>.eyebrow,
  .contact-page .contact-form-panel>h3 {text-align:center;}
  .contact-page .contact-fields,
  .contact-page .contact-form-panel form,
  .contact-page .contact-form-panel .form-field,
  .contact-page .contact-form-panel label,
  .contact-page .contact-form-panel input,
  .contact-page .contact-form-panel textarea,
  .contact-page .consent-field,
  .contact-page .contact-form-note,
  .contact-page .contact-form-state {text-align:left;}
  /* FAQ questions and answers are left aligned for comfortable scanning. */
  .faq-page .faq-questions,
  .faq-page .faq-item,
  .faq-page .faq-item summary,
  .faq-page .faq-answer,
  .faq-page .faq-answer p {text-align:left;}
  .contact-page .contact-hairline {margin-inline:auto;}
}

/* Step 36: Pricing page editorial text centred on mobile; calculator remains unchanged. */
@media (max-width:650px) {
  .pricing-builder .pricing-intro {
    display:flex;flex-direction:column;align-items:center;gap:12px;
    text-align:center;margin-bottom:29px;
  }
  .pricing-builder .pricing-intro > div,
  .pricing-builder .pricing-intro h2,
  .pricing-builder .pricing-intro .eyebrow,
  .pricing-builder .pricing-intro > p {
    text-align:center;max-width:100%;margin-inline:auto;
  }
  .pricing-builder .pricing-intro > p {max-width:360px;}
  .pricing-builder .pricing-year-row {justify-content:center;}
  .pricing-builder .pricing-year-row > p {
    flex-basis:100%;text-align:center;max-width:370px;margin-inline:auto;
  }
  .pricing-builder .pricing-caveat {
    text-align:center;margin-left:auto;margin-right:auto;max-width:390px;
  }
  /* Never centre functional controls, pricing lines or modal fields. */
  .pricing-builder .year-select-group,
  .pricing-builder .year-select-group label,
  .pricing-builder .pricing-accordion,
  .pricing-builder .pricing-summary-bar,
  .estimate-dialog, .estimate-dialog form, .estimate-dialog label {text-align:left;}
}

/* Step 37: the shared About hero must be identical in height to Home. */
.hero.hero-home.hero-about{min-height:760px;}
@media (min-width:651px) and (max-width:1024px){.hero.hero-home.hero-about{min-height:700px;}}
@media (max-width:650px){.hero.hero-home.hero-about{min-height:650px;}}

/* Step 38: centre the wedding year selector on mobile, not the calculator. */
@media (max-width:650px) {
  .pricing-builder .pricing-year-row { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px; }
  .pricing-builder .year-select-group { display:flex;flex-direction:column;align-items:center;text-align:center;width:100%;max-width:320px;margin-inline:auto; }
  .pricing-builder .year-select-group label { text-align:center;width:100%; }
  .pricing-builder .year-select-wrap { width:min(100%,280px);margin-inline:auto; }
  .pricing-builder .year-select-wrap select { width:100%; }
  .pricing-builder #year-increase-note { text-align:center;max-width:370px;margin-inline:auto; }
}

/* Step 40: editorial wedding floristry landing page */
.hero-wedding-floristry{background-image:linear-gradient(90deg,rgba(18,14,13,.76),rgba(18,14,13,.48) 45%,rgba(18,14,13,.14)),url('../images/wedding-floristry-hero.jpg');background-position:center 32%;background-size:cover}
.wedding-floristry-page .wf-intro{background:#fff}
.wf-intro-inner,.wf-approach-inner{max-width:780px;text-align:center}
.wf-intro h2,.wf-feature h2,.wf-approach h2{font-size:clamp(38px,4.2vw,58px)}
.wf-intro h2 em,.wf-feature h2 em,.wf-approach h2 em{font-weight:400}
.wf-intro-inner>p:not(.eyebrow),.wf-approach-inner>p:not(.eyebrow){font-size:15px;color:var(--muted);line-height:1.95}
.wf-feature{background:#fff}
.wf-feature-soft,.wf-approach{background:var(--blush)}
.wf-feature-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(42px,7vw,110px);align-items:center}
.wf-feature-grid.wf-reversed{grid-template-columns:1.1fr 1fr}
.wf-feature-copy{max-width:470px}
.wf-feature-copy>p:not(.eyebrow){font-size:15px;color:var(--muted);line-height:1.85}
.wf-feature-photo{height:490px;min-width:0}
.wf-detail-lines{margin:24px 0 30px;border-left:2px solid #bc8d8b;padding-left:21px}
.wf-detail-lines p{margin:8px 0;color:var(--burgundy);font-size:14px}
.wf-approach-inner{margin:auto}
.wf-text-link{display:inline-block;margin-top:16px;border-bottom:1px solid var(--burgundy);color:var(--burgundy);font-size:13px;padding-bottom:4px}
.wf-close{text-align:center;background:var(--burgundy);color:white}
.wf-close .eyebrow,.wf-close h2{color:white}
.wf-close p:not(.eyebrow){margin:0 auto 24px;max-width:570px;color:#f4dfdf}
.wf-close .button{border-color:#f2d5d5}
@media(max-width:820px){.wf-feature-grid,.wf-feature-grid.wf-reversed{grid-template-columns:1fr;gap:28px}.wf-feature-photo{height:380px}.wf-feature-copy{max-width:none}.wf-feature-grid.wf-reversed .wf-feature-photo{order:2}.wf-feature-grid.wf-reversed .wf-feature-copy{order:1}}
@media(max-width:650px){.wf-intro-inner,.wf-feature-copy,.wf-approach-inner{text-align:center}.wf-detail-lines{border-left:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0;margin:20px auto 26px}.wf-detail-lines p{margin:8px 0}.wf-feature-photo{height:300px}.wf-feature-copy .button{margin-inline:auto}.wf-close{padding-block:55px}}

/* Step 42 SEO service pages use the existing shared three-line hero, clean neutral gradient backgrounds pending approved photos. */
.hero-wedding-styling-cheshire{background-image:linear-gradient(90deg,rgba(20,12,12,.68),rgba(20,12,12,.38) 44%,rgba(20,12,12,.12) 100%),url('../images/wedding-styling-dark-ceremony.jpg');--old-gradient:linear-gradient(105deg,rgba(26,11,13,.84),rgba(72,26,29,.65)),linear-gradient(125deg,#443331,#93675b);background-position:center;background-size:cover}
.hero-event-party-styling-cheshire{background-image:linear-gradient(90deg,rgba(20,12,12,.8),rgba(20,12,12,.48) 44%,rgba(20,12,12,.14) 100%),url('../images/berry-table.jpg');--old-gradient:linear-gradient(105deg,rgba(26,11,13,.84),rgba(72,26,29,.65)),linear-gradient(125deg,#443331,#93675b);background-position:center;background-size:cover}
.hero-floral-design-cheshire{background-image:linear-gradient(90deg,rgba(20,12,12,.8),rgba(20,12,12,.48) 44%,rgba(20,12,12,.14) 100%),url('../images/white-roses.jpg');--old-gradient:linear-gradient(105deg,rgba(26,11,13,.84),rgba(72,26,29,.65)),linear-gradient(125deg,#443331,#93675b);background-position:center;background-size:cover}
.hero-funeral-floristry-cheshire{background-image:linear-gradient(90deg,rgba(18,13,13,.78) 0%,rgba(18,13,13,.48) 44%,rgba(18,13,13,.10) 100%),url('../images/funeral-hero-white-coffin.png');background-position:center 50%;background-size:cover}

.seo-service-directory{background:var(--blush);text-align:center}.seo-service-links{display:flex;gap:12px 26px;flex-wrap:wrap;justify-content:center;max-width:850px;margin:25px auto 0}.seo-service-links a{border-bottom:1px solid #b98989;color:var(--burgundy);padding:8px 0;font-size:14px}.seo-service-links a:hover{color:#a75959}@media(max-width:650px){.seo-service-links{flex-direction:column;align-items:center}}

/* Individually selected client portfolio photography for FAQ hero */
.hero-faq{background-image:linear-gradient(90deg,rgba(17,15,13,.8) 0%,rgba(17,15,13,.6) 38%,rgba(17,15,13,.15) 100%),url('../images/couple-tablescape.jpg')}

/* Step 44: genuine client photos in About and Pricing heroes.
   These overrides deliberately follow the older placeholder/gradient rules. */
.hero.hero-about {
  background-image: linear-gradient(90deg,rgba(22,18,16,.66) 0%,rgba(22,18,16,.40) 38%,rgba(22,18,16,.05) 82%),url('../images/about-hero-client-bw.jpg');
  background-size: cover;
  background-position: center 30%;
  background-color: #521b1b;
}
.hero.hero-pricing {
  background-image: linear-gradient(90deg,rgba(17,15,13,.82) 0%,rgba(17,15,13,.58) 39%,rgba(17,15,13,.12) 82%),url('../images/pricing-hero-client.jpg');
  background-size: cover;
  background-position: center 34%;
  background-color: #521b1b;
}
@media(max-width:650px) {
 .hero.hero-about {background-position: 58% center;}
 .hero.hero-pricing {background-position: center 30%;}
}

/* Step 48: genuine Extra Fleur event styling hero and fixed shared header geometry. */
.hero-event-party-styling-cheshire{background-image:linear-gradient(90deg,rgba(20,12,12,.76) 0%,rgba(20,12,12,.48) 43%,rgba(20,12,12,.10) 100%),url('../images/event-milestone-birthdays.png');background-position:center 42%;background-size:cover}
html{overflow-y:scroll;scrollbar-gutter:stable}
@media(min-width:901px){
.site-header .header-inner{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);width:min(calc(100% - 64px),var(--wrap));margin-inline:auto}
.site-header .desktop-nav{justify-self:center;white-space:nowrap}
.site-header .header-actions{justify-self:end}
}

/* Step 54: tidy service-page dropdown, with consistent header geometry. */
.desktop-nav .services-nav-group{position:relative;display:flex;align-items:center;flex:0 0 auto}
.desktop-nav .services-nav-top{display:flex;align-items:center;gap:3px}
.desktop-nav .services-nav-top>a{white-space:nowrap}
.services-nav-toggle{background:transparent;border:0;color:#521b1b;display:inline-flex;align-items:center;justify-content:center;width:28px;height:32px;padding:4px;cursor:pointer;flex:none}
.services-nav-toggle svg{width:15px;height:15px;transition:transform .2s ease}
.services-nav-toggle[aria-expanded="true"] svg{transform:rotate(180deg)}
.services-nav-toggle:focus-visible,.services-submenu a:focus-visible{outline:2px solid #a75959;outline-offset:2px}
.desktop-nav .services-submenu:not([hidden]){display:flex;position:absolute;top:calc(100% + 15px);left:-18px;flex-direction:column;gap:0;min-width:245px;background:#fff;box-shadow:0 14px 35px rgba(40,16,16,.15);border:1px solid #ecdedc;padding:10px 0;z-index:60;white-space:normal}
.desktop-nav .services-submenu a{font:500 13px/1.4 var(--sans);display:block;padding:11px 20px;white-space:nowrap;color:#521b1b;text-decoration:none}
.desktop-nav .services-submenu a:hover,.desktop-nav .services-submenu a[aria-current="page"]{background:#fff8f8;color:#a75959}
.desktop-nav .services-nav-group.service-active .services-nav-top>a{color:#a75959}
.mobile-nav .services-nav-group{display:flex;flex-direction:column;border-bottom:1px solid #f3eeee}
.mobile-nav .services-nav-top{display:flex;align-items:center;justify-content:space-between}
.mobile-nav .services-nav-top>a{flex:1;border:0}
.mobile-nav .services-nav-toggle{width:44px;height:44px}
.mobile-nav .services-submenu:not([hidden]){display:flex;flex-direction:column;background:#fff8f8;padding:4px 0 10px 14px}
.mobile-nav .services-submenu a{font-size:13px;padding:11px 12px;border-bottom:0}
.mobile-nav .services-submenu a[aria-current="page"]{color:#a75959;font-weight:700}
@media(max-width:900px){.desktop-nav .services-nav-group{display:none}}

/* Step 55: mobile submenu polish without affecting desktop navigation. */
@media(max-width:900px){
  .mobile-nav .services-nav-group{min-width:0;width:100%}
  .mobile-nav .services-nav-top>a{min-width:0;display:flex;align-items:center;min-height:48px}
  .mobile-nav .services-nav-toggle{min-width:48px;min-height:48px;border-radius:0}
  .mobile-nav .services-nav-toggle[aria-expanded="true"]{background:#fff8f8}
  .mobile-nav .services-submenu:not([hidden]){width:100%;box-sizing:border-box;padding:6px 0 10px 16px}
  .mobile-nav .services-submenu a{display:block;white-space:normal;overflow-wrap:break-word;font-size:14px;line-height:1.5;min-height:44px;padding:12px 14px;border-bottom:1px solid #f0e5e3}
  .mobile-nav .services-submenu a:last-child{border-bottom:0}
}

/* Step 56: stable shared header and pre-sized hero while the shared JS mounts. */
#site-header{min-height:82px;background:#fff}
#home-hero,#page-hero{min-height:760px;background:#46332f}
@media (min-width:651px) and (max-width:1024px){#home-hero,#page-hero{min-height:700px}}
@media (max-width:650px){#site-header{min-height:69px}#home-hero,#page-hero{min-height:650px}}
/* The navigation never changes its column measurement when text or fonts load. */
@media(min-width:1201px){
 .site-header .header-inner{display:grid;grid-template-columns:215px minmax(0,1fr) 310px;gap:12px;justify-content:initial;width:min(calc(100% - 64px),var(--wrap));margin-inline:auto}
 .site-header .header-inner>.brand{width:215px;justify-self:start}
 .site-header .desktop-nav{justify-self:center;justify-content:center;gap:clamp(12px,1.5vw,23px);width:max-content}
 .site-header .header-actions{width:310px;justify-self:end;justify-content:flex-end;gap:12px}
 .desktop-nav a{font-size:14px}
}
/* At widths where the navigation cannot fit without squeezing, use the mobile menu. */
@media(max-width:1200px){
 .site-header .header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px}
 .site-header .desktop-nav{display:none}
 .site-header .header-cta{display:none}
 .site-header .menu-toggle{display:flex;width:42px;height:42px;border:1px solid var(--line);background:#fff;flex-direction:column;justify-content:center;align-items:center;gap:5px;cursor:pointer;flex-shrink:0}
 .site-header .menu-toggle span{width:18px;height:1px;background:var(--burgundy)}
 .site-header .header-actions{margin-left:auto;gap:8px}
 .mobile-nav:not([hidden]){display:flex;flex-direction:column;padding:14px 32px 25px;background:#fff;border-top:1px solid var(--line)}
 .mobile-nav a{padding:10px;font-size:14px;border-bottom:1px solid #f3eeee}
 .mobile-nav .services-nav-group{min-width:0;width:100%}
 .mobile-nav .services-nav-top>a{display:flex;min-height:48px;align-items:center}
 .mobile-nav .services-nav-toggle{min-width:48px;min-height:48px}
 .mobile-nav .services-submenu:not([hidden]){display:flex;flex-direction:column;width:100%;padding:6px 0 10px 16px;background:var(--blush)}
 .mobile-nav .services-submenu a{white-space:normal;font-size:14px;min-height:44px;padding:12px 14px}
}
@media(max-width:650px){.site-header .header-inner{height:69px}.site-header .header-social{display:none}}


/* Step 58 — final header layout: coordinates never depend on link text or neighbouring widths. */
html { overflow-y: scroll; scrollbar-gutter: stable; overflow-x: clip; }
body { overflow-x: clip; }
#site-header .site-header .header-inner {
  position: relative;
  display: block;
  width: min(calc(100% - 64px), 1180px);
  height: 82px;
  margin: 0 auto;
}
#site-header .site-header .header-inner > .brand {
  position:absolute;left:0;top:50%;transform:translateY(-50%);
  display:flex;width:185px;height:70px;margin:0;
}
#site-header .brand-logo {width:185px;height:70px;max-width:none;object-fit:contain;object-position:left center;}
#site-header .desktop-nav {
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  display:grid;grid-template-columns:72px 72px 170px 80px 65px;
  align-items:center;justify-items:center;
  gap:0;width:459px;min-width:459px;height:52px;margin:0;
}
#site-header .desktop-nav > a {display:flex;justify-content:center;align-items:center;width:100%;height:48px;white-space:nowrap;}
#site-header .desktop-nav > .services-nav-group {width:170px;justify-content:center;}
#site-header .desktop-nav a {font-size:14px;letter-spacing:.015em;}
#site-header .header-actions {
  position:absolute;right:0;top:50%;transform:translateY(-50%);
  display:flex;align-items:center;justify-content:flex-end;
  width:300px;margin:0;gap:12px;
}
#site-header .menu-toggle{display:none;}
@media(max-width:1200px){
  #site-header .site-header .header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;}
  #site-header .site-header .header-inner > .brand{position:static;transform:none;flex:0 0 185px;width:185px;}
  #site-header .desktop-nav{display:none;}
  #site-header .header-actions{position:static;transform:none;margin-left:auto;width:auto;gap:8px;}
  #site-header .header-cta{display:none;}
  #site-header .menu-toggle{display:flex;flex:0 0 42px;}
}
@media(max-width:650px){
  #site-header .site-header .header-inner{width:min(calc(100% - 36px),1180px);height:69px;}
  #site-header .site-header .header-inner > .brand{width:152px;flex-basis:152px;height:55px;}
  #site-header .brand-logo{width:152px;height:55px;}
  #site-header .header-social{display:none;}
}

/* Step 59 — HTML-first shared header. Header is painted before scripts run, not
   inserted later; its desktop geometry cannot depend on page content or fonts. */
html {scroll-behavior:auto; overflow-y:scroll; scrollbar-gutter:stable;}
#site-header {min-height:0;}
#site-header .site-header {height:82px;}
#site-header .desktop-nav {font-synthesis:none;}
#site-header .desktop-nav > a,
#site-header .desktop-nav .services-nav-top > a {transition:color .15s;}
@media(max-width:1200px) {
  #site-header .desktop-nav {display:none;}
}
@media(max-width:650px) {
  #site-header .site-header {height:69px;}
}

/* v61: consistent viewport edge; browser navigation must not animate. */
html{overflow-y:scroll!important;scrollbar-gutter:stable!important;scroll-behavior:auto!important}
body{overflow-x:clip}

/* Funeral portfolio images: preserve a restrained editorial layout. */
.funeral-personal-section{background:#fff}
.funeral-personal-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);align-items:center;gap:clamp(40px,7vw,105px)}
.funeral-personal-image{height:530px;min-width:0}
.funeral-personal-image img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 54%}
.funeral-personal-copy{max-width:470px}
.funeral-personal-copy h2{font-size:clamp(38px,4.2vw,58px)}
.funeral-personal-copy>p:not(.eyebrow){color:var(--muted);font-size:15px;line-height:1.95}
.funeral-personal-copy .button{margin-top:14px}
@media(max-width:820px){.funeral-personal-grid{grid-template-columns:1fr;gap:28px}.funeral-personal-image{height:420px}.funeral-personal-copy{max-width:100%}}
@media(max-width:650px){.funeral-personal-image{height:350px}.funeral-personal-copy{text-align:center}.hero-funeral-floristry-cheshire{background-position:56% center}}

/* Christmas styling page: photography-ready seasonal editorial treatment. */
.hero-christmas-styling{background-image:radial-gradient(ellipse at 77% 35%,rgba(175,122,76,.22),transparent 46%),linear-gradient(105deg,#211c1a 0%,#3c2024 53%,#68453b 100%);background-position:center;background-size:cover}
.christmas-editorial-panel{position:relative;min-height:510px;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(36px,5vw,64px);background:radial-gradient(circle at 82% 18%,rgba(201,164,113,.20),transparent 35%),linear-gradient(145deg,#452126,#281b1e);color:#fff9f2}
.christmas-editorial-panel::before{content:"";position:absolute;inset:18px;border:1px solid rgba(244,225,206,.22);pointer-events:none}
.christmas-panel-mini{font:600 11px/1.7 var(--sans);letter-spacing:.22em;text-transform:uppercase;position:relative}
.christmas-panel-main{font:400 clamp(54px,5vw,83px)/.94 var(--serif);position:relative;letter-spacing:-.015em}
.christmas-panel-main em{font-weight:400}
.christmas-panel-rule{height:1px;width:70px;background:#d1b39a;position:relative}
.christmas-editorial-panel-light{color:#521b1b;background:radial-gradient(circle at 15% 22%,rgba(158,102,71,.09),transparent 40%),linear-gradient(145deg,#f6f0e9,#e9dbd2)}
.christmas-editorial-panel-light::before{border-color:#d7bdb2}
.christmas-editorial-panel-light .christmas-panel-rule{background:#975959}
@media(max-width:850px){.christmas-editorial-panel{min-height:390px}}
@media(max-width:650px){.christmas-editorial-panel{min-height:330px;padding:35px}.christmas-panel-main{font-size:55px}}

/* Step 70: genuine Extra Fleur Christmas portfolio photographs */
.hero.hero-christmas-styling{background-image:linear-gradient(90deg,rgba(24,15,13,.79) 0%,rgba(24,15,13,.59) 40%,rgba(24,15,13,.16) 100%),url('../images/christmas-hero-doorway-2026.jpg');background-position:center 47%;background-size:cover}
.christmas-page .christmas-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 51%}
.christmas-gallery{background:#fff}
.christmas-gallery-intro{text-align:center;max-width:750px;margin:0 auto 40px}
.christmas-gallery-intro h2{margin-bottom:14px}
.christmas-gallery-intro>p:last-child{color:var(--muted);font-size:15px;line-height:1.8}
.christmas-gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.christmas-gallery-grid figure{margin:0;min-width:0}
.christmas-gallery-grid img{display:block;width:100%;height:370px;object-fit:cover;object-position:center}
.christmas-gallery-grid figcaption{font:500 12px/1.5 var(--sans);letter-spacing:.10em;text-transform:uppercase;color:var(--burgundy);padding-top:13px}
@media(max-width:760px){.christmas-gallery-grid{gap:12px}.christmas-gallery-grid img{height:260px}}
@media(max-width:600px){.christmas-gallery-grid{grid-template-columns:1fr 1fr}.christmas-gallery-grid figure:first-child{grid-column:1/-1}.christmas-gallery-grid figure:first-child img{height:340px}.christmas-gallery-grid img{height:230px}.christmas-gallery-intro{margin-bottom:26px}.christmas-page .christmas-photo img{object-position:center 43%}}

/* Step 72: smooth rotating four-tile Instagram portfolio, unchanged gallery geometry. */
.instagram-rotation-item { display:block;overflow:hidden;transition:opacity .35s ease; }
.instagram-rotation-item.instagram-switching {opacity:.25;}
.instagram-rotation-item img {width:100%;height:100%;object-fit:cover;display:block;}
@media(prefers-reduced-motion:reduce){.instagram-rotation-item{transition:none}}

/* Keep the Kind Words section steady as shorter/longer reviews rotate.
   A consistent quote area means the next section never jumps up or down. */
.reviews .review-body{width:100%;}
.reviews .review-body blockquote{
  min-height:6.75em; /* reserve space even for short two-line reviews */
}
@media(max-width:650px){
  .reviews .review-body blockquote{min-height:8.1em;}
}

/* Homepage Kind Words: reserve the carousel itself, preventing cumulative layout shift. */
.reviews .review-controls{min-height:180px;box-sizing:border-box;}
.reviews .review-body{width:100%;min-width:0;}
.reviews .review-body blockquote{box-sizing:border-box;}
@media(max-width:650px){.reviews .review-controls{min-height:220px;}}


/* Estimate dialog: list-only scrolling. The modal itself is not a scroll container. */
.estimate-modal{overflow:hidden}
.estimate-dialog{
  display:flex;flex-direction:column;
  width:min(100%,1050px);
  max-height:calc(100dvh - 40px);
  overflow:hidden;
  overscroll-behavior:contain;
}
.modal-head{flex:0 0 auto}
.modal-body{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:18px;align-items:start;
  min-height:0;
}
.modal-body .estimate-box{display:flex;flex-direction:column;min-width:0;min-height:0;max-height:100%}
.modal-body .estimate-items{
  box-sizing:border-box;
  display:block;
  flex:0 1 auto;
  height:clamp(110px,25dvh,255px);
  min-height:90px;
  max-height:255px;
  margin:14px 0 16px;
  padding:4px 11px 8px 0;
  overflow-y:auto;
  overflow-x:hidden;
  border-top:1px solid #eadbda;
  border-bottom:1px solid #eadbda;
  scrollbar-width:thin;
  scrollbar-color:#936368 #f6eeed;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.modal-body .estimate-items::-webkit-scrollbar{width:6px}
.modal-body .estimate-items::-webkit-scrollbar-track{background:#f6eeed;border-radius:8px}
.modal-body .estimate-items::-webkit-scrollbar-thumb{background:#936368;border-radius:8px}
.modal-body .estimate-items::-webkit-scrollbar-thumb:hover{background:#521b1b}
.modal-body .estimate-item{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:12px;padding:11px 0;line-height:1.5}
.modal-body .estimate-item span{overflow-wrap:anywhere}
.modal-body .estimate-item strong{font-variant-numeric:tabular-nums;white-space:nowrap}
.estimate-scroll-hint{margin:0 0 4px!important;font:500 11px/1.5 var(--sans);color:#895c5f!important}
.modal-body .estimate-charge-line,.modal-body .estimate-total-line{flex-shrink:0}
/* On shorter displays, protect the form from clipping without scrolling the whole overlay. */
@media (max-height:790px) and (min-width:751px){
  .estimate-dialog{padding:18px 24px}
  .modal-head{margin-bottom:12px;padding-bottom:10px}
  .modal-head h2{font-size:36px}
  .modal-body .estimate-box,.modal-body .enquiry-fields{padding:16px}
  .modal-body .estimate-items{height:clamp(95px,19dvh,150px)}
  .modal-body .enquiry-fields h3{font-size:25px;margin-bottom:10px}
  .modal-body .enquiry-form-grid{gap:10px}
  .modal-body .enquiry-form-grid input{min-height:38px;padding:8px}
  .modal-body .enquiry-form-grid textarea{min-height:54px;padding:8px}
  .modal-body .enquiry-send{margin-top:12px}
}
@media(max-width:750px){
  .estimate-modal{padding:8px}
  .estimate-dialog{max-height:calc(100dvh - 16px);padding:17px}
  .modal-body{grid-template-columns:minmax(0,1fr);overflow-y:auto;overscroll-behavior:contain}
  .modal-body .estimate-box{max-height:none;flex-shrink:0}
  .modal-body .estimate-items{height:clamp(135px,24dvh,215px);flex:0 0 auto}
  .modal-body .enquiry-fields{flex-shrink:0}
}
@media(prefers-reduced-motion:reduce){.modal-body .estimate-items{scroll-behavior:auto}}

/* Estimate list arrow controls: buttons operate ONLY the selected-items list. */
.modal-body .estimate-list-frame{position:relative;flex:0 0 auto;min-width:0;margin:14px 0 16px}
.modal-body .estimate-list-frame .estimate-items{width:100%;margin:0;max-height:none;height:clamp(115px,25dvh,255px);padding:4px 57px 8px 0;overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}
.estimate-item-nav{position:absolute;right:5px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:12px;z-index:2}
.estimate-item-nav .estimate-nav-button{display:grid;place-items:center;width:39px;height:39px;padding:0;border:1px solid #a87c7c;border-radius:50%;background:#521b1b;color:white;font:500 22px/1 var(--sans);cursor:pointer;box-shadow:0 2px 8px rgba(82,27,27,.14);transition:background .16s ease,border-color .16s ease,opacity .16s ease}
.estimate-item-nav .estimate-nav-button:hover:not(:disabled),.estimate-item-nav .estimate-nav-button:focus-visible{background:#75343a;border-color:#75343a}
.estimate-item-nav .estimate-nav-button:focus-visible{outline:2px solid #9a5b60;outline-offset:3px}
.estimate-item-nav .estimate-nav-button:disabled{opacity:.28;cursor:default;box-shadow:none}
@media (max-height:790px) and (min-width:751px){.modal-body .estimate-list-frame .estimate-items{height:clamp(100px,19dvh,150px)}.estimate-item-nav{gap:7px}.estimate-item-nav .estimate-nav-button{width:35px;height:35px}}
@media(max-width:750px){.modal-body .estimate-list-frame .estimate-items{height:clamp(140px,24dvh,215px)}}
@media(prefers-reduced-motion:reduce){.modal-body .estimate-list-frame .estimate-items{scroll-behavior:auto}.estimate-item-nav .estimate-nav-button{transition:none}}

/* Visible, persistent controls above the estimate item list — ONLY the items scroll. */
.modal-body .estimate-list-frame{display:flex;flex-direction:column;min-height:0;margin:12px 0 14px;overflow:visible}
.modal-body .estimate-list-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:51px;padding:0 0 10px;border-bottom:1px solid #ebdddc}
.modal-body .estimate-list-toolbar-label{font:600 11px/1.35 var(--sans);letter-spacing:.12em;color:#521b1b}
.modal-body .estimate-list-toolbar .estimate-item-nav{position:static!important;right:auto!important;top:auto!important;transform:none!important;display:flex!important;flex-direction:row!important;gap:8px;z-index:3;flex-shrink:0}
.modal-body .estimate-list-toolbar .estimate-nav-button{display:inline-flex!important;align-items:center;justify-content:center;gap:5px;width:auto!important;height:38px!important;min-width:79px!important;padding:0 10px!important;border:1px solid #521b1b!important;border-radius:5px!important;background:#521b1b!important;color:#fff!important;font:600 12px/1 var(--sans)!important;letter-spacing:.05em;opacity:1!important;visibility:visible!important;box-shadow:none!important}
.modal-body .estimate-list-toolbar .estimate-nav-button span:first-child{font:700 21px/1 var(--sans)}
.modal-body .estimate-list-toolbar .estimate-nav-button:disabled{background:#f3eeee!important;border-color:#cdbabb!important;color:#856c6e!important;opacity:1!important;cursor:default}
.modal-body .estimate-list-frame .estimate-items{height:clamp(135px,26dvh,245px);padding:8px 3px 8px 0!important;overflow-y:auto!important;overscroll-behavior:contain;scroll-behavior:auto;min-height:0}
@media(max-width:750px){.modal-body .estimate-list-frame .estimate-items{height:clamp(145px,24dvh,220px)}.modal-body .estimate-list-toolbar .estimate-nav-button{min-width:72px!important;padding:0 7px!important}}

/* Selected-items list: retain scrolling and arrow-button navigation, but hide the visual scrollbar. */
.modal-body .estimate-list-frame .estimate-items,
.modal-body #estimate-items {
  scrollbar-width: none !important; /* Firefox */
  -ms-overflow-style: none !important; /* Legacy Edge */
}
.modal-body .estimate-list-frame .estimate-items::-webkit-scrollbar,
.modal-body #estimate-items::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  background: transparent !important;
}

/* Mobile estimate dialog — separate, naturally sized panels.
   The selected items scroll independently via UP/DOWN; the enquiry form NEVER
   shares the estimate panel's grid row or overlaps it. */
@media (max-width: 750px) {
  .estimate-modal {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    overflow: hidden;
  }
  .estimate-dialog {
    box-sizing: border-box;
    display: block;
    width: 100%;
    max-width: 100%;
    max-height: calc(100dvh - 16px);
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 18px 14px 22px;
  }
  .estimate-dialog .modal-body {
    display: block;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
  }
  .estimate-dialog .modal-body > .estimate-box,
  .estimate-dialog .modal-body > .enquiry-fields {
    box-sizing: border-box;
    display: block;
    width: 100%;
    min-width: 0;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
    padding: 18px 15px;
    margin: 0;
  }
  .estimate-dialog .modal-body > .enquiry-fields { margin-top: 18px; }
  .estimate-dialog .estimate-list-frame {
    width: 100%;
    margin: 16px 0;
  }
  .estimate-dialog .estimate-list-frame .estimate-items {
    box-sizing: border-box;
    height: 180px;
    max-height: 180px;
    min-height: 0;
    overflow-y: auto !important;
  }
  .estimate-dialog .estimate-list-toolbar { gap: 7px; }
  .estimate-dialog .estimate-list-toolbar-label { letter-spacing: .06em; font-size: 10px; }
  .estimate-dialog .estimate-list-toolbar .estimate-nav-button {
    min-width: 63px !important;
    height: 36px !important;
    padding: 0 6px !important;
    font-size: 11px !important;
  }
  .estimate-dialog .estimate-box h3 { font-size: clamp(27px, 8vw, 34px); }
  .estimate-dialog .enquiry-fields h3 { font-size: clamp(27px, 8vw, 34px); }
  .estimate-dialog .enquiry-form-grid { display: grid; grid-template-columns: minmax(0,1fr); }
  .estimate-dialog .enquiry-form-grid label { min-width: 0; }
  .estimate-dialog .enquiry-form-grid input,
  .estimate-dialog .enquiry-form-grid textarea { box-sizing: border-box; max-width: 100%; }
}
