*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:#0D174D;background:#fff;overflow-x:hidden}img{display:block;max-width:100%}a{color:inherit}.wrap{width:min(1180px,90vw);margin:auto}:root{--navy:#0D174D;--green:#B0BC70;--cream:#F4F3EC;--ink:#101A4C;--muted:#66708A;--line:#D9DDD1}.top{background:var(--navy);color:#fff;position:sticky;top:0;z-index:50;border-bottom:1px solid rgba(255,255,255,.14)}.topin{height:96px;display:flex;align-items:center;gap:32px}.brand{display:flex;align-items:center;text-decoration:none;gap:14px}.brand img{width:126px;height:72px;object-fit:contain}.brand span{display:flex;flex-direction:column}.brand b{color:var(--green);font-size:20px;letter-spacing:.08em}.brand small{font-size:9px;letter-spacing:.14em;margin-top:3px}.nav{margin-left:auto;display:flex;align-items:center;gap:22px}.nav a{text-decoration:none;font-size:12px;font-weight:800}.nav .wa{border:1px solid var(--green);padding:12px 14px;color:var(--green)}.menuBtn{display:none}.hero{height:min(820px,82vh);min-height:620px;position:relative;color:#fff;overflow:hidden}.heroimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}.shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,12,57,.94) 0%,rgba(13,23,77,.72) 46%,rgba(13,23,77,.10) 76%)}.heroCopy{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.eyebrow{font-size:11px;font-weight:900;letter-spacing:.16em;color:var(--green);text-transform:uppercase}.eyebrow.dark{color:var(--navy)}.hero h1,.section h2,.eventCard h2,.venueCopy h2,.reviewSection h2,.finalCopy h2{margin:16px 0 24px;font-size:clamp(52px,6.3vw,92px);line-height:.88;letter-spacing:-.055em}.hero h1{color:#fff;max-width:760px}.heroCopy>p{font-size:20px;line-height:1.55;max-width:630px;color:#eef0f6}.heroActions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px}.btn{display:inline-flex;padding:15px 18px;text-decoration:none;background:var(--green);color:var(--navy);font-size:12px;font-weight:900}.btn.ghost{background:transparent;border:1px solid var(--green);color:#fff}.phone{font-size:18px;font-weight:900;text-decoration:none;margin-left:6px}.heroMeta{margin-top:38px;border-top:1px solid rgba(255,255,255,.25);padding-top:18px;font-size:12px;line-height:1.6;max-width:700px;color:#dbe0ed}.trustbar{background:#fff;border-bottom:1px solid var(--line)}.trustgrid{display:grid;grid-template-columns:repeat(4,1fr)}.trustgrid>div{padding:24px;border-right:1px solid var(--line)}.trustgrid>div:last-child{border-right:0}.trustgrid b{display:block;font-size:13px;margin-bottom:6px}.trustgrid span{font-size:13px;color:var(--muted)}.section{padding:100px 0}.intro{background:#fff}.narrow{max-width:980px;margin-left:max(5vw,calc((100vw - 1180px)/2))}.intro h2 em,.chatty h2 em,.venueCopy h2 em{font-style:normal;color:var(--green)}.bigcopy{font-size:23px!important;line-height:1.55!important;max-width:850px}.intro p,.areas p,.advice p{font-size:18px;line-height:1.65;color:var(--muted);max-width:820px}.servicePhotos{display:grid;grid-template-columns:1fr 1fr}.servicePhoto{position:relative;height:620px;overflow:hidden;text-decoration:none;color:#fff}.servicePhoto img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}.servicePhoto:hover img{transform:scale(1.025)}.servicePhoto:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,13,55,.88),rgba(7,13,55,.05) 58%)}.servicePhoto>div{position:absolute;z-index:2;left:8%;right:8%;bottom:8%}.servicePhoto small{font-size:11px;font-weight:900;letter-spacing:.14em;color:var(--green)}.servicePhoto h3{font-size:44px;margin:10px 0 12px}.servicePhoto p{font-size:17px;line-height:1.55;max-width:500px;color:#eef0f6}.chatty{background:var(--cream)}.twocol{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center}.chatcopy p{font-size:21px;line-height:1.6;color:#4f5873}.eventFeature{min-height:760px;position:relative;background:#09113d;overflow:hidden}.eventFeature>img{width:100%;height:760px;object-fit:cover;opacity:.92}.eventCard{position:absolute;right:5vw;top:50%;transform:translateY(-50%);width:min(560px,46vw);background:rgba(13,23,77,.95);color:#fff;padding:54px}.eventCard h2{color:#fff}.eventCard p{font-size:18px;line-height:1.6;color:#e3e7f0}.eventCard>a{display:inline-block;margin-top:15px;color:var(--green);font-size:12px;font-weight:900;text-decoration:none;border-bottom:1px solid var(--green);padding-bottom:4px}.products{background:#fff}.products h2{font-size:clamp(48px,5vw,74px)}.productrow{display:grid;grid-template-columns:repeat(3,1fr);margin-top:40px;border-top:1px solid var(--line);border-left:1px solid var(--line)}.productrow a{min-height:240px;padding:30px;text-decoration:none;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column}.productrow span{color:var(--green);font-weight:900}.productrow b{font-size:26px;margin:auto 0 12px}.productrow small{font-size:15px;color:var(--muted);line-height:1.45}.venueFeature{display:grid;grid-template-columns:.85fr 1.15fr;min-height:700px;background:var(--cream)}.venueCopy{padding:90px 7vw;align-self:center}.venueCopy p{font-size:19px;line-height:1.6;color:var(--muted)}.venueFeature>img{width:100%;height:100%;min-height:700px;object-fit:cover}.areas{background:#fff}.areaCards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:35px}.areaCards a{padding:28px;background:var(--navy);color:#fff;text-decoration:none;min-height:190px;display:flex;flex-direction:column}.areaCards b{font-size:28px;color:var(--green)}.areaCards span{margin-top:auto;font-size:14px;line-height:1.55;color:#e2e5ef}.smallnote{font-size:14px!important;margin-top:20px!important}.advice{background:var(--cream)}.advicegrid{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center}.advice h2{font-size:clamp(50px,5.5vw,78px)}.textlink{display:inline-block;margin-top:15px;text-decoration:none;font-size:12px;font-weight:900;border-bottom:2px solid var(--green);padding-bottom:5px}.weird{background:var(--green);padding:45px;display:flex;flex-direction:column;gap:0}.weird>b{font-size:12px;letter-spacing:.13em;margin-bottom:20px}.weird span{font-size:32px;font-weight:900;padding:12px 0;border-bottom:1px solid rgba(13,23,77,.25)}.weird strong{margin-top:26px;font-size:18px}.reviewSection{background:var(--navy);color:#fff;padding:100px 0}.reviewgrid{display:grid;grid-template-columns:1fr 1fr;gap:8vw}.reviewSection h2{color:#fff}.reviewgrid p{font-size:20px;line-height:1.6;color:#e1e5ef}.reviewlink{display:inline-block;margin-top:18px;color:var(--green);font-weight:900;font-size:12px;text-decoration:none}.finalPhoto{height:720px;position:relative;overflow:hidden}.finalPhoto>img{width:100%;height:100%;object-fit:cover}.finalPhoto:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,23,77,.92),rgba(13,23,77,.28) 60%,transparent)}.finalCopy{position:absolute;z-index:2;left:5vw;top:50%;transform:translateY(-50%);color:#fff;max-width:650px}.finalCopy small{font-size:11px;letter-spacing:.16em;color:var(--green);font-weight:900}.finalCopy h2{color:#fff}.finalCopy p{font-size:19px;line-height:1.6;color:#e7eaf2}.finalActions{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.finalActions a{background:var(--green);color:var(--navy);padding:14px 17px;text-decoration:none;font-size:12px;font-weight:900}.footer{background:#070d31;color:#fff;padding:55px 0 90px}.footgrid{display:grid;grid-template-columns:1.3fr .8fr .9fr;gap:60px}.footerbrand{display:flex;align-items:center;gap:15px}.footerbrand img{width:130px;height:80px;object-fit:contain}.footerbrand div{display:flex;flex-direction:column}.footerbrand b{color:var(--green);font-size:20px}.footerbrand small{margin-top:5px}.footer a{display:block;color:#fff;text-decoration:none;margin:10px 0;font-size:14px}.stickycontact{display:none}@media(max-width:960px){.nav{display:none}.menuBtn{display:block;margin-left:auto;background:none;border:1px solid rgba(255,255,255,.3);color:#fff;padding:11px 13px;font-weight:900}.brand span{display:none}.nav.open{display:flex;position:absolute;left:0;right:0;top:96px;background:var(--navy);padding:18px 5vw 28px;flex-direction:column;align-items:stretch;gap:0;border-top:1px solid rgba(255,255,255,.15)}.nav.open a{padding:12px 0}.trustgrid{grid-template-columns:1fr 1fr}.servicePhotos,.venueFeature,.twocol,.advicegrid,.reviewgrid{grid-template-columns:1fr}.servicePhoto{height:520px}.eventCard{width:min(620px,86vw);right:7vw}.productrow{grid-template-columns:1fr}.venueFeature>img{min-height:520px}.areaCards{grid-template-columns:1fr}.footgrid{grid-template-columns:1fr 1fr}.footerbrand{grid-column:1/-1}}@media(max-width:620px){body{padding-bottom:54px}.topin{height:88px}.brand img{width:140px;height:76px}.nav.open{top:88px}.hero{height:auto;min-height:760px}.heroimg{object-position:62% center}.shade{background:linear-gradient(0deg,rgba(13,23,77,.98) 0%,rgba(13,23,77,.84) 50%,rgba(13,23,77,.28) 100%)}.heroCopy{justify-content:flex-end;padding-bottom:55px}.hero h1{font-size:58px}.heroCopy>p{font-size:17px}.heroMeta{font-size:10px}.trustgrid{grid-template-columns:1fr}.trustgrid>div{border-right:0;border-bottom:1px solid var(--line)}.section{padding:72px 0}.section h2,.eventCard h2,.venueCopy h2,.reviewSection h2,.finalCopy h2{font-size:50px}.narrow{margin-left:auto}.servicePhoto{height:500px}.servicePhoto h3{font-size:36px}.eventFeature{min-height:700px}.eventFeature>img{height:700px}.eventCard{left:5vw;right:5vw;bottom:30px;top:auto;transform:none;width:auto;padding:32px}.venueCopy{padding:70px 5vw}.venueFeature>img{min-height:440px}.weird{padding:32px}.weird span{font-size:27px}.finalPhoto{height:720px}.finalCopy{left:5vw;right:5vw}.footgrid{grid-template-columns:1fr}.footerbrand{grid-column:auto}.stickycontact{display:grid;grid-template-columns:repeat(3,1fr);position:fixed;left:0;right:0;bottom:0;z-index:80;background:var(--navy);border-top:1px solid rgba(255,255,255,.2)}.stickycontact a{text-align:center;color:#fff;padding:17px 5px;text-decoration:none;font-size:11px;font-weight:900;border-right:1px solid rgba(255,255,255,.15)}.stickycontact a:first-child{color:var(--green)}}
/* V14 brand, WhatsApp recognition & readability */
@import url('https://fonts.googleapis.com/css2?family=Audiowide&display=swap');
.hp-field{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.form-privacy a{text-decoration:underline;font-weight:700}
#privacy{scroll-margin-top:120px}
.brand.brandtype{
display:flex; align-items:center; gap:0; text-decoration:none; min-width:max-content;
}
.brandmoon{
width:62px; height:52px; color:#B0BC70; flex:0 0 auto;
margin-right:-12px; position:relative; z-index:2;
}
.brandname{
font-family:'Audiowide',system-ui,sans-serif;
font-size:clamp(1.55rem,2.2vw,2.25rem);
line-height:1; letter-spacing:.02em; color:#B0BC70;
white-space:nowrap;
}
.walink, a[href^="https://wa.me/"]{
display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
}
.waicon{width:1.35em;height:1.35em;flex:0 0 auto}
.wa.walink .waicon{width:1.5em;height:1.5em}
.stickycontact a[href^="https://wa.me/"] .waicon{width:1.45em;height:1.45em}
/* No whisper-small copy: readable on phone, tablet and desktop */
small, .eyebrow, .kicker, .label, .meta, .trustbar span, footer, footer a,
.sectionintro, .card p, .product p, .areas p {
font-size:max(.94rem, 15px);
}
p, li, summary, input, select, textarea {font-size:max(1rem,16px); line-height:1.62}
small, .meta, .eyebrow, .kicker, .label, footer, footer a {opacity:.9}
.trustbar span, .card p, .product p, .areas p {opacity:.94}
@media(max-width:760px){
.brandmoon{width:49px;height:42px;margin-right:-9px}
.brandname{font-size:1.3rem}
small, .eyebrow, .kicker, .label, .meta, footer, footer a{font-size:15px}
}
/* V15 — one consistent navigation system on every page */
.navgroup{position:relative}
.navdrop{border:0;background:transparent;color:#fff;font:inherit;font-size:12px;font-weight:800;padding:0;cursor:pointer}
.navdrop span{color:var(--green);margin-left:3px}
.dropdown{display:none;position:absolute;top:calc(100% + 18px);left:-18px;min-width:235px;background:#fff;color:var(--navy);padding:10px;border:1px solid var(--line);box-shadow:0 16px 35px rgba(0,0,0,.16)}
.dropdown a{display:block;padding:11px 12px!important;font-size:13px!important;white-space:nowrap}
.dropdown a:hover{background:var(--cream)}
@media(min-width:961px){
.navgroup:hover .dropdown,.navgroup:focus-within .dropdown,.navgroup.open .dropdown{display:block}
}
/* V15 — inner pages: the photo is a real layout column, never hidden under backgrounds */
.subhero{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr);min-height:520px;background:var(--navy);color:#fff;overflow:hidden}
.subheroCopy{display:flex;align-items:center;padding:72px 0}
.subheroCopy .wrap{width:min(590px,84%);margin-right:7%;margin-left:auto}
.subhero .eyebrow{color:var(--green)}
.subhero h1{margin:16px 0 22px;font-size:clamp(48px,5.3vw,78px);line-height:.92;letter-spacing:-.045em;color:#fff}
.subhero p{font-size:19px;line-height:1.62;color:#e7eaf2;max-width:620px}
.subheroMedia{min-width:0;min-height:520px;background:#d9ddd1}
.subheroMedia img{display:block;width:100%;height:100%;min-height:520px;max-height:620px;object-fit:cover;object-position:center}
/* Compatibility for all legacy inner-page content */
.section.white{background:#fff}.section.cream{background:var(--cream)}.section.navy{background:var(--navy);color:#fff}
.split{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:8vw;align-items:start}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:34px}
.tile{border:1px solid var(--line);padding:28px;background:#fff;min-width:0}
.tile h3{font-size:24px;margin:0 0 12px}.tile p,.lead{font-size:18px;line-height:1.65;color:#59627b}
.navy .lead,.navy p{color:#e4e8f1}.navy h2{color:#fff}
.personality{border-left:5px solid var(--green);padding:18px 22px;margin-top:26px;background:rgba(176,188,112,.10)}
.personality b{font-size:19px}.personality p{margin-bottom:0}
.quote{font-size:clamp(28px,3vw,42px)!important;line-height:1.18!important;color:var(--navy)!important;font-weight:800}
.signature{font-size:24px;font-weight:900;color:var(--green);margin-top:24px}
.callout{background:var(--green);color:var(--navy);padding:30px 0}
.callout .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px}
.callout strong{font-size:21px}
.callout .btn{background:var(--navy);color:#fff}
/* Images everywhere: never exceed container, never sit behind text, predictable crop */
main img,.section img,.tile img,.split img{max-width:100%;height:auto}
.contentphoto{width:100%;aspect-ratio:16/9;object-fit:cover;object-position:center;margin:28px 0}
/* Readability on all pages */
.section p,.section li,.callout,.footer{font-size:16px}
.small{font-size:15px!important;line-height:1.6;opacity:.92}
.footerbrandtype{margin-bottom:18px}
.footerbrandtype .brandmoon{width:50px;height:42px}
.footerbrandtype .brandname{font-size:1.45rem}
@media(max-width:960px){
.navgroup{width:100%}
.navdrop{width:100%;text-align:left;padding:12px 0;font-size:14px}
.dropdown{position:static;box-shadow:none;border:0;border-left:2px solid var(--green);background:transparent;color:#fff;padding:0 0 4px 14px;min-width:0}
.navgroup.open .dropdown{display:block}
.dropdown a{color:#fff;padding:9px 0!important;white-space:normal}
.subhero{grid-template-columns:1fr}
.subheroCopy{padding:64px 0}
.subheroCopy .wrap{width:min(90vw,760px);margin:auto}
.subheroMedia,.subheroMedia img{min-height:0;max-height:none}
.subheroMedia img{height:auto;aspect-ratio:16/9;object-fit:cover}
.split,.grid3{grid-template-columns:1fr}
}
@media(max-width:620px){
.subhero h1{font-size:46px}
.subhero p{font-size:17px}
.subheroMedia img{aspect-ratio:4/3}
.callout .wrap{align-items:flex-start;flex-direction:column}
}
/* V16 — faithful Lunar Ice logo artwork */
.brand.brandtype{display:flex;align-items:center;text-decoration:none;overflow:visible}
.brandart{
display:block;
width:clamp(180px,17vw,245px);
height:76px;
object-fit:contain;
object-position:left center;
}
.footerbrandtype .brandart{width:215px;height:82px}
@media(max-width:760px){
.brandart{width:165px;height:62px}
.footerbrandtype .brandart{width:185px;height:72px}
}
/* V16 — enquiry form is a proper, readable panel */
.formgrid{
background:#fff;
border:2px solid #d7dacd;
padding:clamp(26px,4vw,48px);
box-shadow:0 18px 48px rgba(13,23,77,.09);
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:22px 20px;
max-width:760px;
width:100%;
}
.formgrid .field{min-width:0}
.formgrid label{
display:block;
margin-bottom:9px;
font-size:16px!important;
line-height:1.35;
font-weight:800;
color:#0D174D;
}
.formgrid input,.formgrid select,.formgrid textarea{
width:100%;
min-height:52px;
padding:13px 14px;
border:1.5px solid #b9bfaf;
background:#fff;
color:#0D174D;
font:inherit;
font-size:17px!important;
border-radius:0;
}
.formgrid textarea{min-height:140px;resize:vertical}
.formgrid .full,.formgrid .field:has(textarea){grid-column:1/-1}
.formgrid button{
grid-column:1/-1;
min-height:56px;
padding:15px 22px;
border:0;
background:#0D174D;
color:#fff;
font-weight:900;
font-size:16px;
cursor:pointer;
}
.formgrid input:focus,.formgrid select:focus,.formgrid textarea:focus{
outline:3px solid rgba(176,188,112,.45);
outline-offset:1px;
border-color:#0D174D;
}
@media(max-width:760px){
.formgrid{grid-template-columns:1fr;padding:24px 19px;gap:18px}
.formgrid .field,.formgrid .full,.formgrid .field:has(textarea),.formgrid button{grid-column:1}
}
/* V17 — brand/venue credibility section */
.brandproof{padding:105px 0;background:#fff}
.brandproof h2{margin:14px 0 22px;font-size:clamp(48px,5.6vw,82px);line-height:.92;letter-spacing:-.045em}
.brandproof .lead{max-width:840px}
.brandgrid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:12px;
margin-top:38px;
}
.brandnamecard{
min-height:92px;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
padding:18px 16px;
border:1px solid #d9ddd2;
background:#f7f7f2;
color:#0D174D;
font-size:17px;
font-weight:900;
line-height:1.25;
}
.brandnamecard:nth-child(4n+2), .brandnamecard:nth-child(4n+3){background:#eef0e5}
.brandnote{
margin-top:22px;
font-size:14px!important;
line-height:1.55;
color:#6a7185;
max-width:900px;
}
@media(max-width:900px){.brandgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){
.brandproof{padding:78px 0}
.brandgrid{grid-template-columns:1fr 1fr;gap:9px}
.brandnamecard{min-height:78px;font-size:15px;padding:14px 10px}
}
/* V18 social recognition */
.sociallinks{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.sociallinks a{
display:inline-flex!important;align-items:center;gap:8px;
min-height:42px;padding:8px 12px;border:1px solid rgba(255,255,255,.22);
text-decoration:none;
}
.socialicon{width:22px;height:22px;flex:0 0 auto;color:#B0BC70}
@media(max-width:620px){.sociallinks a{min-height:46px}.socialicon{width:24px;height:24px}}
/* V20 — prominent phone and WhatsApp */
.topcontacts{display:flex;align-items:center;gap:9px;margin-left:auto}
.topcontacts a{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:900;white-space:nowrap}
.topphone{color:#fff;font-size:16px;padding:10px 12px;border:1px solid rgba(255,255,255,.28)}
.topwa{background:#B0BC70;color:#0D174D;padding:11px 14px;font-size:14px}
@media(max-width:1100px){.topphone span{font-size:14px}}
@media(max-width:960px){
.topcontacts{margin-left:auto;margin-right:8px}
.topphone{font-size:15px;padding:9px 10px}
.topwa{padding:10px 11px}
}
@media(max-width:650px){
.topcontacts{position:absolute;left:0;right:0;top:100%;display:grid;grid-template-columns:1fr 1fr;gap:0;margin:0;z-index:15}
.topcontacts a{border:0;min-height:48px}
.topphone{background:#fff;color:#0D174D}
.topwa{background:#B0BC70;color:#0D174D}
.top{margin-bottom:48px}
}
/* V20 — contact form: explicit, roomy structure; no overlapping fields */
.contactform{
display:grid!important;
grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
gap:22px!important;
max-width:860px!important;
width:100%!important;
padding:clamp(28px,4vw,52px)!important;
box-sizing:border-box!important;
overflow:visible!important;
}
.contactform *{box-sizing:border-box!important;min-width:0}
.contactform label{display:block!important;width:100%!important;font-size:17px!important;font-weight:850!important;line-height:1.35!important;margin:0!important}
.contactform input,.contactform select,.contactform textarea{
display:block!important;width:100%!important;max-width:100%!important;
margin-top:9px!important;min-height:56px!important;padding:14px 15px!important;
font-size:17px!important;line-height:1.35!important;
}
.contactform textarea{min-height:155px!important}
.contactform label:has(textarea),.contactform .full,.contactform button,.contactform .note,.contactform p{grid-column:1/-1!important}
.contactform button{min-height:58px!important;font-size:17px!important}
@supports not selector(:has(*)){
.contactform{grid-template-columns:1fr!important}
.contactform>*{grid-column:1!important}
}
@media(max-width:760px){
.contactform{grid-template-columns:1fr!important;padding:24px 18px!important;gap:18px!important}
.contactform>*{grid-column:1!important}
}
/* V20 — footer brand uses the same restrained brand treatment as header */
.footerbrandtype{display:inline-flex!important;width:auto!important;background:transparent!important;padding:0!important}
.footerbrandtype .brandart{width:205px!important;height:72px!important;object-fit:contain!important;object-position:left center!important}
.footer .brandart{filter:none!important}
/* Rural imagery: visible, correctly proportioned */
img[src="rural-wedding.jpg"]{object-position:center center!important}
/* =========================================================
V21 VERIFIED STRUCTURE
New stylesheet filename is intentional to defeat old Safari/iPad caching.
========================================================= */
/* Header: phone is now a primary action, not a tiny afterthought */
.topin{height:auto;min-height:104px;gap:22px}
.topcontacts{display:flex;align-items:center;gap:10px;margin-left:auto}
.topcontacts a{display:inline-flex;align-items:center;justify-content:center;gap:9px;text-decoration:none;font-weight:900;white-space:nowrap}
.header-icon{width:23px;height:23px;flex:0 0 auto}
.topphone{
min-height:52px;
padding:12px 16px;
border:2px solid rgba(255,255,255,.52);
color:#fff;
font-size:22px;
letter-spacing:.01em;
}
.topwa{
min-height:52px;
padding:12px 17px;
background:#B0BC70;
color:#0D174D;
font-size:16px;
}
.nav{margin-left:0}
@media(max-width:1180px){
.topphone{font-size:19px;padding:11px 13px}
.topwa{font-size:14px;padding:11px 13px}
.nav{gap:15px}
}
@media(max-width:960px){
.topin{min-height:92px}
.topcontacts{margin-left:auto;margin-right:8px}
.topphone{font-size:18px}
}
@media(max-width:650px){
.top{margin-bottom:56px}
.topin{min-height:88px}
.topcontacts{
position:absolute;left:0;right:0;top:100%;
display:grid;grid-template-columns:1fr 1fr;gap:0;margin:0;
}
.topcontacts a{min-height:56px;border:0}
.topphone{background:#fff;color:#0D174D;font-size:18px}
.topwa{background:#B0BC70;color:#0D174D;font-size:16px}
}
/* Contact page gets its own structure */
.contact-layout{
display:grid;
grid-template-columns:minmax(290px,.72fr) minmax(0,1.28fr);
gap:64px;
align-items:start;
}
.contact-details{position:sticky;top:145px}
.contact-details h2{font-size:clamp(42px,4.3vw,66px)}
.contact-actions{display:grid;gap:10px;margin:28px 0 16px}
.contact-actions a{
display:flex;align-items:center;gap:12px;
width:100%;min-height:64px;padding:15px 18px;
text-decoration:none;font-weight:900;
}
.contact-call{background:#0D174D;color:#fff;font-size:25px}
.contact-whatsapp{background:#B0BC70;color:#0D174D;font-size:20px}
.contact-email{font-size:18px;font-weight:800}
.contact-email a{text-decoration-thickness:2px;text-underline-offset:4px}
.contactform{
display:block!important;
width:100%!important;
max-width:none!important;
padding:40px!important;
border:2px solid #D7DACD!important;
background:#fff!important;
box-shadow:0 18px 48px rgba(13,23,77,.09)!important;
overflow:visible!important;
}
.contactform .form-intro{
padding-bottom:26px;margin-bottom:28px;border-bottom:1px solid #D9DDD1;
}
.contactform .form-intro h3{font-size:32px;margin:9px 0 8px}
.contactform .form-intro p{font-size:16px;line-height:1.6;color:#59627b;max-width:620px}
.contactform .form-row{
display:grid!important;
grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
gap:20px!important;
margin-bottom:20px!important;
}
.contactform .field{display:block!important;min-width:0!important;width:100%!important}
.contactform label{
display:block!important;margin:0 0 9px!important;
font-size:16px!important;line-height:1.35!important;font-weight:850!important;
}
.contactform input,.contactform select,.contactform textarea{
display:block!important;
width:100%!important;max-width:100%!important;
min-height:56px!important;margin:0!important;
padding:14px 15px!important;
border:1.5px solid #B9BFAF!important;
background:#fff!important;color:#0D174D!important;
font-size:17px!important;line-height:1.35!important;
border-radius:0!important;
}
.contactform textarea{min-height:160px!important;resize:vertical}
.contactform .full{width:100%!important;margin:0 0 20px!important}
.contactform .form-submit{
width:100%;min-height:62px;border:0;
justify-content:center;font-size:17px;letter-spacing:.02em;
}
.contactform .form-note{font-size:14px;line-height:1.55;color:#66708A;margin:16px 0 0!important}
@media(max-width:960px){
.contact-layout{grid-template-columns:1fr;gap:38px}
.contact-details{position:static}
}
@media(max-width:680px){
.contactform{padding:24px 18px!important}
.contactform .form-row{grid-template-columns:1fr!important;gap:18px!important;margin-bottom:18px!important}
.contact-call{font-size:22px}
}
/* Footer: same actual brand artwork as header, not the square logo tile */
.footerbrand{display:block!important}
.footer-brand-link{display:inline-flex!important;margin:0 0 16px!important}
.footer-brand-art{
width:230px!important;height:86px!important;
object-fit:contain!important;object-position:left center!important;
}
.footerbrand p{max-width:390px;color:#DDE2EE;font-size:14px;line-height:1.65;margin:0}
.footerbrand img:not(.footer-brand-art){display:none!important}
/* Rural wedding image gets a fresh filename and a clean crop */
img[src="rural-wedding-v21.jpg"]{object-position:center 42%!important}
/* Social icons stay visible and recognisable */
.sociallinks{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.sociallinks a{
display:inline-flex!important;align-items:center!important;gap:8px!important;
padding:9px 11px!important;border:1px solid rgba(255,255,255,.22)!important;
}
.socialicon{width:22px;height:22px;color:#B0BC70;flex:0 0 auto}
/* V21 final footer verification */
.footerbrand .brand.brandtype{display:inline-flex!important;margin:0 0 14px!important}
.footerbrand .brandart{width:220px!important;height:80px!important;object-fit:contain!important;object-position:left center!important}
.footer-phone{font-size:21px!important;font-weight:900!important;color:#B0BC70!important}
/* V22 image-safe placeholders until Katy approves final photography */
.subheroNoPhoto{
display:flex;align-items:center;justify-content:center;
min-height:420px;background:#0D174D;
}
.countyMark{
color:#B0BC70;font-family:'Audiowide',system-ui,sans-serif;
font-size:clamp(46px,8vw,110px);letter-spacing:.04em;opacity:.95;
}
.imageHoldText{
min-height:320px;width:100%;display:flex;align-items:center;justify-content:center;
background:#0D174D;color:#B0BC70;padding:28px;text-align:center;
}
.imageHoldText span{
font-family:'Audiowide',system-ui,sans-serif;
font-size:clamp(24px,4vw,56px);line-height:1.05;letter-spacing:.02em;
}
/* ================= V24 REBUILD: NAV / FORM / IMAGE BALANCE ================= */
/* Header/nav: one clean bar, consistent spacing, no cramped/scrappy wrapping */
.top{background:#0D174D}
.topin{
min-height:96px!important;height:auto!important;
display:grid!important;
grid-template-columns:220px minmax(0,1fr) auto!important;
grid-template-areas:"brand nav contacts"!important;
gap:24px!important;align-items:center!important;
}
.brand{grid-area:brand}
.nav{
grid-area:nav!important;
display:flex!important;align-items:center!important;justify-content:center!important;
gap:clamp(14px,1.6vw,28px)!important;margin:0!important;
}
.nav>a,.navdrop{
font-size:14px!important;line-height:1!important;font-weight:800!important;
letter-spacing:.015em!important;padding:15px 0!important;white-space:nowrap!important;
}
.topcontacts{grid-area:contacts!important;margin:0!important;gap:8px!important}
.topphone{font-size:18px!important;min-height:48px!important;padding:10px 13px!important}
.topwa{min-height:48px!important;padding:10px 13px!important}
.nav .wa{display:none!important}
.dropdown{min-width:220px!important;padding:10px!important}
.dropdown a{padding:11px 12px!important;font-size:14px!important}
@media(max-width:1100px){
.topin{grid-template-columns:190px 1fr auto!important;gap:14px!important}
.nav{gap:13px!important}
.nav>a,.navdrop{font-size:13px!important}
.topphone{font-size:16px!important}
}
@media(max-width:900px){
.topin{display:flex!important;min-height:88px!important}
.nav{display:none!important}
.nav.open{display:flex!important;position:absolute!important;top:100%;left:0;right:0;
background:#0D174D;flex-direction:column!important;align-items:stretch!important;
padding:18px 24px 24px!important;gap:0!important;z-index:50}
.nav.open>a,.nav.open .navdrop{padding:14px 0!important;font-size:15px!important}
}
/* Homepage images support the story instead of taking over the page */
.featureImage{width:100%;height:100%;min-height:420px;object-fit:cover;display:block}
.servicePhoto img{object-fit:cover}
.eventFeature .featureImage,.venueFeature .featureImage{max-height:620px}
@media(max-width:760px){.featureImage{min-height:300px;max-height:420px}}
/* Brand logos */
.logo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:28px}
.logo-tile{min-height:118px;background:#fff;border:1px solid rgba(13,23,77,.12);display:flex;align-items:center;justify-content:center;padding:20px}
.logo-tile img{display:block;max-width:145px;max-height:68px;width:auto;height:auto;object-fit:contain}
.brandnote{font-size:12px!important;opacity:.7!important;margin-top:13px!important}
@media(max-width:760px){.logo-grid{grid-template-columns:repeat(2,1fr)}}
/* Sussex venue image caption */
.subheroMedia{position:relative}
.photoCredit{position:absolute;left:14px;bottom:14px;background:rgba(13,23,77,.9);color:#fff;padding:8px 10px;font-size:12px;font-weight:800}
/* CONTACT FORM — every box has exactly the same geometry */
.contactform{
box-sizing:border-box!important;width:100%!important;max-width:820px!important;
margin:0!important;padding:36px!important;background:#fff!important;
border:2px solid #D8DCCF!important;box-shadow:0 16px 40px rgba(13,23,77,.08)!important;
}
.contactform *{box-sizing:border-box!important}
.contactform .form-row{
display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:20px!important;margin:0 0 20px!important;align-items:end!important;
}
.contactform .field{display:flex!important;flex-direction:column!important;width:100%!important;min-width:0!important}
.contactform label{
min-height:44px!important;display:flex!important;align-items:flex-end!important;
margin:0 0 8px!important;font-size:15px!important;line-height:1.25!important;font-weight:800!important;
}
.contactform input,.contactform select{
-webkit-appearance:none!important;appearance:none!important;
width:100%!important;height:58px!important;min-height:58px!important;max-height:58px!important;
padding:0 15px!important;margin:0!important;border:1.5px solid #AEB5A4!important;
border-radius:0!important;background:#fff!important;color:#0D174D!important;
font:inherit!important;font-size:16px!important;line-height:58px!important;
}
.contactform select{padding-right:38px!important;background-image:linear-gradient(45deg,transparent 50%,#0D174D 50%),linear-gradient(135deg,#0D174D 50%,transparent 50%);background-position:calc(100% - 18px) 25px,calc(100% - 13px) 25px;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.contactform input[type="date"]{line-height:normal!important}
.contactform textarea{
width:100%!important;height:170px!important;min-height:170px!important;max-width:100%!important;
padding:15px!important;margin:0!important;border:1.5px solid #AEB5A4!important;
border-radius:0!important;background:#fff!important;color:#0D174D!important;font:inherit!important;font-size:16px!important;
}
.contactform .full{margin:0 0 20px!important}
.contactform .full label{min-height:auto!important}
.contactform .form-submit{width:100%!important;height:60px!important;min-height:60px!important}
@media(max-width:720px){
.contactform{padding:22px 16px!important}
.contactform .form-row{grid-template-columns:1fr!important;gap:16px!important;margin-bottom:16px!important}
.contactform label{min-height:auto!important}
}
/* V26 natural long-tail use cases */
.usecase-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:30px}
.usecase-grid>div{border-top:3px solid #B0BC70;padding-top:18px}
.usecase-grid h3{font-size:18px;margin:0 0 8px;color:#0D174D}
.usecase-grid p{margin:0;line-height:1.65}
@media(max-width:850px){.usecase-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.usecase-grid{grid-template-columns:1fr}}
/* V27 — give Contact breathing room before the header contact controls */
@media(min-width:901px){
.nav{padding-right:14px!important}
.nav>a:last-of-type{margin-right:12px!important}
.topcontacts{margin-left:10px!important}
}
.inline-link{font-weight:800;text-decoration:underline;text-decoration-color:#B0BC70;text-decoration-thickness:2px;text-underline-offset:3px}
/* V28 — more breathing room between Contact and the phone/WhatsApp controls */
@media(min-width:901px){
.topin{column-gap:34px!important}
.nav{padding-right:28px!important}
.nav>a:last-of-type{margin-right:26px!important}
.topcontacts{margin-left:16px!important}
}
@media(min-width:901px) and (max-width:1100px){
.topin{column-gap:20px!important}
.nav{padding-right:18px!important}
.nav>a:last-of-type{margin-right:16px!important}
}
/* V28 product pages */
.product-detail-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.72fr);gap:7vw;align-items:start}
.product-photo{background:#f4f3ec;padding:26px;display:flex;align-items:center;justify-content:center;min-height:430px}
.product-photo img{width:100%;max-height:560px;object-fit:contain}
.product-facts{border-top:3px solid #B0BC70;padding-top:18px}
.product-facts h3{font-size:18px;margin:0 0 14px}
.product-facts p{font-size:16px;line-height:1.55;border-bottom:1px solid #D9DDD1;padding:0 0 12px;margin:0 0 12px}
.product-intro p,.product-copy p{font-size:18px;line-height:1.65;color:#59627a}
.product-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:34px}
.product-choice{border:1px solid #D9DDD1;text-decoration:none;background:#fff;display:flex;flex-direction:column}
.product-choice-media{height:260px;background:#f4f3ec;display:flex;align-items:center;justify-content:center;padding:20px;overflow:hidden}
.product-choice-media img{width:100%;height:100%;object-fit:contain}
.product-choice-copy{padding:24px}
.product-choice-copy h3{font-size:23px;margin:0 0 10px}
.product-choice-copy p{font-size:15px;line-height:1.55;color:#66708A;margin:0}
@media(max-width:800px){
.product-detail-grid,.product-choice-grid{grid-template-columns:1fr}
.product-photo{min-height:300px}
}
/* V28 FAQ sections */
.faq-section{margin:0 0 60px}
.faq-section h2{font-size:clamp(34px,4vw,54px);margin-bottom:22px}
.faq details{border-top:1px solid #D9DDD1;padding:0}
.faq details:last-child{border-bottom:1px solid #D9DDD1}
.faq summary{font-size:18px;font-weight:900;cursor:pointer;padding:19px 42px 19px 0;position:relative;line-height:1.35}
.faq summary:after{content:"+";position:absolute;right:6px;top:15px;color:#B0BC70;font-size:27px}
.faq details[open] summary:after{content:"–"}
.faq details p{font-size:16px;line-height:1.7;color:#59627a;max-width:900px;margin:0;padding:0 45px 22px 0}
/* V28 team/about */
.team-intro{display:grid;grid-template-columns:.8fr 1.2fr;gap:7vw;align-items:start}
.team-intro .team-lead{font-size:23px;line-height:1.55;color:#0D174D}
.team-intro p{font-size:18px;line-height:1.65;color:#59627a}
.team-points{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#D9DDD1;margin-top:42px}
.team-points>div{background:#fff;padding:26px}
.team-points b{display:block;font-size:18px;margin-bottom:9px}
.team-points p{font-size:14px;line-height:1.55;margin:0;color:#66708A}
@media(max-width:800px){.team-intro,.team-points{grid-template-columns:1fr}}
/* V29 — contact form dropdown clarity */
.contactform select{cursor:pointer;background-color:#fff}
.contactform .field-help{display:block;margin-top:7px;font-size:13px;line-height:1.4;color:#687188;font-weight:500}
/* V30 — brand/venue proof: real web brand marks, no broken Clearbit boxes */
.logo-grid-v30{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:34px 0}
.brand-logo-card{min-height:170px;background:#fff;border:1px solid #e1e4da;text-decoration:none;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:22px;transition:transform .18s ease,border-color .18s ease}
.brand-logo-card:hover{transform:translateY(-2px);border-color:#B0BC70}
.brand-logo-image{height:82px;width:100%;display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.brand-logo-image img{width:76px;height:76px;object-fit:contain;display:block}
.brand-logo-name{font-size:14px;line-height:1.25;font-weight:900;text-align:center;color:#0D174D}
@media(max-width:900px){.logo-grid-v30{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){.logo-grid-v30{grid-template-columns:repeat(2,1fr)}.brand-logo-card{min-height:145px;padding:16px}.brand-logo-image{height:64px}.brand-logo-image img{width:60px;height:60px}}
/* V31 venue image captions */
.mediaCaption{font-size:.78rem;line-height:1.3;padding:8px 12px;background:#0D174D;color:#fff;letter-spacing:.02em}
/* V32: Katy profile */
.katy-profile{display:grid;grid-template-columns:minmax(240px,.72fr) minmax(0,1.28fr);gap:clamp(32px,5vw,72px);align-items:center}
.katy-photo{overflow:hidden;border-radius:22px;max-width:430px}
.katy-photo img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 28%}
@media(max-width:760px){.katy-profile{grid-template-columns:1fr}.katy-photo{max-width:340px}.katy-photo img{aspect-ratio:4/5}}
.logo-grid-v33{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:34px 0 20px}.logo-grid-v33 .brand-logo-card{min-height:150px;background:#fff;border:1px solid rgba(13,23,77,.12);display:flex;align-items:center;justify-content:center;padding:22px;text-decoration:none;position:relative;overflow:hidden;transition:.2s}.logo-grid-v33 .real-logo img{display:block;max-width:100%;max-height:100px;width:auto;height:auto;object-fit:contain}.logo-grid-v33 .logo-fallback{display:none;font-weight:800;color:#0D174D;text-align:center}.logo-grid-v33 .wordmark-logo span{font-size:clamp(18px,2vw,28px);line-height:1.05;font-weight:800;letter-spacing:-.03em;color:#0D174D;text-align:center}.logo-grid-v33 .brand-logo-card:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(13,23,77,.10)}@media(max-width:850px){.logo-grid-v33{grid-template-columns:repeat(2,minmax(0,1fr))}.logo-grid-v33 .brand-logo-card{min-height:125px}}
/* V34: visible client wall with no remote-image dependencies */
.client-wall{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:28px}.client-mark{min-height:118px;background:#fff;border:1px solid rgba(13,23,77,.10);display:flex;align-items:center;justify-content:center;text-align:center;padding:22px 18px;color:#0D174D;font-weight:800;font-size:18px;line-height:1.1;letter-spacing:.02em;box-shadow:0 10px 28px rgba(13,23,77,.06)}.client-mark.costa{font-family:Georgia,serif;color:#6d1d34;border-radius:60px}.client-mark.starbucks{color:#00754a;border-radius:60px;letter-spacing:.08em}.client-mark.rac{font-family:Georgia,serif;color:#172d54}.client-mark.goodwood{font-family:Georgia,serif;letter-spacing:.12em}.client-mark.pizza{font-family:Georgia,serif;font-style:italic;font-size:24px}.client-mark.silverstone{font-style:italic;font-size:22px;letter-spacing:.08em}.client-mark.pig{font-family:Georgia,serif;font-size:26px;letter-spacing:.12em}.client-mark.fairmont{font-family:Georgia,serif;letter-spacing:.12em}.client-mark.tulleys{font-size:24px;letter-spacing:.08em}.client-mark.smoked{font-family:Georgia,serif;font-size:22px}.client-mark.koffie{font-size:26px;letter-spacing:.14em}.client-mark.wolfox{font-size:25px;letter-spacing:.12em}.client-mark.thyme,.client-mark.copper{font-family:Georgia,serif;font-size:22px}.client-mark.direct{font-size:22px}.client-wall-full{grid-template-columns:repeat(3,minmax(0,1fr))}.finalPhoto img{object-position:center 52%}.finalPhoto:after{background:linear-gradient(90deg,rgba(13,23,77,.78),rgba(13,23,77,.18) 58%,rgba(13,23,77,0) 82%)}@media(max-width:850px){.client-wall,.client-wall-full{grid-template-columns:repeat(2,minmax(0,1fr))}.client-mark{min-height:96px;font-size:15px;padding:16px 12px}}@media(max-width:480px){.client-wall,.client-wall-full{grid-template-columns:1fr 1fr;gap:9px}.client-mark{min-height:82px;font-size:13px}}
/* V35 local brand artwork grid */
.client-logo-wall{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:30px}.client-logo{height:150px;background:#fff;border:1px solid rgba(13,23,77,.10);display:flex;align-items:center;justify-content:center;padding:20px;box-shadow:0 10px 28px rgba(13,23,77,.05)}.client-logo img{display:block;width:100%;height:100%;object-fit:contain}.finalPhoto:after{background:linear-gradient(90deg,rgba(13,23,77,.58),rgba(13,23,77,.08) 55%,transparent 78%)}@media(max-width:850px){.client-logo-wall{grid-template-columns:repeat(2,minmax(0,1fr))}.client-logo{height:120px;padding:14px}}@media(max-width:480px){.client-logo-wall{gap:9px}.client-logo{height:100px;padding:10px}}
/* V36 cache-busted visual corrections */
.finalPhoto{height:680px;background:#0D174D}
.finalPhoto>img{width:100%;height:100%;object-fit:cover;object-position:center 45%}
.finalPhoto:after{background:linear-gradient(90deg,rgba(13,23,77,.76) 0%,rgba(13,23,77,.40) 36%,rgba(13,23,77,.08) 68%,rgba(13,23,77,0) 84%)}
.brand-showcase{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin-top:34px}
.brand-tile{min-height:150px;background:#fff;border:1px solid rgba(13,23,77,.10);display:flex;align-items:center;justify-content:center;padding:18px;box-shadow:0 9px 24px rgba(13,23,77,.06);overflow:hidden}
.brand-tile img{display:block;max-width:100%;max-height:108px;width:auto;height:auto;object-fit:contain}
.brand-fallback{display:none;color:#0D174D;font-weight:900;font-size:18px;text-align:center;line-height:1.15}
.brand-secondary{margin-top:28px;padding:26px 30px;background:#F4F3EC;border-left:4px solid #B0BC70;color:#0D174D;font-size:17px;line-height:1.7}
.brand-secondary strong{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px;color:#66708A}
@media(max-width:980px){.brand-showcase{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:620px){.brand-showcase{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.brand-tile{min-height:112px;padding:12px}.brand-tile img{max-height:82px}.brand-secondary{padding:20px}}
/* V37 — reliable local brand treatment: no remote images, no broken placeholders */
.brand-showcase{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.brand-wordmark{min-height:122px;background:#fff;border:1px solid rgba(13,23,77,.09);display:flex;align-items:center;justify-content:center;padding:20px 16px;text-align:center;box-shadow:0 8px 22px rgba(13,23,77,.05)}
.brand-wordmark span{font-weight:800;letter-spacing:-.02em;color:#0D174D;font-size:21px;line-height:1.05}
.brand-wordmark.costa span{color:#A6192E;font-weight:900;letter-spacing:.04em}
.brand-wordmark.starbucks span{color:#00754A;font-weight:900;letter-spacing:.01em}
.brand-wordmark.rac span{font-family:Georgia,serif;font-weight:700;font-size:19px}
.brand-wordmark.goodwood span{font-family:Georgia,serif;font-weight:700;color:#111}
.brand-wordmark.pizzaexpress span{font-weight:900;font-size:20px}
.brand-wordmark.silverstone span{font-style:italic;font-weight:900;font-size:23px}
.brand-wordmark.tulleys span{color:#3E7E36;font-weight:900}
.brand-wordmark.thepig span{font-family:Georgia,serif;letter-spacing:.06em}
.brand-wordmark.pennyhill span,.brand-wordmark.fairmont span{font-family:Georgia,serif;font-weight:700}
.brand-wordmark.koffie span{font-weight:900;letter-spacing:.07em}
.brand-wordmark.thyme span{color:#7D8E64;font-family:Georgia,serif}
.brand-wordmark.wolfox span{letter-spacing:.03em}
@media(max-width:900px){.brand-showcase{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:620px){.brand-showcase{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.brand-wordmark{min-height:96px;padding:14px}.brand-wordmark span{font-size:17px}}
/* V38 - verified responsive fixes */
html, body { width:100%; max-width:100%; overflow-x:hidden; }
.wrap { width:min(1180px, 90vw); max-width:1180px; }
/* About: deliberate profile layout, never wider than viewport */
.about-profile-v38 { display:grid; grid-template-columns:minmax(220px, 360px) minmax(0, 1fr); gap:clamp(28px,5vw,70px); align-items:center; }
.about-profile-v38 > * { min-width:0; }
.katy-photo-v38 { width:100%; max-width:360px; overflow:hidden; border-radius:18px; background:#F4F3EC; }
.katy-photo-v38 img { display:block; width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center 38%; }
.team-points-v38 { grid-column:1 / -1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:#D9DDD1; width:100%; max-width:100%; margin-top:18px; }
.team-points-v38 > div { background:white; padding:22px; min-width:0; }
.team-points-v38 b { display:block; margin-bottom:8px; }
.team-points-v38 p { margin:0; line-height:1.55; color:#66708A; }
/* Brands: no client image elements, no remote assets, no icon-font glyphs */
.brand-showcase-v38 { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-top:34px; width:100%; max-width:100%; }
.brand-mark-v38 { min-height:116px; border:1px solid #D9DDD1; background:#fff; display:flex; align-items:center; justify-content:center; text-align:center; padding:18px 14px; color:#0D174D; font-weight:900; font-size:19px; line-height:1.12; letter-spacing:-.015em; box-shadow:0 7px 20px rgba(13,23,77,.05); min-width:0; }
.brand-mark-v38.costa { color:#A6192E; letter-spacing:.04em; }
.brand-mark-v38.starbucks { color:#00754A; letter-spacing:.03em; }
.brand-mark-v38.goodwood,.brand-mark-v38.rac,.brand-mark-v38.fairmont,.brand-mark-v38.pig { font-family:Georgia,'Times New Roman',serif; }
.brand-mark-v38.pizza { font-family:Georgia,'Times New Roman',serif; font-style:italic; font-size:22px; }
.brand-mark-v38.silverstone { font-style:italic; letter-spacing:.07em; }
.brand-mark-v38.koffie { letter-spacing:.12em; }
.brand-mark-v38.tulleys { color:#3E7E36; }
.brandnote-v38 { margin-top:18px; color:#66708A; font-size:13px; }
/* Contact: keep every control aligned; no helper under Purpose */
.contactform { width:100%!important; max-width:820px!important; margin:0!important; }
.contactform .form-row { display:grid!important; grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important; gap:18px!important; align-items:start!important; width:100%!important; }
.contactform .field { min-width:0!important; width:100%!important; }
.contactform .field.full { grid-column:1/-1!important; }
.contactform label { display:block!important; margin-bottom:8px!important; }
.contactform input,.contactform select,.contactform textarea { display:block!important; width:100%!important; max-width:100%!important; box-sizing:border-box!important; }
.contactform input,.contactform select { height:58px!important; min-height:58px!important; }
.contactform textarea { min-height:170px!important; resize:vertical!important; }
.contactform .field-help { display:none!important; }
@media (max-width:900px){
.about-profile-v38 { grid-template-columns:minmax(190px, 280px) minmax(0,1fr); gap:28px; }
.team-points-v38 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.brand-showcase-v38 { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:720px){
.about-profile-v38 { grid-template-columns:1fr; }
.katy-photo-v38 { max-width:330px; }
.team-points-v38 { grid-template-columns:1fr; }
.brand-showcase-v38 { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.brand-mark-v38 { min-height:94px; font-size:16px; padding:13px 10px; }
.contactform .form-row { grid-template-columns:1fr!important; gap:14px!important; }
}
@media (max-width:430px){
.brand-showcase-v38 { grid-template-columns:1fr; }
}
/* V39 — Doggart & Squash supplied logo reference treatment */
.brand-mark-v38.doggart{padding:10px;background:#fff}
.doggart-ring{width:96px;height:96px;border:2px solid #222;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#222;box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 4px #555}
.doggart-ring small{font-family:Arial,sans-serif;font-size:6px;letter-spacing:.15em;margin-bottom:3px}
.doggart-ring b{font-family:Georgia,'Times New Roman',serif;font-size:11px;letter-spacing:.08em;line-height:1.05}
.doggart-ring em{display:block;font-family:Georgia,'Times New Roman',serif;font-size:22px;line-height:.75;font-style:italic;letter-spacing:0}
/* V40: supplied venue imagery + brand proof */
.real-work{overflow:hidden}.real-work h2{max-width:860px}.delivery-mosaic{display:grid;grid-template-columns:repeat(12,1fr);gap:12px;margin-top:36px}.delivery-mosaic figure{margin:0;overflow:hidden;min-height:260px;background:#111a4c}.delivery-mosaic figure:nth-child(6n+1),.delivery-mosaic figure:nth-child(6n+4){grid-column:span 7}.delivery-mosaic figure:nth-child(6n+2),.delivery-mosaic figure:nth-child(6n+3){grid-column:span 5}.delivery-mosaic figure:nth-child(6n+5),.delivery-mosaic figure:nth-child(6n+6){grid-column:span 6}.delivery-mosaic img{width:100%;height:100%;min-height:260px;max-height:520px;object-fit:cover;transition:transform .5s ease}.delivery-mosaic figure:hover img{transform:scale(1.025)}.brand-mark-v38.felix{font-family:Georgia,serif;letter-spacing:.16em;font-size:26px}.brand-mark-v38.directtable{font-weight:900;font-style:italic}.brand-mark-v38.bennetts{font-weight:900}.brand-mark-v38.thyme{font-family:Georgia,serif;letter-spacing:.04em}@media(max-width:760px){.delivery-mosaic{grid-template-columns:1fr 1fr;gap:8px}.delivery-mosaic figure,.delivery-mosaic figure:nth-child(n){grid-column:span 1;min-height:190px}.delivery-mosaic figure:nth-child(3n+1){grid-column:1/-1;min-height:260px}.delivery-mosaic img{min-height:190px}.brand-showcase-v38{grid-template-columns:1fr 1fr}}
/* V40 reliable brand wall: no broken external image dependencies */
.text-wall .client-wordmark{display:flex;align-items:center;justify-content:center;text-align:center;min-height:92px;padding:18px;border:1px solid var(--line);background:#fff;font-weight:900;letter-spacing:.02em;color:var(--navy);font-size:clamp(14px,1.4vw,20px)}.text-wall .client-wordmark:nth-child(4n+2){font-family:Georgia,serif;font-weight:700}.text-wall .client-wordmark:nth-child(5n){letter-spacing:.12em}.text-wall .client-wordmark:hover{background:var(--cream);transform:translateY(-2px)}
/* V42 — single canonical Lunar Ice logo treatment across every page */
.brand.brandtype{display:flex!important;align-items:center!important;overflow:visible!important;min-width:0!important}
.brand.brandtype .brandart,
.footerbrand .brandart,
.footerbrandtype .brandart{
display:block!important;
visibility:visible!important;
opacity:1!important;
width:210px!important;
max-width:210px!important;
height:82px!important;
max-height:82px!important;
object-fit:contain!important;
object-position:left center!important;
flex:0 0 auto!important;
filter:none!important;
}
.brand-fallback-v42{
display:none;
color:#B0BC70!important;
font-family:'Audiowide',Arial,sans-serif!important;
font-size:22px!important;
font-weight:400!important;
line-height:1!important;
white-space:nowrap!important;
}
.footerbrand .brand-fallback-v42,.footerbrandtype .brand-fallback-v42{font-size:20px!important}
@media(max-width:900px){
.brand.brandtype .brandart{width:176px!important;max-width:176px!important;height:70px!important;max-height:70px!important}
}
@media(max-width:520px){
.brand.brandtype .brandart{width:150px!important;max-width:150px!important;height:62px!important;max-height:62px!important}
}
/* V43 — all brand artwork stored locally; no hotlinked logo images */
.brand-showcase-v38 .local-logo-v43{padding:10px;min-height:128px;overflow:hidden;background:#fff}
.brand-showcase-v38 .local-logo-v43 img{display:block;width:100%;height:116px;object-fit:contain;object-position:center;max-width:100%;filter:none}
@media(max-width:720px){.brand-showcase-v38 .local-logo-v43{min-height:108px;padding:8px}.brand-showcase-v38 .local-logo-v43 img{height:94px}}
/* V46 — header stability, capability-led About page, back-to-top */
@media (min-width:1181px){
.topin{height:92px;gap:16px!important}
.brand.brandtype{flex:0 0 auto;margin-right:8px!important}
.brandart{width:112px!important;max-width:112px!important;height:56px!important;max-height:56px!important;object-fit:contain!important}
.nav{margin-left:auto!important;gap:14px!important;min-width:0!important;white-space:nowrap!important}
.nav a,.navdrop{font-size:11px!important}
.topcontacts{margin-left:8px!important;flex:0 0 auto!important}
.topphone,.topwa{font-size:11px!important;padding:10px 11px!important}
}
@media (max-width:1180px){
.topin{height:88px!important;display:flex!important;align-items:center!important;position:relative!important}
.brand.brandtype{margin-right:auto!important;flex:0 0 auto!important}
.brandart{width:112px!important;max-width:112px!important;height:56px!important;max-height:56px!important;object-fit:contain!important}
.topcontacts{display:none!important}
.menuBtn{display:block!important;margin-left:auto!important;position:relative!important;z-index:3!important}
.nav{display:none!important}
.nav.open{display:flex!important;position:absolute!important;left:0!important;right:0!important;top:88px!important;background:var(--navy)!important;padding:18px 5vw 28px!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;border-top:1px solid rgba(255,255,255,.15)!important;box-shadow:0 18px 38px rgba(0,0,0,.22)!important}
.nav.open>a,.nav.open .navdrop{padding:13px 0!important;width:100%!important;text-align:left!important}
.navgroup{width:100%!important}
.dropdown{position:static!important;box-shadow:none!important;margin:0!important;padding:0 0 8px 16px!important;background:rgba(255,255,255,.04)!important}
}
.about-capability-hero-v46{background:#f7f6f0;padding:78px 0 82px;border-bottom:1px solid rgba(13,23,77,.10)}
.about-capability-grid-v46{display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,.95fr);gap:64px;align-items:center}
.about-capability-copy-v46 h1{font-size:clamp(58px,6.7vw,96px);line-height:.88;letter-spacing:-.055em;margin:16px 0 28px;color:#0D174D}.about-capability-copy-v46 h1 em{font-style:normal;color:#B0BC70}
.about-capability-copy-v46 p{font-size:18px;line-height:1.68;color:#4b5571;max-width:760px}.about-capability-lead-v46{font-size:22px!important;color:#0D174D!important}
.about-capability-image-v46{position:relative;min-height:500px;background:#0D174D;overflow:hidden}.about-capability-image-v46 img{width:100%;height:100%;min-height:500px;object-fit:cover;object-position:center}
.about-capability-tag-v46{position:absolute;left:0;right:0;bottom:0;background:rgba(13,23,77,.92);color:#fff;padding:18px 22px;display:flex;justify-content:space-between;gap:16px;align-items:center}.about-capability-tag-v46 b{color:#B0BC70;font-size:12px;letter-spacing:.09em}.about-capability-tag-v46 span{font-size:12px}
.about-proof-v46{background:#07143f;color:#fff;border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(176,188,112,.25)}.about-proof-grid-v46{display:grid;grid-template-columns:repeat(4,1fr)}.about-proof-grid-v46>div{padding:26px 24px;border-right:1px solid rgba(255,255,255,.18)}.about-proof-grid-v46>div:last-child{border-right:0}.about-proof-grid-v46 b{display:block;color:#B0BC70;font-size:13px;line-height:1.25;margin-bottom:8px;letter-spacing:.04em}.about-proof-grid-v46 span{font-size:12px;line-height:1.5;color:#e8ebf4}
.about-katy-v46{background:#fff}.about-katy-grid-v46{display:grid;grid-template-columns:220px minmax(0,1fr);gap:54px;align-items:start}.about-katy-photo-v46{width:220px;height:280px;overflow:hidden;background:#f0f0ec}.about-katy-photo-v46 img{width:100%;height:100%;object-fit:cover;object-position:center 28%}.about-katy-copy-v46 h2{font-size:clamp(48px,5.5vw,76px);line-height:.9;letter-spacing:-.05em;margin:14px 0 26px}.about-katy-copy-v46 h2 em{font-style:normal;color:#B0BC70}.about-katy-copy-v46 p{font-size:17px;line-height:1.7;color:#4b5571;max-width:860px}.about-katy-lead-v46{font-size:20px!important;color:#0D174D!important}
.about-values-v46{background:#0D174D;color:#fff;padding:78px 0}.about-value-grid-v46{display:grid;grid-template-columns:repeat(4,1fr);margin-top:28px;border-top:1px solid rgba(255,255,255,.18);border-bottom:1px solid rgba(255,255,255,.18)}.about-value-grid-v46>div{padding:28px 24px;border-right:1px solid rgba(255,255,255,.18)}.about-value-grid-v46>div:last-child{border-right:0}.about-value-grid-v46 b{display:block;color:#B0BC70;font-size:17px;margin-bottom:9px}.about-value-grid-v46 p{margin:0;font-size:14px;line-height:1.6;color:#e5e8f0}
@media(max-width:900px){.about-capability-grid-v46{grid-template-columns:1fr}.about-capability-image-v46,.about-capability-image-v46 img{min-height:420px}.about-proof-grid-v46{grid-template-columns:1fr 1fr}.about-proof-grid-v46>div:nth-child(2){border-right:0}.about-proof-grid-v46>div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.18)}.about-katy-grid-v46{grid-template-columns:160px 1fr;gap:32px}.about-katy-photo-v46{width:160px;height:210px}.about-value-grid-v46{grid-template-columns:1fr 1fr}.about-value-grid-v46>div:nth-child(2){border-right:0}.about-value-grid-v46>div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.18)}}
@media(max-width:620px){.about-capability-hero-v46{padding:55px 0}.about-capability-image-v46,.about-capability-image-v46 img{min-height:330px}.about-proof-grid-v46,.about-value-grid-v46{grid-template-columns:1fr}.about-proof-grid-v46>div,.about-value-grid-v46>div{border-right:0!important;border-bottom:1px solid rgba(255,255,255,.18)}.about-proof-grid-v46>div:last-child,.about-value-grid-v46>div:last-child{border-bottom:0}.about-katy-grid-v46{grid-template-columns:1fr}.about-katy-photo-v46{width:130px;height:160px}.about-capability-tag-v46{display:block}.about-capability-tag-v46 span{display:block;margin-top:4px}}
.back-to-top-v46{position:fixed;right:22px;bottom:22px;width:48px;height:48px;border:0;border-radius:50%;background:#B0BC70;color:#0D174D;font-size:23px;font-weight:900;display:grid;place-items:center;cursor:pointer;z-index:80;box-shadow:0 10px 28px rgba(13,23,77,.28);opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s ease}.back-to-top-v46.show{opacity:1;visibility:visible;transform:none}.back-to-top-v46:hover{transform:translateY(-2px)}
@media(max-width:620px){.back-to-top-v46{right:14px;bottom:72px;width:44px;height:44px}}
/* V47 — clean header architecture + owner/founder/team positioning */
.top{position:sticky!important;top:0!important;z-index:100!important;background:#0D174D!important}
.topin{width:min(1240px,94vw)!important;margin:auto!important;min-height:84px!important;height:auto!important;display:grid!important;grid-template-columns:132px minmax(0,1fr) auto!important;align-items:center!important;column-gap:22px!important;position:relative!important}
.brand.brandtype{grid-column:1!important;display:flex!important;align-items:center!important;width:132px!important;max-width:132px!important;flex:none!important;margin:0!important;overflow:visible!important;z-index:2!important}
.brand.brandtype .brandart{width:132px!important;max-width:132px!important;height:58px!important;max-height:58px!important;object-fit:contain!important;object-position:left center!important}
.nav{grid-column:2!important;margin:0!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:15px!important;min-width:0!important;white-space:nowrap!important;position:static!important}
.nav a,.navdrop{font-size:11px!important;line-height:1!important;white-space:nowrap!important;padding:0!important}
.topcontacts{grid-column:3!important;display:flex!important;align-items:center!important;gap:8px!important;margin:0!important;flex:none!important}
.topphone,.topwa{font-size:11px!important;min-height:42px!important;padding:9px 10px!important;white-space:nowrap!important}
.menuBtn{display:none!important}
/* Use a deliberate compact menu on tablet/iPad and smaller — no crammed desktop nav */
@media(max-width:1360px){
.topin{grid-template-columns:132px 1fr auto!important;min-height:84px!important}
.topcontacts{display:none!important}
.menuBtn{display:inline-flex!important;grid-column:3!important;align-items:center!important;justify-content:center!important;margin:0!important;background:transparent!important;border:1px solid rgba(255,255,255,.35)!important;color:#fff!important;padding:11px 14px!important;font-weight:900!important;letter-spacing:.04em!important;z-index:4!important}
.nav{display:none!important}
.nav.open{display:flex!important;position:absolute!important;left:0!important;right:0!important;top:100%!important;background:#0D174D!important;padding:16px 5vw 24px!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;gap:0!important;border-top:1px solid rgba(255,255,255,.14)!important;box-shadow:0 18px 38px rgba(0,0,0,.25)!important;z-index:3!important;white-space:normal!important}
.nav.open>a,.nav.open .navdrop{display:block!important;width:100%!important;padding:13px 0!important;text-align:left!important;font-size:13px!important;line-height:1.2!important}
.navgroup{width:100%!important}
.dropdown{position:static!important;display:none!important;box-shadow:none!important;margin:0!important;padding:0 0 8px 16px!important;background:rgba(255,255,255,.04)!important}
.navgroup.open .dropdown{display:block!important}
.navgroup.open .dropdown a{display:block!important;padding:10px 0!important;font-size:12px!important}
}
@media(max-width:600px){
.topin{width:min(94vw,1240px)!important;grid-template-columns:112px 1fr auto!important;min-height:78px!important}
.brand.brandtype{width:112px!important;max-width:112px!important}
.brand.brandtype .brandart{width:112px!important;max-width:112px!important;height:50px!important;max-height:50px!important}
.menuBtn{padding:10px 12px!important;font-size:11px!important}
}
.about-capability-hero-v47{background:#f7f6f0;padding:78px 0 82px;border-bottom:1px solid rgba(13,23,77,.10)}
.about-capability-grid-v47{display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,.95fr);gap:64px;align-items:center}
.about-capability-copy-v47 h1{font-size:clamp(58px,6.7vw,96px);line-height:.88;letter-spacing:-.055em;margin:16px 0 28px;color:#0D174D}.about-capability-copy-v47 h1 em{font-style:normal;color:#B0BC70}
.about-capability-copy-v47 p{font-size:18px;line-height:1.68;color:#4b5571;max-width:760px}.about-capability-lead-v47{font-size:22px!important;color:#0D174D!important}
.about-capability-image-v47{position:relative;min-height:500px;background:#0D174D;overflow:hidden}.about-capability-image-v47 img{width:100%;height:100%;min-height:500px;object-fit:cover;object-position:center}
.about-capability-tag-v47{position:absolute;left:0;right:0;bottom:0;background:rgba(13,23,77,.92);color:#fff;padding:18px 22px;display:flex;justify-content:space-between;gap:16px;align-items:center}.about-capability-tag-v47 b{color:#B0BC70;font-size:12px;letter-spacing:.09em}.about-capability-tag-v47 span{font-size:12px}
.about-proof-v47{background:#07143f;color:#fff}.about-proof-grid-v47{display:grid;grid-template-columns:repeat(4,1fr)}.about-proof-grid-v47>div{padding:26px 24px;border-right:1px solid rgba(255,255,255,.18)}.about-proof-grid-v47>div:last-child{border-right:0}.about-proof-grid-v47 b{display:block;color:#B0BC70;font-size:13px;line-height:1.25;margin-bottom:8px;letter-spacing:.04em}.about-proof-grid-v47 span{font-size:12px;line-height:1.5;color:#e8ebf4}
.about-founder-v47{background:#fff}.about-founder-grid-v47{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:70px;align-items:start}.about-founder-copy-v47 h2{font-size:clamp(50px,5.8vw,82px);line-height:.9;letter-spacing:-.05em;margin:14px 0 26px}.about-founder-copy-v47 h2 em{font-style:normal;color:#B0BC70}.about-founder-copy-v47 p{font-size:17px;line-height:1.7;color:#4b5571;max-width:850px}.about-founder-lead-v47{font-size:20px!important;color:#0D174D!important}
.about-founder-side-v47{display:grid;gap:18px}.about-founder-photo-v47{width:100%;max-width:330px;justify-self:end;background:#f1f1eb;overflow:hidden}.about-founder-photo-v47 img{width:100%;height:auto;max-height:390px;object-fit:contain;object-position:center top}.about-team-card-v47{background:#0D174D;color:#fff;padding:30px;max-width:430px;justify-self:end}.about-team-card-v47 span{display:block;color:#B0BC70;font-size:11px;font-weight:900;letter-spacing:.14em;margin-bottom:14px}.about-team-card-v47 b{display:block;font-size:28px;line-height:1.05;margin-bottom:15px}.about-team-card-v47 p{margin:0;color:#e5e8f0;font-size:14px;line-height:1.6}
.about-values-v47{background:#0D174D;color:#fff;padding:78px 0}.about-value-grid-v47{display:grid;grid-template-columns:repeat(4,1fr);margin-top:28px;border-top:1px solid rgba(255,255,255,.18);border-bottom:1px solid rgba(255,255,255,.18)}.about-value-grid-v47>div{padding:28px 24px;border-right:1px solid rgba(255,255,255,.18)}.about-value-grid-v47>div:last-child{border-right:0}.about-value-grid-v47 b{display:block;color:#B0BC70;font-size:17px;margin-bottom:9px}.about-value-grid-v47 p{margin:0;font-size:14px;line-height:1.6;color:#e5e8f0}
@media(max-width:900px){.about-capability-grid-v47,.about-founder-grid-v47{grid-template-columns:1fr}.about-capability-image-v47,.about-capability-image-v47 img{min-height:420px}.about-proof-grid-v47,.about-value-grid-v47{grid-template-columns:1fr 1fr}.about-founder-photo-v47,.about-team-card-v47{justify-self:start}.about-founder-photo-v47{max-width:260px}.about-proof-grid-v47>div:nth-child(2),.about-value-grid-v47>div:nth-child(2){border-right:0}.about-proof-grid-v47>div:nth-child(-n+2),.about-value-grid-v47>div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.18)}}
@media(max-width:620px){.about-capability-hero-v47{padding:55px 0}.about-capability-image-v47,.about-capability-image-v47 img{min-height:330px}.about-proof-grid-v47,.about-value-grid-v47{grid-template-columns:1fr}.about-proof-grid-v47>div,.about-value-grid-v47>div{border-right:0!important;border-bottom:1px solid rgba(255,255,255,.18)}.about-proof-grid-v47>div:last-child,.about-value-grid-v47>div:last-child{border-bottom:0}.about-founder-photo-v47{max-width:200px}.about-capability-tag-v47{display:block}.about-capability-tag-v47 span{display:block;margin-top:4px}}
/* V49 — refined header, semantic home feature icons, revised About positioning */
/* Keep the complete navigation visible on desktop and iPad landscape-sized widths. */
@media (min-width: 961px){
.top .topin{width:min(1280px,96vw)!important;display:flex!important;align-items:center!important;gap:16px!important;min-height:84px!important;height:84px!important}
.top .brand.brandtype{display:flex!important;flex:0 0 112px!important;width:112px!important;max-width:112px!important;height:58px!important;margin:0!important;overflow:visible!important}
.top .brand.brandtype .brandart{width:112px!important;max-width:112px!important;height:54px!important;max-height:54px!important;object-fit:contain!important;object-position:left center!important}
.top .nav{display:flex!important;position:static!important;margin-left:auto!important;align-items:center!important;justify-content:flex-end!important;gap:11px!important;white-space:nowrap!important;min-width:0!important;padding:0!important;background:transparent!important;box-shadow:none!important;border:0!important;flex-direction:row!important;overflow:visible!important}
.top .nav>a,.top .nav .navdrop{display:inline-flex!important;align-items:center!important;width:auto!important;margin:0!important;padding:9px 0!important;font-size:10.5px!important;line-height:1.05!important;text-align:center!important;white-space:nowrap!important;color:#fff!important;border:0!important;background:transparent!important}
.top .nav .walink{color:#B0BC70!important;border:1px solid #B0BC70!important;padding:10px 11px!important}
.top .menuBtn{display:none!important}
.top .topcontacts{display:none!important}
.top .navgroup{width:auto!important;position:relative!important}
.top .dropdown{position:absolute!important;top:100%!important;left:0!important;display:none!important;width:max-content!important;min-width:220px!important;padding:10px 0!important;background:#0D174D!important;border:1px solid rgba(255,255,255,.14)!important;box-shadow:0 18px 32px rgba(0,0,0,.22)!important;z-index:20!important}
.top .navgroup:hover .dropdown,.top .navgroup.open .dropdown{display:block!important}
.top .dropdown a{display:block!important;padding:10px 14px!important;font-size:11px!important;white-space:nowrap!important;color:#fff!important;text-align:left!important}
}
@media (max-width:960px){
.top .topin{width:92vw!important;min-height:78px!important;height:78px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:14px!important}
.top .brand.brandtype{flex:0 0 112px!important;width:112px!important;max-width:112px!important;height:52px!important}
.top .brand.brandtype .brandart{width:112px!important;max-width:112px!important;height:50px!important;max-height:50px!important}
.top .menuBtn{display:inline-flex!important;align-items:center!important;justify-content:center!important;margin-left:auto!important;padding:10px 13px!important;background:transparent!important;border:1px solid rgba(255,255,255,.38)!important;color:#fff!important;font-size:11px!important;font-weight:900!important;letter-spacing:.06em!important}
.top .nav{display:none!important}
.top .nav.open{display:flex!important;position:absolute!important;left:0!important;right:0!important;top:100%!important;width:100%!important;margin:0!important;padding:14px 5vw 22px!important;background:#0D174D!important;border-top:1px solid rgba(255,255,255,.14)!important;box-shadow:0 18px 38px rgba(0,0,0,.25)!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;white-space:normal!important;max-height:calc(100vh - 78px)!important;overflow-y:auto!important}
.top .nav.open>a,.top .nav.open .navdrop{display:block!important;width:100%!important;padding:13px 0!important;text-align:left!important;font-size:13px!important;color:#fff!important}
}
/* Home strip — use icons that actually describe each promise. */
.approved-strip-v45 .trusticon{width:30px!important;height:30px!important;display:grid!important;place-items:center!important;top:25px!important}
.approved-strip-v45 .trusticon svg{width:29px;height:29px;display:block;stroke:#B0BC70;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* About V49 */
.about-capability-hero-v49{background:#f7f6f0;padding:76px 0 80px;border-bottom:1px solid rgba(13,23,77,.10)}
.about-capability-grid-v49{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(400px,.95fr);gap:60px;align-items:center}
.about-capability-copy-v49 h1{font-size:clamp(56px,6.4vw,92px);line-height:.89;letter-spacing:-.052em;margin:16px 0 28px;color:#0D174D}.about-capability-copy-v49 h1 em{font-style:normal;color:#B0BC70}
.about-capability-copy-v49 p{font-size:18px;line-height:1.68;color:#4b5571;max-width:760px}.about-capability-lead-v49{font-size:22px!important;color:#0D174D!important}
.about-capability-image-v49{position:relative;min-height:480px;background:#0D174D;overflow:hidden}.about-capability-image-v49 img{width:100%;height:100%;min-height:480px;object-fit:cover;object-position:center}
.about-capability-tag-v49{position:absolute;left:0;right:0;bottom:0;background:rgba(13,23,77,.92);color:#fff;padding:18px 22px}.about-capability-tag-v49 b{display:block;color:#B0BC70;font-size:12px;letter-spacing:.10em;margin-bottom:4px}.about-capability-tag-v49 span{font-size:12px;line-height:1.45}
.about-proof-v49{background:#07143f;color:#fff}.about-proof-grid-v49{display:grid;grid-template-columns:repeat(4,1fr)}.about-proof-grid-v49>div{padding:26px 24px;border-right:1px solid rgba(255,255,255,.18)}.about-proof-grid-v49>div:last-child{border-right:0}.about-proof-grid-v49 b{display:block;color:#B0BC70;font-size:13px;line-height:1.25;margin-bottom:8px;letter-spacing:.04em}.about-proof-grid-v49 span{font-size:12px;line-height:1.5;color:#e8ebf4}
.about-founder-v49{background:#fff}.about-founder-grid-v49{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:68px;align-items:start}.about-founder-copy-v49 h2{font-size:clamp(48px,5.4vw,78px);line-height:.91;letter-spacing:-.048em;margin:14px 0 26px}.about-founder-copy-v49 h2 em{font-style:normal;color:#B0BC70}.about-founder-copy-v49 p{font-size:17px;line-height:1.72;color:#4b5571;max-width:850px}.about-founder-lead-v49{font-size:20px!important;color:#0D174D!important}
.about-founder-side-v49{display:grid;gap:18px}.about-founder-photo-v49{width:100%;max-width:250px;justify-self:end;background:#f1f1eb;overflow:hidden}.about-founder-photo-v49 img{width:100%;height:auto;max-height:310px;object-fit:contain;object-position:center top}.about-team-card-v49{background:#0D174D;color:#fff;padding:30px;max-width:390px;justify-self:end}.about-team-card-v49 span{display:block;color:#B0BC70;font-size:11px;font-weight:900;letter-spacing:.14em;margin-bottom:14px}.about-team-card-v49 b{display:block;font-size:26px;line-height:1.08;margin-bottom:15px}.about-team-card-v49 p{margin:0;color:#e5e8f0;font-size:14px;line-height:1.62}
.about-values-v49{background:#0D174D;color:#fff;padding:78px 0}.about-value-grid-v49{display:grid;grid-template-columns:repeat(4,1fr);margin-top:28px;border-top:1px solid rgba(255,255,255,.18);border-bottom:1px solid rgba(255,255,255,.18)}.about-value-grid-v49>div{padding:28px 24px;border-right:1px solid rgba(255,255,255,.18)}.about-value-grid-v49>div:last-child{border-right:0}.about-value-grid-v49 b{display:block;color:#B0BC70;font-size:17px;margin-bottom:9px}.about-value-grid-v49 p{margin:0;font-size:14px;line-height:1.6;color:#e5e8f0}
@media(max-width:900px){.about-capability-grid-v49,.about-founder-grid-v49{grid-template-columns:1fr}.about-capability-image-v49,.about-capability-image-v49 img{min-height:400px}.about-proof-grid-v49,.about-value-grid-v49{grid-template-columns:1fr 1fr}.about-founder-photo-v49,.about-team-card-v49{justify-self:start}.about-founder-photo-v49{max-width:220px}.about-proof-grid-v49>div:nth-child(2),.about-value-grid-v49>div:nth-child(2){border-right:0}.about-proof-grid-v49>div:nth-child(-n+2),.about-value-grid-v49>div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.18)}}
@media(max-width:620px){.about-capability-hero-v49{padding:54px 0}.about-capability-image-v49,.about-capability-image-v49 img{min-height:320px}.about-proof-grid-v49,.about-value-grid-v49{grid-template-columns:1fr}.about-proof-grid-v49>div,.about-value-grid-v49>div{border-right:0!important;border-bottom:1px solid rgba(255,255,255,.18)}.about-proof-grid-v49>div:last-child,.about-value-grid-v49>div:last-child{border-bottom:0}.about-founder-photo-v49{max-width:180px}.about-capability-tag-v49 span{display:block}}
/* =========================================================
V50 — unified responsive system
One header architecture, readable nav, mobile-safe pages.
========================================================= */
html{
margin:0!important;
padding:0!important;
width:100%!important;
max-width:100%!important;
overflow-x:hidden!important;
background:#0D174D!important;
-webkit-text-size-adjust:100%;
}
body{
margin:0!important;
padding-top:0!important;
width:100%!important;
max-width:100%!important;
overflow-x:hidden!important;
}
body>*{max-width:100%}
main,header,footer,section{min-width:0;max-width:100%}
img,svg,video{max-width:100%;height:auto}
.wrap{width:min(1180px,90vw)!important;max-width:1180px!important;min-width:0!important}
/* Eliminate the visible top-edge line and colour the iPhone safe area. */
.top{
margin:0!important;
border-top:0!important;
top:0!important;
background:#0D174D!important;
padding-top:env(safe-area-inset-top,0px)!important;
}
.topcontacts{display:none!important}
/* Desktop / landscape tablet: complete readable menu. */
@media (min-width:1000px){
.top .topin{
width:min(1420px,96vw)!important;
max-width:1420px!important;
height:88px!important;
min-height:88px!important;
display:flex!important;
align-items:center!important;
gap:18px!important;
margin:0 auto!important;
}
.top .brand.brandtype{
display:flex!important;
flex:0 0 118px!important;
width:118px!important;
max-width:118px!important;
height:60px!important;
margin:0!important;
overflow:visible!important;
}
.top .brand.brandtype .brandart{
width:118px!important;
max-width:118px!important;
height:56px!important;
max-height:56px!important;
object-fit:contain!important;
object-position:left center!important;
}
.top .menuBtn{display:none!important}
.top .nav{
display:flex!important;
position:static!important;
flex:1 1 auto!important;
min-width:0!important;
margin:0 0 0 auto!important;
padding:0!important;
align-items:center!important;
justify-content:flex-end!important;
flex-direction:row!important;
gap:13px!important;
white-space:nowrap!important;
overflow:visible!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
}
.top .nav>a,.top .nav .navdrop{
display:inline-flex!important;
align-items:center!important;
width:auto!important;
margin:0!important;
padding:10px 1px!important;
font-size:13px!important;
line-height:1.1!important;
font-weight:800!important;
white-space:nowrap!important;
color:#fff!important;
background:transparent!important;
border:0!important;
text-align:center!important;
}
.top .nav .walink{
color:#B0BC70!important;
border:1px solid #B0BC70!important;
padding:10px 10px!important;
}
.top .navgroup{width:auto!important;position:relative!important;min-width:0!important}
.top .dropdown{
display:none!important;
position:absolute!important;
top:100%!important;
left:0!important;
width:max-content!important;
min-width:230px!important;
padding:10px 0!important;
background:#0D174D!important;
border:1px solid rgba(255,255,255,.16)!important;
box-shadow:0 18px 32px rgba(0,0,0,.22)!important;
z-index:30!important;
}
.top .navgroup:hover .dropdown,.top .navgroup.open .dropdown{display:block!important}
.top .dropdown a{
display:block!important;
padding:11px 15px!important;
font-size:12.5px!important;
line-height:1.25!important;
text-align:left!important;
white-space:nowrap!important;
color:#fff!important;
}
}
/* Keep full menu at 1000–1149 without making the text microscopic. */
@media (min-width:1000px) and (max-width:1149px){
.top .topin{width:97vw!important;gap:12px!important}
.top .brand.brandtype{flex-basis:105px!important;width:105px!important;max-width:105px!important}
.top .brand.brandtype .brandart{width:105px!important;max-width:105px!important}
.top .nav{gap:9px!important}
.top .nav>a,.top .nav .navdrop{font-size:12px!important}
.top .nav .walink{display:none!important}
}
/* Phone / portrait tablet: intentional burger navigation. */
@media (max-width:999px){
.top{margin-bottom:0!important}
.top .topin{
width:92vw!important;
height:78px!important;
min-height:78px!important;
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:14px!important;
margin:0 auto!important;
position:relative!important;
}
.top .brand.brandtype{
display:flex!important;
flex:0 0 112px!important;
width:112px!important;
max-width:112px!important;
height:52px!important;
margin:0!important;
overflow:visible!important;
}
.top .brand.brandtype .brandart{
width:112px!important;
max-width:112px!important;
height:50px!important;
max-height:50px!important;
object-fit:contain!important;
}
.top .menuBtn{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
margin:0 0 0 auto!important;
padding:11px 14px!important;
font-size:12px!important;
line-height:1!important;
font-weight:900!important;
letter-spacing:.05em!important;
color:#fff!important;
background:transparent!important;
border:1px solid rgba(255,255,255,.45)!important;
}
.top .nav{display:none!important}
.top .nav.open{
display:flex!important;
position:absolute!important;
left:0!important;
right:0!important;
top:100%!important;
width:100%!important;
max-width:100%!important;
max-height:calc(100dvh - 78px - env(safe-area-inset-top,0px))!important;
overflow-y:auto!important;
margin:0!important;
padding:14px 5vw 24px!important;
flex-direction:column!important;
align-items:stretch!important;
gap:0!important;
white-space:normal!important;
background:#0D174D!important;
border-top:1px solid rgba(255,255,255,.14)!important;
box-shadow:0 18px 38px rgba(0,0,0,.25)!important;
z-index:50!important;
}
.top .nav.open>a,.top .nav.open .navdrop{
display:block!important;
width:100%!important;
padding:14px 0!important;
font-size:15px!important;
line-height:1.2!important;
text-align:left!important;
white-space:normal!important;
color:#fff!important;
}
.top .navgroup{width:100%!important;min-width:0!important}
.top .dropdown{
position:static!important;
width:100%!important;
min-width:0!important;
max-width:100%!important;
box-shadow:none!important;
}
.top .dropdown a{white-space:normal!important;overflow-wrap:anywhere!important}
}
/* Homepage feature strip — actual semantic icons, clean mobile stack. */
.approved-strip-v45{
background:#07143f!important;
border-top:0!important;
border-bottom:1px solid rgba(176,188,112,.28)!important;
}
.approved-strip-v45 .trustgrid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.approved-strip-v45 .trustgrid>div{
position:relative!important;
min-width:0!important;
min-height:142px!important;
padding:25px 24px 25px 62px!important;
display:flex!important;
flex-direction:column!important;
justify-content:center!important;
border-right:1px solid rgba(255,255,255,.18)!important;
}
.approved-strip-v45 .trustgrid>div:last-child{border-right:0!important}
.approved-strip-v45 .trusticon{position:absolute!important;left:19px!important;top:27px!important;width:30px!important;height:30px!important}
.approved-strip-v45 .trusticon svg{width:30px!important;height:30px!important;stroke:#B0BC70!important;fill:none!important;stroke-width:1.8!important}
.approved-strip-v45 b{color:#fff!important;font-size:14px!important;line-height:1.2!important}
.approved-strip-v45 .trustgrid>div>span:last-child{color:#e8ebf4!important;font-size:12px!important;line-height:1.5!important;margin-top:8px!important}
/* Universal grid and content safety — fixes the pages that were wider than phones. */
.subhero,.subheroCopy,.subheroMedia,.split,.grid3,.grid4,.tile,
.product-detail-grid,.product-choice-grid,.product-choice,.product-copy,
.contact-layout,.contactform,.contactform .form-row,.contactform .field,
.delivery-mosaic,.brand-showcase-v38,.about-capability-grid-v49,
.about-founder-grid-v49,.about-proof-grid-v49,.about-value-grid-v49,
.servicePhotos,.twocol,.advicegrid,.reviewgrid,.productrow,.venueFeature,
.areaCards,.footgrid,.callout .wrap{
min-width:0!important;
max-width:100%!important;
}
input,select,textarea,button{max-width:100%!important}
p,h1,h2,h3,h4,a,span,li,label{overflow-wrap:break-word}
@media (max-width:760px){
.wrap{width:90vw!important}
.section{padding:64px 0!important}
.subhero,.split,.grid3,.grid4,.product-detail-grid,.product-choice-grid,
.contact-layout,.servicePhotos,.twocol,.advicegrid,.reviewgrid,.productrow,
.venueFeature,.areaCards,.footgrid,.about-capability-grid-v49,
.about-founder-grid-v49,.about-proof-grid-v49,.about-value-grid-v49{
grid-template-columns:minmax(0,1fr)!important;
}
.subhero{min-height:0!important}
.subheroCopy{padding:52px 0!important}
.subheroCopy .wrap{width:90vw!important;margin:0 auto!important}
.subhero h1{font-size:clamp(40px,12vw,52px)!important;line-height:.94!important}
.subhero p,.lead{font-size:17px!important}
.subheroMedia,.subheroMedia img{min-height:0!important;max-height:none!important}
.subheroMedia img{width:100%!important;height:auto!important;aspect-ratio:4/3!important;object-fit:cover!important}
.section h2,.eventCard h2,.venueCopy h2,.reviewSection h2,.finalCopy h2,
.about-founder-copy-v49 h2{font-size:clamp(40px,12vw,52px)!important;line-height:.94!important}
.hero h1,.about-capability-copy-v49 h1{font-size:clamp(46px,14vw,60px)!important}
.contactform{padding:24px 18px!important}
.contactform .form-row{grid-template-columns:minmax(0,1fr)!important;gap:15px!important}
.contact-details{position:static!important}
.delivery-mosaic{grid-template-columns:minmax(0,1fr)!important;gap:9px!important}
.delivery-mosaic figure,.delivery-mosaic figure:nth-child(n){grid-column:1!important;min-height:220px!important}
.brand-showcase-v38{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.about-capability-image-v49,.about-capability-image-v49 img{min-height:300px!important}
.about-founder-photo-v49{justify-self:start!important;max-width:180px!important}
.about-team-card-v49{justify-self:stretch!important;max-width:none!important}
.eventCard{left:5vw!important;right:5vw!important;width:auto!important;max-width:90vw!important;padding:28px!important}
.finalCopy{left:5vw!important;right:5vw!important;max-width:90vw!important}
.venueCopy{padding:58px 5vw!important}
.approved-strip-v45 .trustgrid{grid-template-columns:minmax(0,1fr)!important}
.approved-strip-v45 .trustgrid>div{border-right:0!important;border-bottom:1px solid rgba(255,255,255,.18)!important;min-height:118px!important}
.approved-strip-v45 .trustgrid>div:last-child{border-bottom:0!important}
}
@media (max-width:520px){
body{padding-bottom:54px!important}
.brand-showcase-v38{grid-template-columns:minmax(0,1fr)!important}
.servicePhoto{height:470px!important}
.servicePhoto h3{font-size:34px!important}
.hero{min-height:720px!important}
.heroCopy{padding-bottom:48px!important}
.heroActions{width:100%!important}
.heroActions .btn{max-width:100%!important}
.weird{padding:28px!important}
.weird span{font-size:25px!important}
}
/* V51 — visual homepage product cards */
.productrow-v51{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:22px!important;
align-items:stretch!important;
}
.productrow-v51 .productcard-v51{
display:flex!important;
flex-direction:column!important;
padding:0!important;
overflow:hidden!important;
min-height:100%!important;
background:#fff!important;
border:1px solid rgba(13,23,77,.12)!important;
text-decoration:none!important;
box-shadow:0 12px 28px rgba(13,23,77,.08)!important;
}
.productimage-v51{
position:relative;
aspect-ratio:4/3;
overflow:hidden;
background:#f4f5f0;
}
.productimage-v51 img{
width:100%!important;
height:100%!important;
object-fit:cover!important;
object-position:center!important;
display:block!important;
transition:transform .25s ease;
}
.productcard-v51:hover .productimage-v51 img{transform:scale(1.025)}
.productcopy-v51{
display:flex;
flex-direction:column;
gap:8px;
padding:20px 20px 22px;
flex:1;
}
.productcopy-v51 span{
font:700 12px/1.1 Arial,sans-serif!important;
letter-spacing:.12em;
color:#7d8849!important;
}
.productcopy-v51 b{
font-size:clamp(19px,1.5vw,24px)!important;
line-height:1.05!important;
color:#0D174D!important;
}
.productcopy-v51 small{
display:block!important;
font-size:15px!important;
line-height:1.45!important;
color:#3e465f!important;
flex:1;
}
.productcopy-v51 strong{
margin-top:7px;
font-size:12px;
letter-spacing:.06em;
color:#0D174D;
}
@media(max-width:760px){
.productrow-v51{grid-template-columns:1fr!important;gap:18px!important}
.productimage-v51{aspect-ratio:16/10}
.productcopy-v51{padding:18px 18px 20px}
.productcopy-v51 b{font-size:22px!important}
}
/* V52 — homepage hero motion. Deliberately subtle: movement without turning the hero into a slideshow. */
.hero .heroimg{transform:scale(1.035);animation:heroCinematicV52 14s ease-in-out infinite alternate;will-change:transform}
.hero .shade{animation:heroShadeV52 9s ease-in-out infinite alternate;will-change:opacity,background}
.hero-title-v52 span{display:block;opacity:0;transform:translateY(24px);animation:heroTitleInV52 .8s cubic-bezier(.2,.75,.25,1) forwards}
.hero-title-v52 span:nth-child(2){animation-delay:.22s;color:#fff}
.hero .eyebrow{opacity:0;animation:heroFadeV52 .65s ease .05s forwards}
.heroCopy>p,.heroActions,.heroMeta{opacity:0;animation:heroFadeUpV52 .7s ease forwards}
.heroCopy>p{animation-delay:.48s}.heroActions{animation-delay:.62s}.heroMeta{animation-delay:.88s}
.hero-punch-v52{margin-top:26px;min-height:24px;color:var(--green);font-size:13px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;opacity:0;animation:heroFadeUpV52 .7s ease .76s forwards}
.hero-punch-v52 span{display:inline-block;transition:opacity .28s ease,transform .28s ease}
.hero-punch-v52 span.changing{opacity:0;transform:translateY(7px)}
.heroActions .btn:first-child{position:relative;overflow:hidden}
.heroActions .btn:first-child:after{content:"";position:absolute;top:-30%;bottom:-30%;width:38%;left:-55%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);transform:skewX(-18deg);animation:heroSheenV52 5.8s ease-in-out 2s infinite;pointer-events:none}
.hero-scroll-v52{position:absolute;right:0;bottom:30px;color:#fff;text-decoration:none;display:flex;align-items:center;gap:10px;font-size:9px;font-weight:900;letter-spacing:.18em;opacity:.72}
.hero-scroll-v52 i{display:block;width:1px;height:34px;background:rgba(255,255,255,.55);position:relative;overflow:hidden}
.hero-scroll-v52 i:after{content:"";position:absolute;left:0;top:-14px;width:1px;height:14px;background:var(--green);animation:heroScrollV52 1.8s ease-in-out infinite}
@keyframes heroCinematicV52{0%{transform:scale(1.035) translate3d(0,0,0)}100%{transform:scale(1.105) translate3d(-1.1%,.5%,0)}}
@keyframes heroShadeV52{0%{opacity:.94}100%{opacity:1}}
@keyframes heroTitleInV52{to{opacity:1;transform:translateY(0)}}
@keyframes heroFadeV52{to{opacity:1}}
@keyframes heroFadeUpV52{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes heroSheenV52{0%,68%{left:-55%}88%,100%{left:130%}}
@keyframes heroScrollV52{0%{transform:translateY(0)}100%{transform:translateY(52px)}}
@media(max-width:620px){
.hero .heroimg{animation-duration:18s;transform:scale(1.04)}
.hero-punch-v52{font-size:11px;letter-spacing:.09em;margin-top:20px}
.hero-scroll-v52{display:none}
}
@media(prefers-reduced-motion:reduce){
.hero .heroimg,.hero .shade,.hero-title-v52 span,.hero .eyebrow,.heroCopy>p,.heroActions,.heroMeta,.hero-punch-v52,.heroActions .btn:first-child:after,.hero-scroll-v52 i:after{animation:none!important;transition:none!important}
.hero-title-v52 span,.hero .eyebrow,.heroCopy>p,.heroActions,.heroMeta,.hero-punch-v52{opacity:1!important;transform:none!important}
.hero .heroimg{transform:none!important}
}
/* V54 — personality-led About page */
.about54-hero{background:#f5f4ef;padding:72px 0 64px}.about54-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:54px;align-items:center}.about54-copy h1{font-size:clamp(42px,5.2vw,78px);line-height:.96;margin:12px 0 26px;color:#0D174D}.about54-copy h1 em,.about54-title em,.about54-proof h2 em,.about54-final em{color:#7e8b43;font-style:normal}.about54-lead{font-size:1.28rem;line-height:1.55;color:#0D174D}.about54-hero-image{position:relative}.about54-hero-image img{width:100%;display:block;aspect-ratio:4/3;object-fit:cover}.about54-statement{background:#0D174D;color:white;padding:62px 0;text-align:center}.about54-statement p{font-family:Audiowide,sans-serif;color:#B0BC70;letter-spacing:.05em}.about54-statement p em{color:white;font-style:normal}.about54-statement h2{max-width:950px;margin:12px auto 0;font-size:clamp(30px,4vw,58px);line-height:1.03}.about54-title{text-align:center;max-width:900px;margin:0 auto 40px}.about54-title h2,.about54-proof h2{font-size:clamp(34px,4vw,58px);line-height:1.04;color:#0D174D}.about54-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.about54-grid article{border-top:5px solid #B0BC70;background:#f5f4ef;padding:30px}.about54-grid article span{font-family:Audiowide,sans-serif;color:#7e8b43;font-size:13px}.about54-grid h3{color:#0D174D;font-size:22px;margin:10px 0}.about54-grid p{margin:0;line-height:1.6}.about54-vanband{background:#0D174D;color:white;padding:72px 0}.about54-van-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:52px;align-items:center}.about54-van-grid img{width:100%;height:440px;object-fit:cover}.about54-van-copy h2{font-size:clamp(34px,4vw,56px);line-height:1;color:#B0BC70}.about54-van-copy p{font-size:1.08rem;line-height:1.65}.about54-proof{text-align:center}.about54-photo-grid{display:grid;grid-template-columns:1.1fr .9fr 1fr;gap:12px;margin:34px 0 24px}.about54-photo-grid img{width:100%;height:330px;object-fit:cover}.about54-proofline{font-size:1.2rem;color:#0D174D;max-width:900px;margin:auto}.about54-owner{background:#B0BC70;padding:56px 0;color:#0D174D}.about54-owner-inner{display:grid;grid-template-columns:.75fr 1.25fr;gap:50px;align-items:start}.about54-owner h2{font-size:clamp(34px,4vw,56px);margin:8px 0}.about54-owner p{font-size:1.08rem;line-height:1.65;margin-top:0}.about54-final{text-align:center;background:#f5f4ef;padding:72px 0}.about54-final p{font-family:Audiowide,sans-serif;color:#0D174D}.about54-final h2{font-size:clamp(40px,5vw,70px);line-height:.98;color:#0D174D;margin:14px 0 30px}
@media(max-width:800px){.about54-hero{padding:42px 0}.about54-hero-grid,.about54-van-grid,.about54-owner-inner{grid-template-columns:1fr;gap:28px}.about54-grid{grid-template-columns:1fr}.about54-photo-grid{grid-template-columns:1fr 1fr}.about54-photo-grid img{height:240px}.about54-photo-grid img:first-child{grid-column:1/-1}.about54-van-grid img{height:300px}}
/* V55 prominent review story */
.reviews55{background:#0D174D;color:#fff;padding:105px 0;overflow:hidden}.reviews55-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:8vw;align-items:center}.reviews55 h2{font-size:clamp(48px,5vw,76px);line-height:.91;letter-spacing:-.05em;margin:16px 0 24px}.reviews55 h2 em{font-style:normal;color:#B0BC70}.reviews55-intro p{font-size:18px;line-height:1.6;color:#dfe4ef;max-width:480px}.reviews55-intro>a{display:inline-block;margin-top:18px;color:#B0BC70;text-decoration:none;font-size:12px;font-weight:900;border-bottom:1px solid #B0BC70;padding-bottom:5px}.reviews55-stage{position:relative;min-height:380px;border-left:1px solid rgba(176,188,112,.55);padding-left:7vw}.review55{position:absolute;inset:0 0 0 7vw;opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease;pointer-events:none;display:flex;flex-direction:column;justify-content:center}.review55.active{opacity:1;transform:none}.review55 .stars{color:#B0BC70;font-size:28px;letter-spacing:.13em;margin-bottom:24px}.review55 blockquote{margin:0;max-width:650px;font-size:clamp(28px,3vw,45px);font-weight:800;line-height:1.16;letter-spacing:-.025em}.review55 span{margin-top:28px;color:#B0BC70;font-size:11px;font-weight:900;letter-spacing:.16em}@media(max-width:800px){.reviews55{padding:75px 0}.reviews55-grid{grid-template-columns:1fr;gap:50px}.reviews55-stage{min-height:390px;border-left:0;border-top:1px solid rgba(176,188,112,.55);padding:35px 0 0}.review55{inset:35px 0 0}.review55 blockquote{font-size:30px}}@media(prefers-reduced-motion:reduce){.review55{transition:none}}
/* =========================================================
V57 — mobile compact pass
Keep the information; lose the endless phone scroll.
========================================================= */
@media (max-width:760px){
.wrap{width:91vw!important}
.section{padding:42px 0!important}
.subheroCopy{padding:34px 0!important}
.subhero h1{font-size:clamp(34px,10.8vw,44px)!important;margin:10px 0 14px!important}
.subhero p,.lead{font-size:15px!important;line-height:1.48!important}
.subheroMedia img{aspect-ratio:16/9!important}
.section h2,.eventCard h2,.venueCopy h2,.reviewSection h2,.finalCopy h2,.about-founder-copy-v49 h2{font-size:clamp(32px,9.8vw,42px)!important;line-height:.98!important;margin-top:10px!important;margin-bottom:16px!important}
.eyebrow{font-size:9.5px!important;letter-spacing:.13em!important}
.grid3{gap:10px!important}
.tile{padding:18px!important}
.tile h3{font-size:19px!important;margin-bottom:7px!important}
.tile p,.personality p{font-size:14px!important;line-height:1.45!important}
.personality{padding:18px!important;margin-top:14px!important}
/* Four service promises become a neat 2 x 2 summary instead of four tall rows. */
.approved-strip-v45 .trustgrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.approved-strip-v45 .trustgrid>div{min-height:88px!important;padding:16px 12px 14px 52px!important;border-right:1px solid rgba(255,255,255,.18)!important}
.approved-strip-v45 .trustgrid>div:nth-child(2n){border-right:0!important}
.approved-strip-v45 .trusticon{left:14px!important;top:18px!important;width:25px!important;height:25px!important}
.approved-strip-v45 .trusticon svg{width:25px!important;height:25px!important}
.approved-strip-v45 b{font-size:11.5px!important}
.approved-strip-v45 .trustgrid>div>span:last-child{display:none!important}
/* Real-work photography stays visible but no longer becomes a one-photo-per-screen gallery. */
.delivery-mosaic{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}
.delivery-mosaic figure,.delivery-mosaic figure:nth-child(n){grid-column:auto!important;min-height:0!important;height:132px!important}
.delivery-mosaic img{width:100%!important;height:100%!important;object-fit:cover!important}
.servicePhoto{height:360px!important}
.servicePhoto>div{left:6%!important;right:6%!important;bottom:6%!important}
.servicePhoto h3{font-size:30px!important;margin:6px 0 8px!important}
.servicePhoto p{font-size:14px!important;line-height:1.42!important}
.venueCopy{padding:40px 5vw!important}
.eventCard{padding:22px!important}
.eventCard p,.venueCopy p,.reviewgrid p,.finalCopy p{font-size:15px!important;line-height:1.48!important}
.hero{min-height:640px!important}
.hero h1{font-size:clamp(42px,12vw,54px)!important}
.heroCopy>p{font-size:15px!important;line-height:1.45!important}
.heroMeta{display:none!important}
/* About: same story, deliberately edited for a phone. */
.about54-hero{padding:34px 0 28px!important}
.about54-hero-grid,.about54-van-grid,.about54-owner-inner{gap:20px!important}
.about54-copy h1{font-size:clamp(37px,11vw,48px)!important;margin:9px 0 16px!important}
.about54-lead{font-size:16px!important;line-height:1.48!important;margin-bottom:0!important}
.about54-copy>p:not(.about54-lead){display:none!important}
.about54-hero-image img{aspect-ratio:16/9!important}
.about54-statement{padding:34px 0!important}
.about54-statement p{font-size:10px!important;margin:0 0 8px!important}
.about54-statement h2{font-size:clamp(26px,8vw,34px)!important;line-height:1.04!important}
.about54-title{margin-bottom:18px!important}
.about54-title h2,.about54-proof h2{font-size:clamp(29px,8.8vw,38px)!important;margin:8px 0 14px!important}
.about54-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
.about54-grid article{padding:15px!important;border-top-width:3px!important}
.about54-grid article span{font-size:9px!important}
.about54-grid h3{font-size:15px!important;line-height:1.1!important;margin:6px 0!important}
.about54-grid p{font-size:12px!important;line-height:1.36!important}
.about54-vanband{padding:38px 0!important}
.about54-van-grid img{height:210px!important}
.about54-van-copy h2{font-size:34px!important;margin:8px 0 12px!important}
.about54-van-copy p{font-size:14px!important;line-height:1.45!important;margin:8px 0!important}
.about54-van-copy p:last-child{margin-bottom:0!important}
.about54-photo-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important;margin:18px 0 14px!important}
.about54-photo-grid img,.about54-photo-grid img:first-child{grid-column:auto!important;height:112px!important}
.about54-proofline{font-size:14px!important;line-height:1.45!important}
.about54-owner{padding:34px 0!important}
.about54-owner h2{font-size:clamp(29px,8.8vw,38px)!important;line-height:1!important;margin:6px 0!important}
.about54-owner p{font-size:14px!important;line-height:1.45!important;margin:0 0 9px!important}
.about54-owner p:nth-child(2){display:none!important}
.about54-final{padding:42px 0!important}
.about54-final h2{font-size:clamp(34px,10vw,44px)!important;margin:9px 0 20px!important}
.reviews55{padding:42px 0!important}
.reviews55-grid{gap:24px!important}
.reviews55 h2{font-size:clamp(34px,10vw,44px)!important;margin:9px 0 13px!important}
.reviews55-intro p{display:none!important}
.reviews55-intro>a{margin-top:7px!important}
.reviews55-stage{min-height:245px!important;padding-top:20px!important}
.review55{inset:20px 0 0!important}
.review55 .stars{font-size:21px!important;margin-bottom:12px!important}
.review55 blockquote{font-size:clamp(20px,6.1vw,25px)!important;line-height:1.16!important}
.review55 span{margin-top:14px!important;font-size:9px!important}
.productrow-v51{gap:10px!important}
.productimage-v51{aspect-ratio:16/8!important}
.productcopy-v51{padding:14px 15px 16px!important;gap:5px!important}
.productcopy-v51 small{font-size:13px!important;line-height:1.38!important}
.areaCards{gap:9px!important;margin-top:20px!important}
.areaCards a{min-height:128px!important;padding:18px!important}
.areaCards b{font-size:23px!important}
.areaCards span{font-size:12.5px!important;line-height:1.4!important}
.footer{padding:38px 0 72px!important}
.footgrid{gap:24px!important}
}
@media (max-width:420px){
.about54-grid{grid-template-columns:1fr!important}
.about54-grid article{display:grid!important;grid-template-columns:28px 1fr!important;column-gap:7px!important;align-items:start!important}
.about54-grid article span{grid-row:1/3!important;padding-top:3px!important}
.about54-grid article h3{margin-top:0!important}
.about54-grid article p{grid-column:2!important}
}
/* =========================================================
V134 — mobile menu portal + fixed-action clearance
Kept last so no historical responsive rule can override it.
========================================================= */
@media(max-width:900px){
.top,.top .topin{overflow:visible!important;contain:none!important}
body.mobile-nav-open{overflow:hidden!important}
body>.mobile-nav-panel{display:none!important}
body>.mobile-nav-panel.open{
display:flex!important;
position:fixed!important;
z-index:2000!important;
top:84px!important;
right:0!important;
bottom:0!important;
left:0!important;
width:100vw!important;
min-width:0!important;
max-width:100vw!important;
height:auto!important;
max-height:none!important;
margin:0!important;
padding:10px max(20px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left))!important;
overflow-x:hidden!important;
overflow-y:auto!important;
overscroll-behavior:contain!important;
flex-direction:column!important;
align-items:stretch!important;
justify-content:flex-start!important;
gap:0!important;
background:#0D174D!important;
border-top:1px solid rgba(255,255,255,.14)!important;
box-shadow:0 18px 38px rgba(0,0,0,.25)!important;
box-sizing:border-box!important;
}
body>.mobile-nav-panel.open>a,
body>.mobile-nav-panel.open .navdrop{
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
width:100%!important;
min-width:0!important;
max-width:100%!important;
margin:0!important;
padding:14px 2px!important;
border:0!important;
border-bottom:1px solid rgba(255,255,255,.13)!important;
background:transparent!important;
color:#fff!important;
text-align:left!important;
text-decoration:none!important;
font-size:15px!important;
line-height:1.25!important;
white-space:nowrap!important;
box-sizing:border-box!important;
}
body>.mobile-nav-panel.open .navgroup{
position:static!important;
display:block!important;
width:100%!important;
min-width:0!important;
max-width:100%!important;
margin:0!important;
padding:0!important;
}
body>.mobile-nav-panel.open .dropdown,
body>.mobile-nav-panel.open .navgroup:hover .dropdown,
body>.mobile-nav-panel.open .navgroup:focus-within .dropdown{
display:none!important;
position:static!important;
inset:auto!important;
transform:none!important;
width:100%!important;
min-width:0!important;
max-width:100%!important;
margin:0!important;
padding:5px 0 8px 15px!important;
border:0!important;
border-left:2px solid #B0BC70!important;
background:rgba(255,255,255,.045)!important;
box-shadow:none!important;
box-sizing:border-box!important;
}
body>.mobile-nav-panel.open .navgroup.open>.dropdown{display:block!important}
body>.mobile-nav-panel.open .dropdown a{
display:block!important;
width:100%!important;
min-width:0!important;
max-width:100%!important;
margin:0!important;
padding:11px 12px!important;
color:#fff!important;
text-decoration:none!important;
font-size:14px!important;
line-height:1.3!important;
white-space:normal!important;
overflow-wrap:normal!important;
word-break:normal!important;
box-sizing:border-box!important;
}
body>.mobile-nav-panel.open .navdrop span{margin-left:12px!important;transition:transform .2s ease!important}
body>.mobile-nav-panel.open .navgroup.open>.navdrop span{transform:rotate(180deg)!important}
.floating-wa-v65{display:none!important}
body{padding-bottom:calc(72px + env(safe-area-inset-bottom))!important}
}
@media(max-width:800px){
.heroCopy{padding-bottom:calc(96px + env(safe-area-inset-bottom))!important}
.hero-review-mobile{margin-bottom:0!important}
}
@media(max-width:420px){
body>.mobile-nav-panel.open{top:78px!important}
.heroCopy{padding-bottom:calc(92px + env(safe-area-inset-bottom))!important}
}
/* V58 — Brands page: verified external marks with zero broken-image UI */
.brand-showcase-v58{align-items:stretch}
.genuine-logo-v58{position:relative;overflow:hidden;background:#fff;min-height:118px;display:flex;align-items:center;justify-content:center;padding:18px}
.genuine-logo-v58 img{position:absolute;inset:14px;width:calc(100% - 28px);height:calc(100% - 28px);object-fit:contain;display:block}
.logo-text-fallback-v58{display:flex;align-items:center;justify-content:center;text-align:center;width:100%;height:100%;font-weight:800;letter-spacing:.02em;color:#0D174D;padding:8px}
.text-logo-v58{min-height:118px;display:flex;align-items:center;justify-content:center;text-align:center;padding:18px}
@media(max-width:760px){
.brand-showcase-v58{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.genuine-logo-v58,.text-logo-v58{min-height:82px;padding:10px}
.genuine-logo-v58 img{inset:10px;width:calc(100% - 20px);height:calc(100% - 20px)}
.logo-text-fallback-v58,.text-logo-v58 span{font-size:12px;line-height:1.2}
}
/* V62 — tablet/iPad visual pass + tighter mobile density */
/* Headings should wrap by words, never split words across lines. */
h1,h2,h3,h4{overflow-wrap:normal!important;word-break:normal!important;hyphens:none!important}
/* iPad / tablet landscape and portrait: deliberate safe gutters, balanced type, less dead space. */
@media (min-width:761px) and (max-width:1180px){
.wrap{width:auto!important;max-width:none!important;margin-left:clamp(34px,5vw,64px)!important;margin-right:clamp(34px,5vw,64px)!important}
.section{padding:64px 0!important}
.subheroCopy{padding:52px 0!important}
.subheroCopy .wrap{width:auto!important;margin-left:clamp(34px,5vw,64px)!important;margin-right:clamp(34px,5vw,64px)!important}
.subhero h1{font-size:clamp(42px,6vw,64px)!important;line-height:.95!important;letter-spacing:-.04em!important}
.subhero p,.lead{font-size:16px!important;line-height:1.52!important}
.split{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)!important;gap:clamp(36px,6vw,72px)!important}
.section h2,.eventCard h2,.venueCopy h2,.reviewSection h2,.finalCopy h2,.advice h2,.products h2,.brandproof h2{font-size:clamp(38px,5.2vw,58px)!important;line-height:.94!important;letter-spacing:-.045em!important}
.section.navy .split h2,.section.cream .split h2,.section.white .split h2{font-size:clamp(38px,5vw,56px)!important;max-width:10.5ch!important}
.tile{padding:24px!important}
.tile p{font-size:15px!important;line-height:1.5!important}
.grid3,.grid4{gap:14px!important}
.grid4{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.about54-hero-grid,.about54-van-grid,.about54-owner-inner{gap:36px!important}
.about54-copy h1{font-size:clamp(44px,6vw,62px)!important}
.about54-grid{gap:12px!important}
.about54-grid article{padding:22px!important}
.about54-photo-grid img{height:230px!important}
.about54-van-grid img{height:340px!important}
.reviews55{padding:70px 0!important}
.reviews55 h2{font-size:clamp(40px,5.4vw,58px)!important}
.reviews55-stage{min-height:300px!important}
.review55 blockquote{font-size:clamp(24px,3.3vw,34px)!important}
.callout .wrap,.footer .wrap{margin-left:clamp(34px,5vw,64px)!important;margin-right:clamp(34px,5vw,64px)!important}
.callout{padding-left:0!important;padding-right:0!important}
}
/* Phone: keep the information, but make it denser and easier to scan. */
@media (max-width:760px){
.wrap{width:auto!important;margin-left:22px!important;margin-right:22px!important}
.section{padding:38px 0!important}
.subheroCopy{padding:30px 0!important}
.subheroCopy .wrap{width:auto!important;margin-left:22px!important;margin-right:22px!important}
.subhero h1{font-size:clamp(34px,10vw,43px)!important;line-height:.95!important}
.subhero p,.lead{font-size:14.5px!important;line-height:1.46!important}
.section h2,.eventCard h2,.venueCopy h2,.reviewSection h2,.finalCopy h2,.advice h2,.products h2,.brandproof h2{font-size:clamp(30px,9.2vw,39px)!important;line-height:.98!important}
.split{gap:18px!important}
.split>div+div p{margin-top:0!important;margin-bottom:10px!important}
.grid3,.grid4{gap:8px!important}
.tile{padding:15px!important}
.tile h3{font-size:17px!important;margin:0 0 7px!important}
.tile p{font-size:13px!important;line-height:1.42!important;margin:0!important}
.personality{padding:15px!important;margin-top:14px!important}
.personality p{font-size:13px!important;line-height:1.42!important;margin-bottom:0!important}
.delivery-mosaic{margin-top:18px!important}
.delivery-mosaic figure,.delivery-mosaic figure:nth-child(n){min-height:118px!important}
.delivery-mosaic img{min-height:118px!important;max-height:180px!important}
.callout{padding:20px 0!important}
.callout .wrap{margin-left:22px!important;margin-right:22px!important;gap:12px!important}
.callout strong{font-size:16px!important;line-height:1.25!important}
.footer{padding-top:34px!important}
.footer .wrap{margin-left:22px!important;margin-right:22px!important}
.footgrid{gap:22px!important}
.about54-grid article p{font-size:11.5px!important;line-height:1.34!important}
.about54-van-copy p,.about54-owner p{font-size:13px!important;line-height:1.42!important}
.reviews55{padding:38px 0!important}
.reviews55-grid{gap:24px!important}
.reviews55-stage{min-height:225px!important}
.review55 blockquote{font-size:clamp(20px,6vw,25px)!important;line-height:1.15!important}
.review55 .stars{font-size:19px!important;margin-bottom:12px!important}
.review55 span{margin-top:15px!important}
}
/* V64 — iPad breathing room, clearer top control, stronger home hero movement */
.back-to-top-v46{
width:auto!important;
min-width:126px!important;
height:48px!important;
padding:0 18px!important;
border-radius:999px!important;
gap:8px!important;
font-size:13px!important;
font-family:Arial,sans-serif!important;
letter-spacing:.01em!important;
white-space:nowrap!important;
}
.back-to-top-v46 .backtop-arrow-v64{font-size:20px;line-height:1;font-weight:900}
.back-to-top-v46 .backtop-label-v64{font-size:12px;line-height:1;font-weight:900;text-transform:uppercase;letter-spacing:.06em}
@media(max-width:620px){
.back-to-top-v46{right:14px!important;bottom:72px!important;min-width:112px!important;height:44px!important;padding:0 14px!important}
.back-to-top-v46 .backtop-label-v64{font-size:11px}
}
/* A little more cinematic movement without becoming distracting. */
.hero .heroimg{animation-duration:8s!important;transform:scale(1.04)}
@keyframes heroCinematicV64{
0%{transform:scale(1.04) translate3d(0,0,0)}
100%{transform:scale(1.16) translate3d(-2.2%,1.1%,0)}
}
.hero .heroimg{animation-name:heroCinematicV64!important}
@media(max-width:820px){.hero .heroimg{animation-duration:10s!important}}
@media(prefers-reduced-motion:reduce){.hero .heroimg{animation:none!important;transform:none!important}}
/* More deliberate tablet gutters. */
@media (min-width:761px) and (max-width:1180px){
.wrap,.subheroCopy .wrap,.callout .wrap,.footer .wrap{
margin-left:clamp(48px,6vw,76px)!important;
margin-right:clamp(48px,6vw,76px)!important;
}
}
/* V131 — allow the expanded genuine Google review carousel to breathe. */
.home-review-rotator{min-height:76px!important}
@media(max-width:800px){
.home-review-rotator{min-height:118px!important}
}
/* iPad Pro landscape can report a CSS viewport up to 1366px and was falling into desktop rules. */
@media (min-width:1181px) and (max-width:1366px) and (hover:none) and (pointer:coarse){
.wrap,.subheroCopy .wrap,.callout .wrap,.footer .wrap{
width:auto!important;
max-width:none!important;
margin-left:72px!important;
margin-right:72px!important;
}
.section{padding-left:0!important;padding-right:0!important}
.section h2,.eventCard h2,.venueCopy h2,.reviewSection h2,.finalCopy h2,.advice h2,.products h2,.brandproof h2{
font-size:clamp(40px,4.6vw,58px)!important;
line-height:.96!important;
overflow-wrap:normal!important;
word-break:normal!important;
hyphens:none!important;
}
.split{gap:56px!important}
.subheroCopy{padding:54px 0!important}
}
/* =========================================================
V182 — BRANDED LANDING HEADINGS + BRANDS HERO BALANCE
Carry the navy/green About-page heading treatment through
every main landing. On navy/photo backgrounds the base text
remains white for contrast and the Lunar green is the accent.
The Brands & Venues portrait no longer dictates a very tall
hero and leave the copy stranded at the bottom of the screen.
========================================================= */
.brand-accent-v182{
color:#B0BC70!important;
font-style:normal!important;
}
@media (min-width:961px) and (max-width:1180px){
body.brands-page-v182 .subhero{
height:clamp(500px,calc(100svh - 132px),620px)!important;
min-height:500px!important;
max-height:620px!important;
grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
}
body.brands-page-v182 .subheroCopy,
body.brands-page-v182 .subheroMedia{
height:100%!important;
min-height:0!important;
box-sizing:border-box!important;
}
body.brands-page-v182 .subheroCopy{
align-items:center!important;
padding:38px 0!important;
}
body.brands-page-v182 .subheroMedia img{
width:100%!important;
height:100%!important;
min-height:0!important;
max-height:none!important;
aspect-ratio:auto!important;
object-fit:cover!important;
object-position:50% 26%!important;
}
body.brands-page-v182 .subhero h1{
max-width:14ch!important;
font-size:clamp(42px,5.2vw,56px)!important;
}
}
/* =========================================================
V185 — CENTRED ABOUT + FAQ LANDINGS
Match the compact, complete first-screen treatment used on
the other approved internal pages. Keep the copy centred and
the full hero within the usable tablet/desktop viewport.
========================================================= */
@media (min-width:961px) and (max-width:1180px){
body.about-page-v183 .about-hero-v183,
body.faq-page-v185 .subhero{
height:clamp(500px,calc(100svh - 132px),620px)!important;
min-height:500px!important;
max-height:620px!important;
}
body.about-page-v183 .about-hero-v183 .subheroCopy,
body.about-page-v183 .about-hero-v183 .subheroMedia,
body.faq-page-v185 .subheroCopy,
body.faq-page-v185 .subheroMedia{
height:100%!important;
min-height:0!important;
box-sizing:border-box!important;
}
body.about-page-v183 .about-hero-v183 .subheroCopy,
body.faq-page-v185 .subheroCopy{
align-items:center!important;
padding-top:38px!important;
padding-bottom:38px!important;
}
body.about-page-v183 .about-hero-v183 .subheroMedia img,
body.faq-page-v185 .subheroMedia img{
width:100%!important;
height:100%!important;
min-height:0!important;
max-height:none!important;
aspect-ratio:auto!important;
object-fit:cover!important;
}
body.about-page-v183 .about-hero-v183 h1,
body.faq-page-v185 .subhero h1{
font-size:clamp(42px,5.2vw,56px)!important;
}
}
@media (min-width:1181px){
body.about-page-v183 .about-hero-v183,
body.faq-page-v185 .subhero{
height:clamp(520px,calc(100svh - 160px),660px)!important;
min-height:520px!important;
max-height:660px!important;
}
body.about-page-v183 .about-hero-v183 .subheroCopy,
body.about-page-v183 .about-hero-v183 .subheroMedia,
body.faq-page-v185 .subheroCopy,
body.faq-page-v185 .subheroMedia{
height:100%!important;
min-height:0!important;
box-sizing:border-box!important;
}
body.about-page-v183 .about-hero-v183 .subheroCopy,
body.faq-page-v185 .subheroCopy{
align-items:center!important;
padding-top:42px!important;
padding-bottom:42px!important;
}
body.about-page-v183 .about-hero-v183 .subheroMedia img,
body.faq-page-v185 .subheroMedia img{
width:100%!important;
height:100%!important;
min-height:0!important;
max-height:none!important;
aspect-ratio:auto!important;
object-fit:cover!important;
}
body.about-page-v183 .about-hero-v183 h1,
body.faq-page-v185 .subhero h1{
font-size:clamp(46px,4.4vw,62px)!important;
}
}
body.about-page-v183 .about-hero-media-v183 img{
object-position:50% 44%!important;
}
body.faq-page-v185 .subheroMedia img{
object-position:50% 46%!important;
}
@media (min-width:1181px){
body.brands-page-v182 .subhero{
height:clamp(520px,calc(100svh - 160px),680px)!important;
min-height:520px!important;
max-height:680px!important;
}
body.brands-page-v182 .subheroCopy,
body.brands-page-v182 .subheroMedia{
height:100%!important;
min-height:0!important;
box-sizing:border-box!important;
}
body.brands-page-v182 .subheroCopy{
align-items:center!important;
padding:42px 0!important;
}
body.brands-page-v182 .subheroMedia img{
width:100%!important;
height:100%!important;
min-height:0!important;
max-height:none!important;
aspect-ratio:auto!important;
object-fit:cover!important;
object-position:50% 26%!important;
}
body.brands-page-v182 .subhero h1{
max-width:14ch!important;
font-size:clamp(46px,4.4vw,62px)!important;
}
}
/* V65 — stronger contact visibility */
.topphone{font-size:18px!important;font-weight:900!important;padding:11px 14px!important}
.topphone span{font-size:18px!important;font-weight:900!important}
.floating-wa-v65{position:fixed;right:22px;bottom:84px;z-index:79;display:flex;align-items:center;gap:9px;background:#25D366;color:#fff;text-decoration:none;padding:13px 16px;border-radius:999px;font-size:14px;font-weight:900;box-shadow:0 10px 28px rgba(13,23,77,.28);letter-spacing:.01em}
.floating-wa-icon-v65{width:22px;height:22px;border:2px solid #fff;border-radius:50%;display:grid;place-items:center;font-size:10px;line-height:1}
.floating-wa-v65:hover{transform:translateY(-2px)}
@media(max-width:999px){.topphone{font-size:17px!important}.topphone span{font-size:17px!important}}
@media(max-width:620px){.floating-wa-v65{right:14px;bottom:126px;padding:11px 13px;font-size:12px}.topphone{font-size:17px!important}.topphone span{font-size:17px!important}}
/* V66 — stronger phone prominence, genuine WhatsApp mark, matched contact actions */
.topphone{
font-size:24px!important;
font-weight:900!important;
padding:12px 17px!important;
min-height:54px!important;
}
.topphone span{
font-size:24px!important;
font-weight:900!important;
line-height:1!important;
letter-spacing:.015em!important;
}
.topphone .header-icon{width:25px!important;height:25px!important}
/* Floating WhatsApp is now a clean logo button rather than a text pill. */
.floating-wa-v65{
width:58px!important;
height:58px!important;
min-width:58px!important;
padding:0!important;
border-radius:50%!important;
display:grid!important;
place-items:center!important;
right:22px!important;
bottom:84px!important;
background:#25D366!important;
color:#fff!important;
box-shadow:0 10px 28px rgba(13,23,77,.30)!important;
}
.floating-wa-svg-v66{width:37px;height:37px;display:block}
.floating-wa-icon-v65,.floating-wa-v65>span{display:none!important}
/* Contact-page call and WhatsApp actions: identical alignment and visual rhythm. */
.contact-actions a{
justify-content:center!important;
text-align:center!important;
gap:12px!important;
}
.contact-actions a .header-icon{
width:25px!important;
height:25px!important;
flex:0 0 25px!important;
}
.contact-call{font-size:26px!important}
.contact-whatsapp{font-size:21px!important}
.contact-call span,.contact-whatsapp span{line-height:1!important}
@media(max-width:1180px){
.topphone{font-size:21px!important;padding:11px 14px!important}
.topphone span{font-size:21px!important}
}
@media(max-width:999px){
.topphone{font-size:20px!important}
.topphone span{font-size:20px!important}
}
@media(max-width:620px){
.floating-wa-v65{right:14px!important;bottom:126px!important;width:54px!important;height:54px!important;min-width:54px!important}
.floating-wa-svg-v66{width:34px;height:34px}
.topphone{font-size:20px!important}
.topphone span{font-size:20px!important}
.contact-call{font-size:23px!important}
.contact-whatsapp{font-size:20px!important}
}
/* V67 — homepage hero telephone + higher-eye-line WhatsApp */
/* The prominent number in the opening homepage hero, not merely the header contact. */
.heroActions .phone{
font-size:30px!important;
line-height:1!important;
font-weight:900!important;
letter-spacing:.015em!important;
margin-left:14px!important;
color:#fff!important;
text-decoration:none!important;
white-space:nowrap!important;
}
.heroActions .phone:hover{color:#B0BC70!important}
/* Bring WhatsApp into the reader's natural eye-line rather than hiding it in the bottom corner. */
.floating-wa-v65{
position:fixed!important;
right:24px!important;
top:56%!important;
bottom:auto!important;
transform:translateY(-50%)!important;
width:64px!important;
height:64px!important;
min-width:64px!important;
border:3px solid #fff!important;
box-shadow:0 12px 34px rgba(13,23,77,.34),0 0 0 5px rgba(37,211,102,.16)!important;
z-index:79!important;
}
.floating-wa-v65:hover{transform:translateY(calc(-50% - 3px)) scale(1.04)!important}
.floating-wa-svg-v66{width:40px!important;height:40px!important}
@media(max-width:1180px){
.heroActions .phone{font-size:27px!important;margin-left:8px!important}
.floating-wa-v65{right:20px!important;top:55%!important;width:60px!important;height:60px!important;min-width:60px!important}
.floating-wa-svg-v66{width:38px!important;height:38px!important}
}
@media(max-width:760px){
.heroActions .phone{font-size:24px!important;margin-left:0!important;margin-top:4px!important}
.floating-wa-v65{right:16px!important;top:58%!important;width:58px!important;height:58px!important;min-width:58px!important}
.floating-wa-svg-v66{width:36px!important;height:36px!important}
}
@media(max-width:420px){
.heroActions .phone{font-size:22px!important}
.floating-wa-v65{right:12px!important;top:57%!important;width:56px!important;height:56px!important;min-width:56px!important}
}
/* V68 — clearer service-led navigation */
@media (min-width:1000px) and (max-width:1220px){
.nav{gap:clamp(8px,1vw,13px)!important}
.nav>a,.navdrop{font-size:12px!important;letter-spacing:0!important}
}
/* V77 — persistent navigation: keep the complete Lunar Ice header available while scrolling. */
.top{
position:fixed!important;
top:0!important;
left:0!important;
right:0!important;
width:100%!important;
z-index:1000!important;
box-shadow:0 8px 24px rgba(7,13,49,.14);
}
body{padding-top:96px}
@media(max-width:620px){body{padding-top:88px;padding-bottom:54px}}
/* V78 — mobile landing/header flow fix + tighter homepage transition.
Keep the header visible while scrolling without overlaying page content. */
.top{
position:sticky!important;
top:0!important;
left:auto!important;
right:auto!important;
width:auto!important;
z-index:1000!important;
}
body{padding-top:0!important}
@media(max-width:760px){
/* Reduce the empty white band between the 2x2 promise panel and WHAT WE DO. */
#home-intro-v52{padding-top:18px!important}
}
@media(max-width:620px){
body{padding-top:0!important;padding-bottom:54px!important}
}
/* V79 — mobile homepage hero height correction.
Let the hero end naturally after the rotating punch line instead of
reserving a tall empty image area before the 2x2 service promises. */
@media(max-width:760px){
.hero{
height:auto!important;
min-height:0!important;
}
.heroCopy{
height:auto!important;
min-height:0!important;
justify-content:flex-start!important;
padding-top:34px!important;
padding-bottom:30px!important;
}
.hero-punch-v52{
margin-bottom:0!important;
}
}
/* V179 — enquiry form ice choices: allow customers to select one or several. */
.contactform .ice-options{
min-width:0!important;
margin:0!important;
padding:0!important;
border:0!important;
}
.contactform .ice-options legend{
display:block!important;
width:100%!important;
min-height:44px!important;
margin:0 0 8px!important;
padding:0!important;
color:#0D174D!important;
font-size:15px!important;
font-weight:800!important;
line-height:1.25!important;
}
.contactform .ice-options label{
display:flex!important;
align-items:center!important;
gap:10px!important;
min-height:0!important;
margin:0 0 8px!important;
padding:10px 12px!important;
border:1px solid rgba(13,23,77,.18)!important;
border-radius:8px!important;
background:#fff!important;
color:#0D174D!important;
cursor:pointer!important;
}
.contactform .ice-options input[type="checkbox"]{
-webkit-appearance:auto!important;
appearance:auto!important;
flex:0 0 20px!important;
width:20px!important;
height:20px!important;
min-height:20px!important;
max-height:20px!important;
margin:0!important;
padding:0!important;
accent-color:#0D174D!important;
}
.contactform .ice-options label:has(input:checked){
border-color:#8F9D57!important;
background:#F6F8ED!important;
}
.contactform .ice-type-error{
display:block!important;
min-height:18px!important;
color:#9B1C1C!important;
font-size:13px!important;
line-height:1.35!important;
}
@media(max-width:420px){
.heroCopy{
padding-top:28px!important;
padding-bottom:24px!important;
}
}
/* V80 — merged mobile fixes: keep V79 hero-gap correction + service photo label contrast */
.servicePhoto small{
display:inline-block;
background:rgba(13,23,77,.90);
color:var(--green)!important;
padding:7px 10px 6px;
border-radius:3px;
text-shadow:0 1px 1px rgba(0,0,0,.35);
box-shadow:0 2px 10px rgba(0,0,0,.18);
}
@media(max-width:760px){
.servicePhoto small{
background:rgba(13,23,77,.96);
padding:7px 10px 6px!important;
font-size:15px!important;
line-height:1.15!important;
opacity:1!important;
}
}
/* V82 — refinement pass: typography, cards, steps, legal and mobile image crop */
.v82-steps .tile,.v82-cardgrid .tile{border:1px solid rgba(13,23,77,.10);box-shadow:0 8px 24px rgba(13,23,77,.07);position:relative;overflow:hidden}
.v82-steps .tile{background:#0D174D;color:#fff;padding-top:54px!important}
.v82-steps .tile>span,.v82-cardno{position:absolute;top:15px;right:17px;font-family:'Audiowide',sans-serif;font-size:12px;letter-spacing:.08em;color:#B0BC70}
.v82-steps .tile h3{font-family:'Audiowide',sans-serif;font-size:17px!important;line-height:1.2;letter-spacing:.01em;color:#B0BC70}
.v82-steps .tile p{color:#fff!important;opacity:.92;font-size:14px!important;line-height:1.5!important}
.v82-cardgrid .tile{background:#fff;padding-top:48px!important}
.v82-cardgrid .tile h3{font-family:'Audiowide',sans-serif;line-height:1.2;color:#0D174D}
.v82-any{margin-top:15px!important;padding-top:14px;border-top:1px solid rgba(13,23,77,.15)}
.v82-proof{max-width:900px;margin:24px auto 0;line-height:1.6}
.v82-terms{max-width:900px}.v82-terms h2{font-size:clamp(24px,3vw,34px)!important;margin-top:34px}.v82-terms p{font-size:16px;line-height:1.65}
.v82-legal{display:flex;justify-content:space-between;gap:18px;align-items:center;padding-top:18px;padding-bottom:18px;font-size:12px;opacity:.82}.v82-legal a{color:inherit;text-decoration:underline}
@media(max-width:760px){
.pig-sign-hero img{object-fit:contain!important;object-position:center center!important;background:#fff!important;padding:12px!important;aspect-ratio:4/3!important}
.v82-legal{flex-direction:column;align-items:flex-start;gap:7px}
.v82-steps .tile,.v82-cardgrid .tile{padding:48px 17px 18px!important}
.v82-steps .tile h3,.v82-cardgrid .tile h3{font-size:16px!important}
.v82-steps .tile p,.v82-cardgrid .tile p{font-size:14px!important;line-height:1.48!important}
.v82-service-copy .lead,.v82-service-copy p,.v82-booking p{font-size:15px!important;line-height:1.58!important}
}
/* V87 — review pass: persistent header, tighter delivery cards, review strip, form clarity */
.top{position:fixed!important;top:0;left:0;right:0;width:100%;z-index:1000!important}
body{padding-top:96px}
.areaCards{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.v82-steps .tile{padding:24px 20px!important;min-height:0!important}
.v82-steps .tile p{font-size:14px!important;line-height:1.5!important}
.v87-booking{border-top:8px solid #B0BC70}
.v87-booking h2{color:#0D174D!important}.v87-booking .lead,.v87-booking p{color:#4f5873!important}
.v87-postcode{position:relative}.v87-postcode:before{content:"";display:block;height:8px;background:#B0BC70;position:absolute;left:0;right:0;top:0}.v87-postcode-copy{border-left:4px solid #B0BC70;padding-left:28px}
.home-review-strip{background:#0D174D;color:#fff;border-top:1px solid rgba(255,255,255,.12);border-bottom:6px solid #B0BC70}
.hero-review-mobile{display:none}
.home-review-inner{min-height:112px;display:grid;grid-template-columns:auto 1fr auto;gap:30px;align-items:center}
.home-review-label span{display:block;color:#B0BC70;letter-spacing:.12em;font-size:18px}.home-review-label b{font-size:10px;letter-spacing:.14em}
.home-review-rotator{position:relative;min-height:54px;display:flex;align-items:center}.home-review{position:absolute;inset:auto 0;opacity:0;transform:translateY(8px);transition:.55s ease;margin:0;font-size:17px;font-weight:700;line-height:1.45}.home-review.active{opacity:1;transform:none}.home-review-inner>a{color:#B0BC70;font-size:11px;font-weight:900;text-decoration:none;white-space:nowrap}
.contactform label{margin-bottom:4px!important}.contactform .form-row{gap:24px 20px!important;margin-bottom:24px!important}
@media(max-width:800px){body{padding-top:78px}.areaCards{grid-template-columns:1fr!important}.home-review-inner{grid-template-columns:1fr;gap:8px;padding:18px 0}.home-review-rotator{min-height:72px}.home-review-inner>a{margin-top:2px}.v87-postcode-copy{padding-left:18px}.v82-steps .tile{padding:18px 16px!important}}
/* V132 — mobile landing-page social proof */
@media(max-width:800px){
.hero{min-height:calc(100svh - 78px)!important;height:calc(100svh - 78px)!important;max-height:none!important}
.heroCopy{justify-content:flex-end!important;padding:24px 0 68px!important}
.hero .eyebrow{margin-bottom:8px!important}
.hero h1{font-size:clamp(39px,11vw,52px)!important;line-height:.91!important;margin-bottom:14px!important}
.heroCopy>p{font-size:14px!important;line-height:1.4!important;max-width:94%!important}
.heroActions{margin-top:14px!important;gap:8px!important}
.heroActions .btn{padding:12px 13px!important}
.heroActions .phone{font-size:20px!important}
.hero-punch-v52,.heroMeta{display:none!important}
.hero-review-mobile{display:block;width:100%;margin-top:14px;padding:11px 13px 12px;border:1px solid rgba(176,188,112,.65);background:rgba(13,23,77,.86);color:#fff;text-decoration:none;backdrop-filter:blur(5px)}
.hero-review-stars{display:flex;align-items:center;gap:9px;color:#B0BC70;font-size:13px;letter-spacing:.08em}
.hero-review-stars b{font-size:9px;letter-spacing:.13em;color:#fff}
.hero-review-stage{display:block;position:relative;height:38px;margin-top:6px;overflow:hidden}
.hero-review-quote{position:absolute;inset:0;display:flex;align-items:center;opacity:0;transform:translateY(6px);transition:opacity .45s ease,transform .45s ease;font-size:12px;line-height:1.35;font-weight:700}
.hero-review-quote.active{opacity:1;transform:none}
.home-review-strip{display:none!important}
}
@media(max-width:380px){
.hero h1{font-size:38px!important}
.heroCopy>p{font-size:13px!important}
.hero-review-stage{height:34px}
.hero-review-quote{font-size:11px}
}
/* =========================================================
V133 — contained mobile navigation panel + true accordions
========================================================= */
@media(max-width:900px){
body.mobile-nav-open{overflow:hidden!important}
.top .nav.open{
display:flex!important;
position:fixed!important;
top:84px!important;
right:0!important;
bottom:0!important;
left:0!important;
width:auto!important;
max-width:100vw!important;
height:auto!important;
max-height:none!important;
margin:0!important;
padding:10px max(20px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left))!important;
overflow-x:hidden!important;
overflow-y:auto!important;
overscroll-behavior:contain!important;
background:#0D174D!important;
box-sizing:border-box!important;
}
.top .nav.open>a,
.top .nav.open .navdrop{
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
width:100%!important;
min-width:0!important;
max-width:100%!important;
margin:0!important;
padding:14px 2px!important;
border:0!important;
border-bottom:1px solid rgba(255,255,255,.13)!important;
background:transparent!important;
color:#fff!important;
text-align:left!important;
font-size:15px!important;
line-height:1.25!important;
white-space:nowrap!important;
box-sizing:border-box!important;
}
.top .nav.open .navdrop span{
flex:0 0 auto!important;
margin-left:12px!important;
transition:transform .2s ease!important;
}
.top .nav.open .navgroup.open>.navdrop span{transform:rotate(180deg)!important}
.top .nav.open .navgroup{
position:static!important;
inset:auto!important;
display:block!important;
width:100%!important;
min-width:0!important;
max-width:100%!important;
margin:0!important;
padding:0!important;
}
.top .nav.open .dropdown,
.top .nav.open .navgroup:hover .dropdown,
.top .nav.open .navgroup:focus-within .dropdown{
display:none!important;
position:static!important;
inset:auto!important;
transform:none!important;
width:100%!important;
min-width:0!important;
max-width:100%!important;
margin:0!important;
padding:5px 0 8px 15px!important;
border:0!important;
border-left:2px solid #B0BC70!important;
box-shadow:none!important;
background:rgba(255,255,255,.045)!important;
box-sizing:border-box!important;
}
.top .nav.open .navgroup.open>.dropdown{display:block!important}
.top .nav.open .dropdown a{
display:block!important;
width:100%!important;
min-width:0!important;
max-width:100%!important;
margin:0!important;
padding:11px 12px!important;
color:#fff!important;
font-size:14px!important;
line-height:1.3!important;
white-space:normal!important;
overflow-wrap:normal!important;
word-break:normal!important;
box-sizing:border-box!important;
}
}
@media(max-width:420px){
.top .nav.open{top:78px!important}
}
/* =========================================================
V103 — VISIBLE HEADER + ALIGNMENT RESTORATION
Restores brand scale, proper gutters and clean card/text alignment.
========================================================= */
/* Keep the overall site content off the screen edges. */
.wrap{
width:min(1280px,92vw)!important;
margin-left:auto!important;
margin-right:auto!important;
}
/* Desktop + iPad landscape: visibly taller header and larger logo. */
@media (min-width:1181px){
body{padding-top:0!important}
.top .topin{
width:min(1280px,92vw)!important;
max-width:1280px!important;
min-height:104px!important;
height:104px!important;
margin:0 auto!important;
padding:0!important;
display:flex!important;
align-items:center!important;
gap:20px!important;
}
.top .brand.brandtype{
flex:0 0 176px!important;
width:176px!important;
max-width:176px!important;
height:76px!important;
margin:0!important;
overflow:visible!important;
}
.top .brand.brandtype .brandart{
width:176px!important;
max-width:176px!important;
height:76px!important;
max-height:76px!important;
object-fit:contain!important;
object-position:left center!important;
}
.top .nav{
flex:1 1 auto!important;
min-width:0!important;
margin-left:auto!important;
display:flex!important;
align-items:center!important;
justify-content:flex-end!important;
gap:12px!important;
}
.top .nav>a,
.top .nav .navdrop{
font-size:11.5px!important;
line-height:1.15!important;
padding:10px 0!important;
white-space:nowrap!important;
}
.top .nav .walink{
display:inline-flex!important;
padding:10px 12px!important;
font-size:11.5px!important;
margin-left:2px!important;
}
.menuBtn{display:none!important}
/* Restore the opening panel height rather than squashing it to 510px. */
.hero{
height:min(760px,76vh)!important;
min-height:640px!important;
max-height:760px!important;
}
.heroCopy{
justify-content:center!important;
padding-top:24px!important;
padding-bottom:24px!important;
}
.hero h1{
font-size:clamp(62px,6vw,88px)!important;
margin:14px 0 20px!important;
}
.heroCopy>p{
font-size:18px!important;
line-height:1.5!important;
max-width:720px!important;
}
.heroActions{margin-top:20px!important}
.hero-punch-v52{margin-top:24px!important}
.heroMeta{margin-top:24px!important;padding-top:14px!important}
/* Let the four proof boxes size naturally so text lands cleanly. */
.approved-strip-v45 .trustgrid>div{
min-height:0!important;
height:auto!important;
padding:20px 22px!important;
}
.approved-strip-v45 .trustgrid>div>span:last-child{
display:block!important;
font-size:12px!important;
line-height:1.45!important;
margin-top:6px!important;
}
/* Sub-page text panels line up to the same visual gutter as the rest of the site. */
.subheroCopy .wrap{
width:auto!important;
max-width:620px!important;
margin-left:clamp(46px,5vw,76px)!important;
margin-right:clamp(46px,5vw,76px)!important;
}
.section .wrap,
.footer .wrap{
width:min(1280px,92vw)!important;
}
}
/* Narrower tablets: use the intentional compact menu so the logo does not have to be shrunk. */
@media (min-width:761px) and (max-width:1180px){
.top .topin{
width:92vw!important;
min-height:96px!important;
height:96px!important;
margin:0 auto!important;
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:18px!important;
}
.top .brand.brandtype{
flex:0 0 168px!important;
width:168px!important;
max-width:168px!important;
height:72px!important;
}
.top .brand.brandtype .brandart{
width:168px!important;
max-width:168px!important;
height:72px!important;
max-height:72px!important;
}
.top .menuBtn{display:inline-flex!important}
}
/* Phones: keep breathing room without making the header huge. */
@media (max-width:760px){
.wrap{width:auto!important;margin-left:22px!important;margin-right:22px!important}
.top .topin{width:auto!important;margin-left:20px!important;margin-right:20px!important}
}
/* =========================================================
V104 — SCREENSHOT-CORRECTED IPAD / DESKTOP LAYOUT
Based directly on the 8 Sep iPad screenshot.
========================================================= */
@media (min-width:1181px){
/* GUARANTEED visible side gutters and materially taller header */
.top .topin{
box-sizing:border-box!important;
width:100%!important;
max-width:none!important;
min-height:126px!important;
height:126px!important;
margin:0!important;
padding-left:clamp(38px,4vw,64px)!important;
padding-right:clamp(38px,4vw,64px)!important;
display:flex!important;
align-items:center!important;
gap:22px!important;
}
/* The artwork is tall, so the image box must be tall too or object-fit shrinks it.
This is the actual cause of the small-looking logo in V103. */
.top .brand.brandtype{
flex:0 0 205px!important;
width:205px!important;
max-width:205px!important;
height:118px!important;
max-height:118px!important;
margin:0!important;
display:flex!important;
align-items:center!important;
}
.top .brand.brandtype .brandart{
width:205px!important;
max-width:205px!important;
height:118px!important;
max-height:118px!important;
object-fit:contain!important;
object-position:left center!important;
margin:0!important;
}
.top .nav{
flex:1 1 auto!important;
min-width:0!important;
margin-left:auto!important;
gap:11px!important;
justify-content:flex-end!important;
align-items:center!important;
}
.top .nav>a,
.top .nav .navdrop{
font-size:11.5px!important;
line-height:1.15!important;
padding:10px 0!important;
white-space:nowrap!important;
}
.top .nav .walink{
padding:10px 12px!important;
font-size:11.5px!important;
}
/* Proof strip rebuilt as a real 2-column internal layout:
icon in its own column, heading/copy in theirs. No absolute overlap. */
.approved-strip-v45 .trustgrid{
width:100%!important;
max-width:none!important;
margin:0!important;
grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
.approved-strip-v45 .trustgrid>div{
position:relative!important;
min-height:132px!important;
height:auto!important;
padding:22px 22px!important;
display:grid!important;
grid-template-columns:34px minmax(0,1fr)!important;
grid-template-rows:auto auto!important;
column-gap:14px!important;
row-gap:7px!important;
align-content:center!important;
justify-content:stretch!important;
}
.approved-strip-v45 .trusticon{
position:static!important;
grid-column:1!important;
grid-row:1 / span 2!important;
align-self:start!important;
justify-self:start!important;
width:30px!important;
height:30px!important;
margin-top:1px!important;
}
.approved-strip-v45 b{
grid-column:2!important;
grid-row:1!important;
display:block!important;
margin:0!important;
font-size:13.5px!important;
line-height:1.18!important;
}
.approved-strip-v45 .trustgrid>div>span:last-child{
grid-column:2!important;
grid-row:2!important;
display:block!important;
margin:0!important;
font-size:12px!important;
line-height:1.42!important;
}
}
/* V105 — header depth correction from 8 Sep iPad screenshot */
@media (min-width:1181px){
.top .topin{
min-height:156px!important;
height:156px!important;
padding-left:clamp(46px,4.5vw,72px)!important;
padding-right:clamp(46px,4.5vw,72px)!important;
}
.top .brand.brandtype{
flex-basis:220px!important;
width:220px!important;
max-width:220px!important;
height:144px!important;
max-height:144px!important;
}
.top .brand.brandtype .brandart{
width:220px!important;
max-width:220px!important;
height:144px!important;
max-height:144px!important;
}
}
/* =========================================================
V106 — MATCH THE APPROVED 8 SEP MOCKUP
This is the real website implementation of the approved visual.
========================================================= */
@media (min-width:1181px){
/* Tall, confident header matching the approved mockup */
.top{
background:#0D174D!important;
}
.top .topin{
width:100%!important;
max-width:none!important;
min-height:190px!important;
height:190px!important;
margin:0!important;
padding:0 clamp(40px,4.2vw,68px)!important;
display:flex!important;
align-items:center!important;
gap:30px!important;
box-sizing:border-box!important;
}
.top .brand.brandtype{
flex:0 0 255px!important;
width:255px!important;
max-width:255px!important;
height:170px!important;
max-height:170px!important;
display:flex!important;
align-items:center!important;
margin:0!important;
}
.top .brand.brandtype .brandart{
width:255px!important;
max-width:255px!important;
height:170px!important;
max-height:170px!important;
object-fit:contain!important;
object-position:left center!important;
margin:0!important;
}
.top .nav{
flex:1 1 auto!important;
min-width:0!important;
margin-left:auto!important;
display:flex!important;
align-items:center!important;
justify-content:flex-end!important;
gap:18px!important;
}
.top .nav>a,
.top .nav .navdrop{
font-size:12px!important;
line-height:1.1!important;
padding:10px 0!important;
white-space:nowrap!important;
letter-spacing:0!important;
}
.top .nav .walink{
display:inline-flex!important;
align-items:center!important;
padding:13px 18px!important;
font-size:12px!important;
margin-left:10px!important;
}
/* Hero proportions + vertical placement matching the approved mockup */
.hero{
height:665px!important;
min-height:665px!important;
max-height:665px!important;
}
.heroCopy{
height:100%!important;
justify-content:center!important;
padding-top:70px!important;
padding-bottom:26px!important;
box-sizing:border-box!important;
}
.heroCopy .wrap{
width:min(1280px,92vw)!important;
margin-left:auto!important;
margin-right:auto!important;
}
.hero .eyebrow{
margin-bottom:16px!important;
}
.hero h1{
font-size:clamp(70px,6vw,92px)!important;
line-height:.93!important;
margin:0 0 28px!important;
max-width:720px!important;
}
.heroCopy>p{
font-size:18px!important;
line-height:1.5!important;
max-width:700px!important;
margin:0!important;
}
.heroActions{
margin-top:30px!important;
}
.hero-punch-v52{
margin-top:18px!important;
}
.heroMeta{
margin-top:26px!important;
padding-top:18px!important;
max-width:620px!important;
}
/* Four feature boxes exactly below the hero and cleanly aligned */
.approved-strip-v45 .trustgrid{
width:100%!important;
max-width:none!important;
margin:0!important;
grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
.approved-strip-v45 .trustgrid>div{
min-height:165px!important;
padding:28px 30px!important;
display:grid!important;
grid-template-columns:36px minmax(0,1fr)!important;
grid-template-rows:auto auto!important;
column-gap:16px!important;
row-gap:8px!important;
align-content:center!important;
position:relative!important;
}
.approved-strip-v45 .trusticon{
position:static!important;
grid-column:1!important;
grid-row:1 / span 2!important;
width:31px!important;
height:31px!important;
margin:0!important;
align-self:start!important;
}
.approved-strip-v45 b{
grid-column:2!important;
grid-row:1!important;
margin:0!important;
font-size:14px!important;
line-height:1.18!important;
}
.approved-strip-v45 .trustgrid>div>span:last-child{
grid-column:2!important;
grid-row:2!important;
margin:0!important;
font-size:12px!important;
line-height:1.45!important;
}
}
/* iPad portrait / smaller tablet — keep the same spacious brand feel, switch to compact menu */
@media (min-width:761px) and (max-width:1180px){
.top .topin{
min-height:132px!important;
height:132px!important;
padding:0 34px!important;
}
.top .brand.brandtype{
flex:0 0 205px!important;
width:205px!important;
max-width:205px!important;
height:118px!important;
max-height:118px!important;
}
.top .brand.brandtype .brandart{
width:205px!important;
max-width:205px!important;
height:118px!important;
max-height:118px!important;
}
.heroCopy{
padding-top:42px!important;
}
}
/* =========================================================
V107 — HEADER FLOW FIX
Corrects the real cause of the V106 overlap:
the header was increased to 190px but body padding was still 96px.
========================================================= */
/* Desktop / iPad landscape */
@media (min-width:1181px){
body{
padding-top:190px!important;
}
.top{
position:fixed!important;
top:0!important;
left:0!important;
right:0!important;
width:100%!important;
z-index:1000!important;
}
/* Put the hero copy slightly lower within the now-correct visible hero area. */
.heroCopy{
justify-content:center!important;
padding-top:92px!important;
padding-bottom:18px!important;
}
}
/* iPad portrait / medium tablet */
@media (min-width:761px) and (max-width:1180px){
body{
padding-top:132px!important;
}
.top{
position:fixed!important;
top:0!important;
left:0!important;
right:0!important;
width:100%!important;
z-index:1000!important;
}
.heroCopy{
padding-top:56px!important;
}
}
/* =========================================================
V108 — HEADER REBALANCE ONLY
No hero, page content, cards, imagery or copy changes.
========================================================= */
@media (min-width:1181px){
body{
padding-top:160px!important;
}
.top .topin{
min-height:160px!important;
height:160px!important;
}
.top .brand.brandtype{
flex-basis:220px!important;
width:220px!important;
max-width:220px!important;
height:142px!important;
max-height:142px!important;
}
.top .brand.brandtype .brandart{
width:220px!important;
max-width:220px!important;
height:142px!important;
max-height:142px!important;
}
}
/* =========================================================
V109 — FIRST-SCREEN INFO VISIBILITY FIX ONLY
Goal: keep the key hero answers visible on initial load.
No header, logo, nav, copy, imagery or card redesign changes.
========================================================= */
@media (min-width:1181px){
/* Give the hero enough vertical room for the full info stack. */
.hero{
height:720px!important;
min-height:720px!important;
max-height:720px!important;
}
/* Raise the content slightly within the hero so the punch line + meta line
remain fully visible above the four feature boxes. */
.heroCopy{
justify-content:center!important;
padding-top:54px!important;
padding-bottom:28px!important;
}
.heroActions{
margin-top:24px!important;
}
.hero-punch-v52{
margin-top:14px!important;
margin-bottom:0!important;
}
.heroMeta{
margin-top:18px!important;
padding-top:14px!important;
max-width:640px!important;
}
}
/* =========================================================
V110 — REVIEWS ABOVE FEATURE BOXES
Homepage only: review strip now sits directly below hero.
========================================================= */
@media (min-width:1181px){
.home-review-strip{
min-height:88px!important;
}
.home-review-inner{
min-height:88px!important;
padding-top:14px!important;
padding-bottom:14px!important;
display:grid!important;
grid-template-columns:130px minmax(0,1fr) auto!important;
align-items:center!important;
column-gap:28px!important;
}
.home-review-label{
margin:0!important;
}
.home-review-rotator{
min-height:28px!important;
display:flex!important;
align-items:center!important;
}
.home-review{
margin:0!important;
}
}
/* =========================================================
V116 — CLEAN INTERNAL-PAGE FIRST SCREEN
Desktop / iPad landscape only.
Goal: each internal page lands as one complete hero screen
rather than showing the next section half-cut underneath.
Homepage hero is intentionally NOT targeted.
========================================================= */
@media (min-width:1181px){
/* Standard internal-page split heroes */
.subhero{
min-height:max(560px, calc(100svh - 160px))!important;
height:auto!important;
}
.subheroCopy{
min-height:max(560px, calc(100svh - 160px))!important;
box-sizing:border-box!important;
padding-top:48px!important;
padding-bottom:48px!important;
}
.subheroMedia{
min-height:max(560px, calc(100svh - 160px))!important;
height:auto!important;
}
.subheroMedia img{
width:100%!important;
height:100%!important;
min-height:max(560px, calc(100svh - 160px))!important;
max-height:none!important;
object-fit:cover!important;
}
/* Keep long internal hero headings comfortable inside the first screen. */
.subhero h1{
font-size:clamp(46px,4.65vw,68px)!important;
line-height:.94!important;
margin-top:14px!important;
margin-bottom:20px!important;
}
.subhero p{
margin-bottom:0!important;
}
/* About page has its own hero instead of .subhero. */
.about54-hero{
min-height:max(560px, calc(100svh - 160px))!important;
box-sizing:border-box!important;
display:flex!important;
align-items:center!important;
}
/* No accidental gaps between the finished hero and the next section. */
.subhero + .section,
.subhero + .callout,
.about54-hero + section{
margin-top:0!important;
}
}
/* V120 — gentle motion and depth for the neutral Products overview artwork. */
.subheroMedia .product-range-hero-v120{
transform-origin:center;
animation:productRangeBreatheV120 7s ease-in-out infinite;
will-change:transform,filter;
}
@keyframes productRangeBreatheV120{
0%,100%{transform:scale(1);filter:brightness(1)}
50%{transform:scale(1.008);filter:brightness(1.02)}
}
@media (prefers-reduced-motion:reduce){
.subheroMedia .product-range-hero-v120{animation:none!important;transform:none!important;filter:none!important}
}
/* V122 — match the hero copy panel exactly and never crop the product artwork. */
.subheroMedia.product-range-media-v122{
background:#0D174D!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
overflow:hidden!important;
}
.subheroMedia.product-range-media-v122 .product-range-hero-v120{
width:100%!important;
height:100%!important;
object-fit:contain!important;
object-position:center!important;
background:#0D174D!important;
}
/* V163 — keep the replacement 6 × 2kg product photos focused on the bag branding. */
.subheroMedia img.product-2kg-hero-image,
.productimage-v51 img.product-2kg-card-image{
object-position:center 30%!important;
}
@media(max-width:960px){
.subheroMedia.product-range-media-v122 .product-range-hero-v120{
height:auto!important;
min-height:0!important;
aspect-ratio:1/1!important;
}
}
/* =========================================================
V126 — MOBILE/TABLET HEADER + LANDING POSITION FIX
One in-flow header architecture up to 900px. The complete
header owns its height, spans the viewport and can never
cover the first hero heading on any page.
========================================================= */
@media (max-width:900px){
html,body{
width:100%!important;
max-width:100%!important;
overflow-x:hidden!important;
}
body{
padding-top:0!important;
}
.top{
position:sticky!important;
top:0!important;
left:auto!important;
right:auto!important;
width:100%!important;
max-width:none!important;
margin:0!important;
padding:0!important;
background:#0D174D!important;
z-index:1000!important;
}
.top .topin{
width:100%!important;
max-width:none!important;
min-height:0!important;
height:auto!important;
margin:0!important;
padding:0!important;
display:grid!important;
grid-template-columns:minmax(0,1fr) auto!important;
grid-template-rows:84px 54px!important;
grid-template-areas:
"brand menu"
"contacts contacts"!important;
gap:0!important;
align-items:center!important;
box-sizing:border-box!important;
}
.top .brand.brandtype{
grid-area:brand!important;
width:auto!important;
max-width:none!important;
min-width:0!important;
height:84px!important;
margin:0!important;
padding-left:max(16px,env(safe-area-inset-left))!important;
overflow:hidden!important;
}
.top .brand.brandtype .brandart{
width:158px!important;
max-width:158px!important;
height:70px!important;
max-height:70px!important;
object-fit:contain!important;
object-position:left center!important;
}
.top .menuBtn{
grid-area:menu!important;
display:block!important;
margin:0 max(16px,env(safe-area-inset-right)) 0 12px!important;
min-width:64px!important;
}
.top .topcontacts{
grid-area:contacts!important;
position:static!important;
inset:auto!important;
width:100%!important;
max-width:none!important;
min-width:0!important;
height:54px!important;
margin:0!important;
display:grid!important;
grid-template-columns:1fr 1fr!important;
gap:0!important;
}
.top .topcontacts a{
width:100%!important;
min-width:0!important;
min-height:54px!important;
height:54px!important;
margin:0!important;
padding:10px 8px!important;
border:0!important;
font-size:15px!important;
}
.top .topphone{
background:#fff!important;
color:#0D174D!important;
}
.top .topwa{
background:#B0BC70!important;
color:#0D174D!important;
}
.top .nav.open{
position:absolute!important;
top:100%!important;
left:0!important;
right:0!important;
width:100%!important;
max-height:calc(100svh - 138px)!important;
overflow-y:auto!important;
}
main{
width:100%!important;
max-width:100%!important;
margin:0!important;
}
.hero,
.subhero,
.about54-hero{
scroll-margin-top:138px!important;
}
.heroCopy{
padding-top:38px!important;
}
}
@media (max-width:420px){
.top .topin{
grid-template-rows:78px 52px!important;
}
.top .brand.brandtype{
height:78px!important;
}
.top .brand.brandtype .brandart{
width:146px!important;
max-width:146px!important;
height:64px!important;
max-height:64px!important;
}
.top .topcontacts,
.top .topcontacts a{
height:52px!important;
min-height:52px!important;
}
.top .nav.open{
max-height:calc(100svh - 130px)!important;
}
.heroCopy{
padding-top:34px!important;
}
}
/* =========================================================
V130 — CLEAN MOBILE HEADER, MENU WIDTH + CONTACT BAR
========================================================= */
@media (max-width:900px){
html{overflow-x:clip!important}
body{
overflow-x:clip!important;
padding-top:84px!important;
}
.top{
position:fixed!important;
top:0!important;
left:0!important;
right:0!important;
width:100%!important;
height:84px!important;
margin:0!important;
background:#0D174D!important;
}
.top .topin{
height:84px!important;
min-height:84px!important;
grid-template-rows:84px!important;
grid-template-areas:"brand menu"!important;
}
.top .topcontacts{
display:none!important;
}
.top .nav.open{
top:84px!important;
left:0!important;
right:0!important;
width:100%!important;
max-width:none!important;
max-height:calc(100svh - 84px)!important;
margin:0!important;
padding:18px max(20px,env(safe-area-inset-right)) 24px max(20px,env(safe-area-inset-left))!important;
box-sizing:border-box!important;
overflow-x:hidden!important;
overflow-y:auto!important;
}
.top .nav.open>a,
.top .nav.open .navdrop,
.top .nav.open .dropdown a{
width:100%!important;
max-width:100%!important;
box-sizing:border-box!important;
white-space:nowrap!important;
word-break:normal!important;
overflow-wrap:normal!important;
}
.top .nav.open .navgroup,
.top .nav.open .dropdown{
width:100%!important;
max-width:100%!important;
min-width:0!important;
}
.stickycontact{
grid-template-columns:minmax(0,1.35fr) minmax(0,.825fr) minmax(0,.825fr)!important;
width:100%!important;
max-width:100%!important;
min-height:58px!important;
padding-bottom:env(safe-area-inset-bottom)!important;
background:#0D174D!important;
}
.stickycontact a{
min-width:0!important;
min-height:58px!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
gap:7px!important;
padding:14px 7px!important;
font-size:11px!important;
line-height:1!important;
white-space:nowrap!important;
word-break:keep-all!important;
overflow-wrap:normal!important;
}
.stickycontact a[href^="https://wa.me/"]{
color:#B0BC70!important;
}
.stickycontact a[href^="https://wa.me/"] .waicon{
width:23px!important;
height:23px!important;
}
}
@media (max-width:420px){
body{padding-top:78px!important}
.top,.top .topin{
height:78px!important;
min-height:78px!important;
grid-template-rows:78px!important;
}
.top .nav.open{
top:78px!important;
max-height:calc(100svh - 78px)!important;
}
}
/* V134 final override — must remain at the end of this stylesheet. */
@media(max-width:900px){
.top,.top .topin{overflow:visible!important;contain:none!important}
body.mobile-nav-open{overflow:hidden!important}
body>.mobile-nav-panel{display:none!important}
body>.mobile-nav-panel.open{
display:flex!important;
position:fixed!important;
z-index:2000!important;
top:84px!important;
right:0!important;
bottom:0!important;
left:0!important;
width:100vw!important;
min-width:0!important;
max-width:100vw!important;
height:auto!important;
max-height:none!important;
margin:0!important;
padding:10px max(20px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left))!important;
overflow-x:hidden!important;
overflow-y:auto!important;
flex-direction:column!important;
align-items:stretch!important;
justify-content:flex-start!important;
gap:0!important;
background:#0D174D!important;
box-sizing:border-box!important;
}
body>.mobile-nav-panel.open .navgroup{position:static!important;width:100%!important;min-width:0!important;max-width:100%!important}
body>.mobile-nav-panel.open .dropdown,
body>.mobile-nav-panel.open .navgroup:hover .dropdown,
body>.mobile-nav-panel.open .navgroup:focus-within .dropdown{display:none!important;position:static!important;inset:auto!important;width:100%!important;min-width:0!important;max-width:100%!important;transform:none!important}
body>.mobile-nav-panel.open .navgroup.open>.dropdown{display:block!important}
.floating-wa-v65{display:none!important;visibility:hidden!important}
body{padding-bottom:calc(72px + env(safe-area-inset-bottom))!important}
}
@media(max-width:800px){
.heroCopy{padding-bottom:calc(100px + env(safe-area-inset-bottom))!important}
}
@media(max-width:420px){
body>.mobile-nav-panel.open{top:78px!important}
.heroCopy{padding-bottom:calc(96px + env(safe-area-inset-bottom))!important}
}
/* V135 contact page — enquiry-first, with no repeated product photography. */
.contact-landing-head-v135{
padding:44px 0 36px;
color:#fff;
background:#0D174D;
border-bottom:5px solid #B0BC70;
}
.contact-landing-grid-v135{
display:grid;
grid-template-columns:minmax(0,1.15fr) minmax(340px,.7fr);
gap:clamp(30px,6vw,90px);
align-items:end;
}
.contact-landing-copy-v135 h1{
max-width:760px;
margin:8px 0 14px;
color:#fff;
font-size:clamp(48px,5.4vw,82px);
line-height:.92;
letter-spacing:-.045em;
}
.contact-landing-copy-v135 p{
max-width:690px;
margin:0;
color:rgba(255,255,255,.84);
font-size:clamp(17px,1.35vw,21px);
line-height:1.5;
}
.contact-landing-actions-v135{display:grid;gap:10px}
.contact-landing-actions-v135 a{
min-height:72px;
display:flex;
align-items:center;
gap:14px;
padding:14px 18px;
border:1px solid rgba(176,188,112,.72);
text-decoration:none;
font-weight:800;
font-size:18px;
line-height:1.1;
}
.contact-landing-actions-v135 a:hover{transform:translateY(-2px)}
.contact-landing-actions-v135 .contact-call{color:#0D174D;background:#B0BC70}
.contact-landing-actions-v135 .contact-whatsapp{color:#fff;background:#196B3A;border-color:#2B9B58}
.contact-landing-actions-v135 .header-icon{width:27px;height:27px;flex:0 0 27px}
.contact-landing-actions-v135 span{display:grid;gap:4px}
.contact-landing-actions-v135 small{font-size:10px;letter-spacing:.14em;opacity:.78}
.contact-form-first-v135{padding-top:38px!important}
.contact-form-first-v135 .contact-layout{
display:grid!important;
grid-template-columns:minmax(0,1.5fr) minmax(280px,.65fr)!important;
grid-template-areas:"form details";
gap:clamp(30px,5vw,72px)!important;
align-items:start;
}
.contact-form-first-v135 .contactform{grid-area:form;max-width:none!important;margin:0!important}
.contact-form-first-v135 .contact-details{grid-area:details;position:sticky;top:128px}
.contact-form-first-v135 .contact-details h2{font-size:clamp(28px,2.4vw,42px);line-height:1}
@media(max-width:900px){
.contact-landing-head-v135{padding:24px 0 20px}
.contact-landing-grid-v135{grid-template-columns:1fr;gap:16px}
.contact-landing-copy-v135 h1{font-size:clamp(38px,12vw,58px);margin:6px 0 10px}
.contact-landing-copy-v135 p{font-size:16px;line-height:1.4}
.contact-landing-actions-v135{grid-template-columns:1fr 1fr;gap:8px}
.contact-landing-actions-v135 a{min-height:60px;padding:10px 12px;font-size:15px;gap:9px}
.contact-landing-actions-v135 .header-icon{width:23px;height:23px;flex-basis:23px}
.contact-form-first-v135{padding-top:20px!important}
.contact-form-first-v135 .contact-layout{display:flex!important;flex-direction:column;gap:30px!important}
.contact-form-first-v135 .contactform{order:1;width:100%}
.contact-form-first-v135 .contact-details{order:2;position:static;width:100%}
}
@media(max-width:390px){
.contact-landing-actions-v135 a{font-size:13px;padding:9px 8px}
.contact-landing-actions-v135 small{font-size:9px;letter-spacing:.08em}
}
/* V137 contact flow — the form is the continuation of the opening panel. */
.contact-landing-head-v135{padding-top:30px!important;padding-bottom:68px!important}
.contact-form-first-v135{
position:relative;
z-index:2;
margin-top:-38px;
padding-top:0!important;
background:linear-gradient(to bottom,#0D174D 38px,#fff 38px)!important;
}
.contact-form-first-v135 .contactform{
border:0!important;
border-top:6px solid #B0BC70!important;
box-shadow:0 20px 56px rgba(13,23,77,.16)!important;
}
.contact-form-first-v135 .contactform .form-intro h3{
color:#0D174D;
font-size:clamp(32px,3vw,46px);
line-height:1;
letter-spacing:-.025em;
}
.contact-form-first-v135 .contact-details{
margin-top:44px;
padding:28px;
border-left:4px solid #B0BC70;
background:#F4F5EF;
}
@media(max-width:900px){
.contact-landing-head-v135{padding-top:18px!important;padding-bottom:46px!important}
.contact-form-first-v135{margin-top:-26px;background:linear-gradient(to bottom,#0D174D 26px,#fff 26px)!important}
.contact-form-first-v135 .contactform{padding-top:22px!important}
.contact-form-first-v135 .contactform .form-intro{padding-bottom:18px;margin-bottom:20px}
.contact-form-first-v135 .contactform .form-intro h3{font-size:30px;margin-top:6px}
.contact-form-first-v135 .contact-details{margin-top:0}
}
/* V138 information pages — no repeated product photography. */
.subhero.info-hero-v138{
display:block!important;
min-height:0!important;
background:#0D174D!important;
border-bottom:5px solid #B0BC70;
}
.subhero.info-hero-v138 .subheroCopy{
width:100%!important;
min-height:0!important;
padding:clamp(54px,7vw,92px) 0!important;
}
.subhero.info-hero-v138 .subheroCopy .wrap{max-width:1180px!important}
.subhero.info-hero-v138 h1{max-width:980px!important}
.subhero.info-hero-v138 p{max-width:760px!important}
@media(max-width:760px){
.subhero.info-hero-v138 .subheroCopy{padding:38px 0!important}
}
/* V139 contact shortcuts — one clean number and the WhatsApp mark only. */
.contact-landing-actions-v135{
display:flex!important;
align-items:center!important;
justify-content:flex-end!important;
gap:18px!important;
}
.contact-landing-actions-v135 a{
min-height:0!important;
padding:0!important;
border:0!important;
background:transparent!important;
box-shadow:none!important;
transform:none!important;
}
.contact-landing-actions-v135 .contact-call{
color:#fff!important;
font-size:clamp(20px,2vw,28px)!important;
white-space:nowrap!important;
}
.contact-landing-actions-v135 .contact-call .header-icon{display:none!important}
.contact-landing-actions-v135 .contact-whatsapp{
width:48px!important;
height:48px!important;
flex:0 0 48px!important;
display:grid!important;
place-items:center!important;
color:#fff!important;
border-radius:50%!important;
}
.contact-landing-actions-v135 .contact-whatsapp .header-icon{
width:42px!important;
height:42px!important;
flex-basis:42px!important;
}
@media(max-width:900px){
.contact-landing-actions-v135{
display:flex!important;
justify-content:flex-start!important;
gap:16px!important;
}
.contact-landing-actions-v135 .contact-call{font-size:22px!important}
.contact-landing-actions-v135 .contact-whatsapp{
width:44px!important;
height:44px!important;
flex-basis:44px!important;
}
.contact-landing-actions-v135 .contact-whatsapp .header-icon{
width:38px!important;
height:38px!important;
flex-basis:38px!important;
}
}
/* V139 terms landing — keep the complete title and introduction above the fold. */
@media(max-width:760px){
.subhero.info-hero-v138 .subheroCopy{
display:block!important;
padding:22px 0 24px!important;
}
.subhero.info-hero-v138 .subheroCopy .wrap{
width:90vw!important;
margin:0 auto!important;
}
.subhero.info-hero-v138 h1{
margin:7px 0 12px!important;
font-size:clamp(32px,9.5vw,42px)!important;
line-height:.96!important;
letter-spacing:-.035em!important;
}
.subhero.info-hero-v138 p{
margin:0!important;
font-size:16px!important;
line-height:1.42!important;
}
}
/* =========================================================
V140 — DESKTOP HOMEPAGE LANDING FIT
Keep the complete hero + Google review strip within the
initial desktop viewport beneath the 96px fixed header.
Mobile/tablet behaviour is intentionally untouched.
========================================================= */
@media (min-width:1181px) and (hover:hover) and (pointer:fine){
.hero{
height:clamp(520px,calc(100svh - 184px),665px)!important;
min-height:520px!important;
max-height:665px!important;
}
.heroCopy{
height:100%!important;
justify-content:center!important;
padding-top:28px!important;
padding-bottom:22px!important;
}
.hero .eyebrow{margin-bottom:10px!important}
.hero h1{
font-size:clamp(64px,5.4vw,84px)!important;
line-height:.91!important;
margin:0 0 20px!important;
}
.heroCopy>p{
font-size:17px!important;
line-height:1.45!important;
max-width:660px!important;
margin:0!important;
}
.heroActions{margin-top:20px!important}
.hero-punch-v52{margin-top:12px!important}
.heroMeta{margin-top:14px!important;padding-top:12px!important}
.home-review-strip{min-height:88px!important}
.home-review-inner{min-height:88px!important}
}
/* Extra tightening for shorter laptop screens. */
@media (min-width:1181px) and (max-height:780px) and (hover:hover) and (pointer:fine){
.hero{
height:calc(100svh - 184px)!important;
min-height:510px!important;
}
.heroCopy{padding-top:18px!important;padding-bottom:16px!important}
.hero h1{font-size:clamp(58px,4.9vw,74px)!important;margin-bottom:15px!important}
.heroCopy>p{font-size:16px!important;line-height:1.4!important}
.heroActions{margin-top:15px!important}
.hero-punch-v52{margin-top:9px!important}
.heroMeta{margin-top:10px!important;padding-top:10px!important;font-size:11px!important}
}
/* V142 — mobile menu WhatsApp row: keep icon + label together */
@media(max-width:900px){
body>.mobile-nav-panel.open>a.wa.walink{
justify-content:center!important;
gap:10px!important;
color:#B0BC70!important;
border-bottom:0!important;
padding:16px 2px 10px!important;
}
body>.mobile-nav-panel.open>a.wa.walink .waicon{
width:1.45em!important;
height:1.45em!important;
flex:0 0 auto!important;
}
body>.mobile-nav-panel.open>a.wa.walink span{
margin:0!important;
}
}
/* =========================================================
V143 — DESKTOP FIRST-SCREEN COMPLETE INFO FIT
V140 allowed for a 96px header, but the approved desktop
header is 160px. Reserve the real header + review-strip
height so the service/category line remains above the fold.
True desktop only; iPad/mobile are intentionally untouched.
========================================================= */
@media (min-width:1181px) and (hover:hover) and (pointer:fine){
.hero{
height:clamp(480px,calc(100svh - 248px),640px)!important;
min-height:480px!important;
max-height:640px!important;
}
.heroCopy{
justify-content:center!important;
padding-top:18px!important;
padding-bottom:14px!important;
}
.hero .eyebrow{margin-bottom:7px!important}
.hero h1{
font-size:clamp(58px,4.8vw,76px)!important;
line-height:.91!important;
margin:0 0 13px!important;
}
.heroCopy>p{
font-size:16px!important;
line-height:1.38!important;
margin:0!important;
}
.heroActions{margin-top:13px!important}
.hero-punch-v52{margin-top:8px!important;min-height:18px!important}
.heroMeta{
display:block!important;
margin-top:8px!important;
padding-top:8px!important;
font-size:11px!important;
line-height:1.35!important;
}
.home-review-strip,.home-review-inner{min-height:88px!important}
}
@media (min-width:1181px) and (max-height:760px) and (hover:hover) and (pointer:fine){
.hero{
height:max(455px,calc(100svh - 248px))!important;
min-height:455px!important;
}
.hero h1{font-size:clamp(54px,4.5vw,68px)!important;margin-bottom:10px!important}
.heroCopy>p{font-size:15px!important;line-height:1.34!important}
.heroActions{margin-top:10px!important}
.hero-punch-v52{margin-top:6px!important}
.heroMeta{margin-top:6px!important;padding-top:6px!important;font-size:10.5px!important}
}
/* V144 — definitive mobile-menu WhatsApp structure fix.
The icon + label are one centred unit, so generic menu spacing cannot split them. */
@media(max-width:900px){
body>.mobile-nav-panel.open>a.wa.walink{
display:flex!important;
justify-content:center!important;
align-items:center!important;
text-align:center!important;
}
body>.mobile-nav-panel.open>a.wa.walink>.mobile-menu-wa-inner{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:9px!important;
margin:0!important;
width:auto!important;
}
body>.mobile-nav-panel.open>a.wa.walink>.mobile-menu-wa-inner>.waicon{
width:22px!important;
height:22px!important;
flex:0 0 22px!important;
margin:0!important;
}
body>.mobile-nav-panel.open>a.wa.walink>.mobile-menu-wa-inner>span{
margin:0!important;
width:auto!important;
}
}
/* =========================================================
V145 — MOBILE HOMEPAGE FIRST-SCREEN REVIEW FIT
Compact only the homepage hero so the entire Google review
card remains above the fixed WhatsApp / Call / Quote bar.
Other mobile pages are intentionally untouched.
========================================================= */
@media(max-width:800px){
body.home-v147 .heroCopy{
justify-content:flex-start!important;
padding-top:34px!important;
padding-bottom:calc(82px + env(safe-area-inset-bottom))!important;
}
body.home-v147 .hero .eyebrow{margin-bottom:6px!important}
body.home-v147 .hero h1{
font-size:clamp(36px,10vw,47px)!important;
line-height:.9!important;
margin-bottom:10px!important;
}
body.home-v147 .heroCopy>p{
font-size:13px!important;
line-height:1.32!important;
max-width:96%!important;
margin:0!important;
}
body.home-v147 .heroActions{
margin-top:10px!important;
gap:7px!important;
}
body.home-v147 .heroActions .btn{
min-height:42px!important;
padding:10px 12px!important;
font-size:11px!important;
}
body.home-v147 .heroActions .phone{
width:100%!important;
margin:1px 0 0!important;
font-size:18px!important;
line-height:1!important;
}
body.home-v147 .hero-review-mobile{
margin-top:10px!important;
padding:9px 11px 10px!important;
}
body.home-v147 .hero-review-stars{
font-size:12px!important;
gap:7px!important;
}
body.home-v147 .hero-review-stars b{font-size:8.5px!important}
body.home-v147 .hero-review-stage{
height:34px!important;
margin-top:5px!important;
}
body.home-v147 .hero-review-quote{
font-size:11.5px!important;
line-height:1.28!important;
}
}
@media(max-width:420px){
body.home-v147 .heroCopy{
padding-top:22px!important;
padding-bottom:calc(78px + env(safe-area-inset-bottom))!important;
}
body.home-v147 .hero h1{font-size:36px!important;margin-bottom:9px!important}
body.home-v147 .heroCopy>p{font-size:12.5px!important;line-height:1.28!important}
body.home-v147 .heroActions{margin-top:9px!important}
body.home-v147 .heroActions .btn{min-height:40px!important;padding:9px 10px!important}
body.home-v147 .heroActions .phone{font-size:17px!important}
body.home-v147 .hero-review-mobile{margin-top:8px!important;padding:8px 10px 9px!important}
body.home-v147 .hero-review-stage{height:32px!important}
body.home-v147 .hero-review-quote{font-size:11px!important;line-height:1.24!important}
}
/* =========================================================
V146 — UNIFORM HOMEPAGE SOCIAL PROOF ON IPAD/TABLET
Show the same compact Google review card in the initial
homepage landing on tablets, while keeping it fully inside
the available viewport. The separate review strip is hidden
on tablet when the in-hero card is present to avoid doubling.
========================================================= */
@media (min-width:801px) and (max-width:1180px){
body.home-v147 .hero{
height:calc(100svh - 132px)!important;
min-height:600px!important;
max-height:760px!important;
}
body.home-v147 .heroCopy{
height:100%!important;
justify-content:center!important;
padding-top:24px!important;
padding-bottom:24px!important;
}
body.home-v147 .hero .eyebrow{margin-bottom:8px!important}
body.home-v147 .hero h1{
font-size:clamp(52px,7vw,68px)!important;
line-height:.91!important;
margin:0 0 14px!important;
}
body.home-v147 .heroCopy>p{
font-size:15px!important;
line-height:1.38!important;
max-width:620px!important;
margin:0!important;
}
body.home-v147 .heroActions{margin-top:13px!important;gap:9px!important}
body.home-v147 .heroActions .btn{padding:11px 14px!important}
body.home-v147 .heroActions .phone{font-size:21px!important;margin-left:2px!important}
body.home-v147 .hero-punch-v52{margin-top:9px!important;min-height:18px!important}
body.home-v147 .heroMeta{
display:block!important;
margin-top:8px!important;
padding-top:8px!important;
font-size:10.5px!important;
line-height:1.35!important;
}
body.home-v147 .hero-review-mobile{
display:block!important;
width:min(620px,100%)!important;
margin-top:10px!important;
padding:9px 12px 10px!important;
border:1px solid rgba(176,188,112,.65)!important;
background:rgba(13,23,77,.86)!important;
color:#fff!important;
text-decoration:none!important;
backdrop-filter:blur(5px)!important;
}
body.home-v147 .hero-review-stars{
display:flex!important;
align-items:center!important;
gap:8px!important;
color:#B0BC70!important;
font-size:12px!important;
letter-spacing:.08em!important;
}
body.home-v147 .hero-review-stars b{font-size:8.5px!important;letter-spacing:.13em!important;color:#fff!important}
body.home-v147 .hero-review-stage{
display:block!important;
position:relative!important;
height:34px!important;
margin-top:5px!important;
overflow:hidden!important;
}
body.home-v147 .hero-review-quote{
font-size:11.5px!important;
line-height:1.28!important;
}
body.home-v147 + .home-review-strip,
body.home-v147 .home-review-strip{display:none!important}
}
/* iPad Pro landscape can expose a desktop-sized CSS viewport. */
@media (min-width:1181px) and (max-width:1366px) and (hover:none) and (pointer:coarse){
body.home-v147 .hero{
height:calc(100svh - 160px)!important;
min-height:600px!important;
max-height:760px!important;
}
body.home-v147 .heroCopy{
height:100%!important;
justify-content:center!important;
padding-top:22px!important;
padding-bottom:22px!important;
}
body.home-v147 .hero h1{
font-size:clamp(56px,5vw,70px)!important;
line-height:.91!important;
margin-bottom:12px!important;
}
body.home-v147 .heroCopy>p{font-size:15px!important;line-height:1.36!important;margin:0!important}
body.home-v147 .heroActions{margin-top:12px!important}
body.home-v147 .hero-punch-v52{margin-top:8px!important}
body.home-v147 .heroMeta{display:block!important;margin-top:7px!important;padding-top:7px!important;font-size:10.5px!important}
body.home-v147 .hero-review-mobile{
display:block!important;
width:min(620px,100%)!important;
margin-top:9px!important;
padding:8px 11px 9px!important;
border:1px solid rgba(176,188,112,.65)!important;
background:rgba(13,23,77,.86)!important;
color:#fff!important;
text-decoration:none!important;
}
body.home-v147 .hero-review-stars{display:flex!important;align-items:center!important;gap:8px!important;color:#B0BC70!important;font-size:12px!important}
body.home-v147 .hero-review-stars b{font-size:8.5px!important;color:#fff!important}
body.home-v147 .hero-review-stage{display:block!important;position:relative!important;height:32px!important;margin-top:5px!important;overflow:hidden!important}
body.home-v147 .hero-review-quote{font-size:11.5px!important;line-height:1.25!important}
body.home-v147 .home-review-strip{display:none!important}
}
/* =========================================================
V147 — IPAD REVIEW CARD: READABLE, NOT SQUASHED
Keep the same first-land social proof as phone/desktop,
but give the tablet card enough height to show a complete
review. Rebalance the hero copy rather than crushing text.
========================================================= */
@media (min-width:801px) and (max-width:1180px){
body.home-v147 .heroCopy{
justify-content:flex-start!important;
padding-top:clamp(24px,4vh,42px)!important;
padding-bottom:22px!important;
}
body.home-v147 .hero h1{margin-bottom:10px!important}
body.home-v147 .heroActions{margin-top:10px!important}
body.home-v147 .hero-punch-v52{margin-top:7px!important}
body.home-v147 .heroMeta{margin-top:6px!important;padding-top:6px!important}
body.home-v147 .hero-review-mobile{
width:min(640px,100%)!important;
margin-top:12px!important;
padding:12px 14px 14px!important;
}
body.home-v147 .hero-review-stars{font-size:15px!important;gap:10px!important}
body.home-v147 .hero-review-stars b{font-size:10px!important}
body.home-v147 .hero-review-stage{
height:58px!important;
margin-top:8px!important;
overflow:hidden!important;
}
body.home-v147 .hero-review-quote{
font-size:13px!important;
line-height:1.38!important;
align-items:flex-start!important;
}
}
/* iPad Pro landscape: Safari exposes a desktop-width viewport. */
@media (min-width:1181px) and (max-width:1366px) and (hover:none) and (pointer:coarse){
body.home-v147 .heroCopy{
justify-content:flex-start!important;
padding-top:clamp(28px,5vh,48px)!important;
padding-bottom:22px!important;
}
body.home-v147 .hero h1{margin-bottom:10px!important}
body.home-v147 .heroActions{margin-top:10px!important}
body.home-v147 .hero-punch-v52{margin-top:7px!important}
body.home-v147 .heroMeta{margin-top:6px!important;padding-top:6px!important}
body.home-v147 .hero-review-mobile{
width:min(640px,100%)!important;
margin-top:12px!important;
padding:12px 14px 14px!important;
}
body.home-v147 .hero-review-stars{font-size:15px!important;gap:10px!important}
body.home-v147 .hero-review-stars b{font-size:10px!important}
body.home-v147 .hero-review-stage{
height:58px!important;
margin-top:8px!important;
overflow:hidden!important;
}
body.home-v147 .hero-review-quote{
font-size:13px!important;
line-height:1.38!important;
align-items:flex-start!important;
}
}
/* =========================================================
V148 — TRUE DESKTOP REFINEMENT PASS
Desktop-only polish. Tablet/mobile layouts are intentionally untouched.
========================================================= */
@media (min-width:1181px) and (hover:hover) and (pointer:fine){
body{
-webkit-font-smoothing:antialiased;
text-rendering:optimizeLegibility;
}
/* Keep long desktop pages feeling designed rather than stretched. */
.section > .wrap,
.reviewSection > .wrap,
.callout > .wrap,
.footer > .wrap{
width:min(1180px,88vw)!important;
max-width:1180px!important;
}
/* Contact: one cohesive enquiry area rather than loose blocks. */
.contact-form-first-v135{
padding-bottom:78px!important;
background:linear-gradient(180deg,#F5F6F1 0%,#FFFFFF 72%)!important;
}
.contact-form-first-v135 .contact-layout{
width:min(1140px,88vw)!important;
max-width:1140px!important;
grid-template-columns:minmax(0,1fr) 320px!important;
gap:40px!important;
align-items:start!important;
}
.contact-form-first-v135 .contactform{
padding:38px 40px 34px!important;
border-radius:20px!important;
background:#fff!important;
box-shadow:0 18px 48px rgba(13,23,77,.13)!important;
}
.contact-form-first-v135 .contactform .form-intro{
padding-bottom:24px!important;
margin-bottom:26px!important;
border-bottom:1px solid #E1E4DA!important;
}
.contact-form-first-v135 .contactform .form-intro h3{
margin-bottom:10px!important;
max-width:720px!important;
}
.contact-form-first-v135 .contactform .form-row{
gap:20px!important;
margin-bottom:20px!important;
}
.contact-form-first-v135 .contactform input,
.contact-form-first-v135 .contactform select,
.contact-form-first-v135 .contactform textarea{
border:1px solid #CCD2C3!important;
border-radius:10px!important;
background:#FBFCF8!important;
box-shadow:inset 0 1px 0 rgba(13,23,77,.025)!important;
}
.contact-form-first-v135 .contactform input:focus,
.contact-form-first-v135 .contactform select:focus,
.contact-form-first-v135 .contactform textarea:focus{
border-color:#8F9D57!important;
box-shadow:0 0 0 3px rgba(176,188,112,.22)!important;
background:#fff!important;
}
.contact-form-first-v135 .contactform .form-submit{
border-radius:10px!important;
letter-spacing:.045em!important;
}
.contact-form-first-v135 .contact-details{
position:sticky!important;
top:128px!important;
margin-top:0!important;
padding:30px 28px!important;
border-left:0!important;
border-top:5px solid #B0BC70!important;
border-radius:16px!important;
background:#0D174D!important;
color:#fff!important;
box-shadow:0 16px 38px rgba(13,23,77,.14)!important;
}
.contact-form-first-v135 .contact-details h2,
.contact-form-first-v135 .contact-details .eyebrow,
.contact-form-first-v135 .contact-details a,
.contact-form-first-v135 .contact-details b{
color:#fff!important;
}
.contact-form-first-v135 .contact-details .eyebrow{color:#B0BC70!important}
.contact-form-first-v135 .contact-details p{color:#E7EAF2!important}
.contact-form-first-v135 .contact-details .personality{
background:rgba(255,255,255,.07)!important;
border-left:3px solid #B0BC70!important;
border-radius:0 10px 10px 0!important;
}
/* Give standard desktop content blocks a little more finish without
changing their tablet/mobile appearance or page structure. */
.tile{
border-radius:14px!important;
box-shadow:0 10px 28px rgba(13,23,77,.055)!important;
}
.areaCards a{
border-radius:14px!important;
box-shadow:0 12px 28px rgba(13,23,77,.10)!important;
}
}
/* V150 — desktop contact form delivery-details row */
@media (min-width: 1101px) and (hover:hover) and (pointer:fine){
.contact-form-first-v135 .contactform .delivery-details-row{
grid-template-columns:minmax(180px,.85fr) minmax(280px,1.35fr) minmax(170px,.72fr)!important;
gap:18px!important;
align-items:end!important;
}
.contact-form-first-v135 .contactform .delivery-details-row .postcode-field{
max-width:220px!important;
justify-self:start!important;
}
.contact-form-first-v135 .contactform .delivery-details-row #postcode{
width:100%!important;
max-width:220px!important;
}
}
/* =========================================================
V151 — IPAD HOMEPAGE: STOP FORCING REVIEWS INTO THE HERO
Restore comfortable spacing on iPad/tablet. Reviews sit
naturally below the hero and may fall below the first screen.
========================================================= */
@media (min-width:801px) and (max-width:1180px){
body.home-v147 .hero{
height:auto!important;
min-height:clamp(620px,72svh,760px)!important;
max-height:none!important;
}
body.home-v147 .heroCopy{
height:auto!important;
min-height:inherit!important;
justify-content:center!important;
padding-top:48px!important;
padding-bottom:52px!important;
}
body.home-v147 .hero .eyebrow{margin-bottom:14px!important}
body.home-v147 .hero h1{
margin-bottom:20px!important;
line-height:.94!important;
}
body.home-v147 .heroCopy>p{
margin:0!important;
line-height:1.5!important;
}
body.home-v147 .heroActions{
margin-top:22px!important;
gap:12px!important;
}
body.home-v147 .hero-punch-v52{margin-top:16px!important}
body.home-v147 .heroMeta{
margin-top:12px!important;
padding-top:12px!important;
}
body.home-v147 .hero-review-mobile{display:none!important}
body.home-v147 .home-review-strip{display:block!important}
}
@media (min-width:1181px) and (max-width:1366px) and (hover:none) and (pointer:coarse){
body.home-v147 .hero{
height:auto!important;
min-height:clamp(620px,72svh,760px)!important;
max-height:none!important;
}
body.home-v147 .heroCopy{
height:auto!important;
min-height:inherit!important;
justify-content:center!important;
padding-top:50px!important;
padding-bottom:54px!important;
}
body.home-v147 .hero .eyebrow{margin-bottom:14px!important}
body.home-v147 .hero h1{
margin-bottom:20px!important;
line-height:.94!important;
}
body.home-v147 .heroCopy>p{
margin:0!important;
line-height:1.5!important;
}
body.home-v147 .heroActions{
margin-top:22px!important;
gap:12px!important;
}
body.home-v147 .hero-punch-v52{margin-top:16px!important}
body.home-v147 .heroMeta{
margin-top:12px!important;
padding-top:12px!important;
}
body.home-v147 .hero-review-mobile{display:none!important}
body.home-v147 .home-review-strip{display:block!important}
}
/* =========================================================
V152 — MOBILE HOMEPAGE BREATHING ROOM
Mobile only. iPad/tablet rules from V151 remain untouched.
Stop compressing the hero to force reviews into first view.
========================================================= */
@media (max-width:800px){
body.home-v147 .hero{
height:auto!important;
min-height:calc(100svh - 78px)!important;
max-height:none!important;
}
body.home-v147 .heroCopy{
justify-content:center!important;
padding-top:48px!important;
padding-bottom:calc(92px + env(safe-area-inset-bottom))!important;
}
body.home-v147 .hero .eyebrow{
margin-bottom:12px!important;
}
body.home-v147 .hero h1{
font-size:clamp(42px,12vw,54px)!important;
line-height:.92!important;
margin:0 0 18px!important;
}
body.home-v147 .heroCopy>p{
font-size:15px!important;
line-height:1.46!important;
max-width:100%!important;
margin:0!important;
}
body.home-v147 .heroActions{
margin-top:20px!important;
gap:10px!important;
}
body.home-v147 .heroActions .btn{
min-height:44px!important;
padding:11px 14px!important;
font-size:11px!important;
}
body.home-v147 .heroActions .phone{
width:100%!important;
margin:5px 0 0!important;
font-size:20px!important;
line-height:1.05!important;
}
body.home-v147 .hero-punch-v52{
margin-top:16px!important;
min-height:18px!important;
}
body.home-v147 .heroMeta{
display:block!important;
margin-top:13px!important;
padding-top:11px!important;
font-size:10.5px!important;
line-height:1.45!important;
}
body.home-v147 .hero-review-mobile{
display:none!important;
}
body.home-v147 .home-review-strip{
display:block!important;
}
}
@media (max-width:420px){
body.home-v147 .heroCopy{
padding-top:40px!important;
padding-bottom:calc(88px + env(safe-area-inset-bottom))!important;
}
body.home-v147 .hero h1{
font-size:clamp(40px,12vw,48px)!important;
margin-bottom:16px!important;
}
body.home-v147 .heroCopy>p{
font-size:14.5px!important;
line-height:1.44!important;
}
body.home-v147 .heroActions{
margin-top:18px!important;
}
body.home-v147 .hero-punch-v52{
margin-top:14px!important;
}
body.home-v147 .heroMeta{
margin-top:11px!important;
padding-top:10px!important;
}
}
/* =========================================================
V153 — TRUE DESKTOP VISUAL REFINEMENT
Desktop/laptop ONLY. V151 iPad + V152 mobile are locked.
========================================================= */
@media (min-width:1181px) and (hover:hover) and (pointer:fine){
/* More confident desktop canvas */
body:not(.home-v147) main{
background:
linear-gradient(180deg,rgba(176,188,112,.055),rgba(255,255,255,0) 260px);
}
body:not(.home-v147) .wrap{
max-width:1180px;
}
/* Page introductions: less document-like, more intentional */
body:not(.home-v147) .pageHero,
body:not(.home-v147) .page-hero,
body:not(.home-v147) .innerHero,
body:not(.home-v147) .inner-hero{
padding-top:72px!important;
padding-bottom:68px!important;
}
body:not(.home-v147) h1{
letter-spacing:-.025em;
}
body:not(.home-v147) h2{
letter-spacing:-.018em;
}
/* Give desktop sections rhythm instead of long text stacks */
body:not(.home-v147) section{
padding-top:64px;
padding-bottom:64px;
}
body:not(.home-v147) .section,
body:not(.home-v147) .panel,
body:not(.home-v147) .card{
border-radius:18px;
}
/* Cards feel like designed website components */
body:not(.home-v147) .card,
body:not(.home-v147) .infoCard,
body:not(.home-v147) .info-card,
body:not(.home-v147) .serviceCard,
body:not(.home-v147) .service-card{
box-shadow:0 12px 34px rgba(13,23,77,.08);
border:1px solid rgba(13,23,77,.08);
}
/* Contact desktop: balanced and polished */
body.contact-form-first-v135 .contact-shell,
body.contact-form-first-v135 .contactShell{
max-width:1120px!important;
margin-left:auto!important;
margin-right:auto!important;
}
body.contact-form-first-v135 .contactform{
padding:34px 38px 38px!important;
border-radius:22px!important;
box-shadow:0 18px 46px rgba(13,23,77,.11)!important;
border:1px solid rgba(13,23,77,.08)!important;
}
body.contact-form-first-v135 .contactform label{
font-weight:800!important;
letter-spacing:.01em!important;
}
body.contact-form-first-v135 .contactform input,
body.contact-form-first-v135 .contactform select,
body.contact-form-first-v135 .contactform textarea{
min-height:50px!important;
border-radius:10px!important;
border:1px solid rgba(13,23,77,.18)!important;
background:#fff!important;
}
body.contact-form-first-v135 .contactform textarea{
min-height:128px!important;
}
body.contact-form-first-v135 .contactform input:focus,
body.contact-form-first-v135 .contactform select:focus,
body.contact-form-first-v135 .contactform textarea:focus{
border-color:#0D174D!important;
box-shadow:0 0 0 3px rgba(176,188,112,.28)!important;
outline:none!important;
}
/* Keep V150's sensible delivery details row */
body.contact-form-first-v135 .contactform .delivery-row-v150{
grid-template-columns:minmax(180px,.8fr) minmax(280px,1.35fr) minmax(170px,.72fr)!important;
gap:18px!important;
align-items:end!important;
}
/* Desktop homepage: retain structure, just polish */
body.home-v147 .heroCopy{
max-width:720px;
}
body.home-v147 .heroActions{
gap:12px;
}
body.home-v147 .home-review-strip{
box-shadow:0 10px 30px rgba(13,23,77,.08);
}
/* Buttons feel less default/template-like */
.btn{
border-radius:10px;
transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}
.btn:hover{
transform:translateY(-2px);
box-shadow:0 8px 20px rgba(13,23,77,.16);
}
}
/* =========================================================
V154 — DESKTOP HEADER WHATSAPP ALIGNMENT
True desktop only. Mobile V152 + iPad V151 remain locked.
========================================================= */
@media (min-width:1181px) and (hover:hover) and (pointer:fine){
.top .topcontacts .topwa{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:8px!important;
height:46px!important;
min-height:46px!important;
padding:0 15px!important;
margin:0!important;
line-height:1!important;
vertical-align:middle!important;
}
.top .topcontacts .topwa .header-icon{
display:block!important;
width:21px!important;
height:21px!important;
flex:0 0 21px!important;
margin:0!important;
transform:none!important;
}
.top .topcontacts .topwa span{
display:block!important;
margin:0!important;
padding:0!important;
line-height:1!important;
}
}
/* =========================================================
V155 — ACTUAL HEADER WHATSAPP BUTTON
Dedicated selector, desktop + iPad header only (>900px).
Does NOT touch dropdown, floating WhatsApp or sticky bar.
========================================================= */
@media (min-width:901px){
.top a.header-wa-v155{
box-sizing:border-box!important;
display:inline-flex!important;
flex-direction:row!important;
align-items:center!important;
justify-content:center!important;
gap:8px!important;
min-width:126px!important;
width:auto!important;
height:48px!important;
min-height:48px!important;
padding:0 14px!important;
margin:0!important;
border:0!important;
border-radius:8px!important;
background:#B0BC70!important;
color:#0D174D!important;
font-size:14px!important;
font-weight:900!important;
line-height:1!important;
text-decoration:none!important;
white-space:nowrap!important;
vertical-align:middle!important;
}
.top a.header-wa-v155 > svg.header-icon{
display:block!important;
position:static!important;
width:22px!important;
height:22px!important;
min-width:22px!important;
flex:0 0 22px!important;
margin:0!important;
padding:0!important;
transform:none!important;
align-self:center!important;
}
.top a.header-wa-v155 > span{
display:block!important;
position:static!important;
margin:0!important;
padding:1px 0 0!important;
font-size:14px!important;
font-weight:900!important;
line-height:1!important;
transform:none!important;
align-self:center!important;
}
}
/* =========================================================
V156 — VISIBLE HEADER WHATSAPP ALIGNMENT
The live desktop/iPad header uses .nav > .wa.walink.
Previous .topcontacts WhatsApp is hidden at these widths.
========================================================= */
@media (min-width:961px){
.top .nav > a.wa.walink{
box-sizing:border-box!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
width:auto!important;
min-width:116px!important;
height:42px!important;
min-height:42px!important;
padding:0 13px!important;
margin-top:0!important;
margin-bottom:0!important;
line-height:1!important;
vertical-align:middle!important;
}
.top .nav > a.wa.walink > .mobile-menu-wa-inner{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:7px!important;
width:auto!important;
height:22px!important;
margin:0!important;
padding:0!important;
line-height:1!important;
transform:none!important;
}
.top .nav > a.wa.walink > .mobile-menu-wa-inner > .waicon{
display:block!important;
position:static!important;
width:18px!important;
height:18px!important;
min-width:18px!important;
flex:0 0 18px!important;
margin:0!important;
padding:0!important;
transform:none!important;
vertical-align:middle!important;
}
.top .nav > a.wa.walink > .mobile-menu-wa-inner > span{
display:block!important;
position:static!important;
margin:0!important;
padding:1px 0 0!important;
line-height:1!important;
transform:none!important;
white-space:nowrap!important;
}
}
/* =========================================================
V158 — MOBILE ORIGINAL HERO, ICE-FOCUSED CROP
Original hero restored. Mobile only: zoom toward the bright
ice area so the image holds up better beneath the gradient.
Desktop + iPad remain unchanged.
========================================================= */
@media (max-width:800px){
body.home-v147 .hero .heroimg{
width:100%!important;
height:100%!important;
object-fit:cover!important;
object-position:50% 58%!important;
transform:scale(1.24)!important;
transform-origin:50% 58%!important;
}
}
/* =========================================================
V159 — MOBILE HERO: BRIGHT ICE CLOSE-UP, BRAND BLURRED
Desktop + iPad remain on the existing approved hero.
========================================================= */
.hero-picture-v159{
position:absolute;
inset:0;
display:block;
width:100%;
height:100%;
}
.hero-picture-v159 .heroimg{
width:100%;
height:100%;
}
@media (max-width:800px){
body.home-v147 .hero .hero-picture-v159{
position:absolute!important;
inset:0!important;
width:100%!important;
height:100%!important;
overflow:hidden!important;
}
body.home-v147 .hero .hero-picture-v159 .heroimg{
width:100%!important;
height:100%!important;
object-fit:cover!important;
object-position:center center!important;
transform:none!important;
}
}
/* =========================================================
V160 — MOBILE HERO CLEAN-UP
Removes the generated image that had baked-in text.
Uses the original approved hero photo, cropped much tighter
into the bright ice. Desktop + iPad remain unchanged.
========================================================= */
@media (max-width:800px){
body.home-v147 .hero{
overflow:hidden!important;
}
body.home-v147 .hero .heroimg{
width:100%!important;
height:100%!important;
object-fit:cover!important;
object-position:56% 58%!important;
transform:scale(1.58)!important;
transform-origin:56% 58%!important;
filter:brightness(1.12) saturate(1.02)!important;
}
/* Make the small line above the headline properly legible,
without putting it in a box. */
body.home-v147 .hero .eyebrow{
display:block!important;
color:#D2DC78!important;
font-size:13px!important;
font-weight:900!important;
letter-spacing:.16em!important;
line-height:1.25!important;
margin-bottom:15px!important;
text-shadow:0 1px 3px rgba(13,23,77,.75)!important;
}
}
@media (max-width:420px){
body.home-v147 .hero .heroimg{
object-position:57% 58%!important;
transform:scale(1.66)!important;
transform-origin:57% 58%!important;
}
body.home-v147 .hero .eyebrow{
font-size:12.5px!important;
letter-spacing:.145em!important;
}
}
/* =========================================================
V161 — BRANDS & VENUES MOBILE PIG HERO
Mobile only. Make THE PIG image read as a full hero image,
not a portrait thumbnail/card. V160 homepage remains locked.
========================================================= */
@media (max-width:800px){
body .pig-sign-hero,
body .pigSignHero,
body .pig-sign-wrap,
body .pigSignWrap{
width:100%!important;
max-width:none!important;
margin-left:0!important;
margin-right:0!important;
}
body img[src*="real-pig-sign.jpg"]{
display:block!important;
width:100%!important;
max-width:none!important;
height:clamp(300px,56vw,430px)!important;
object-fit:cover!important;
object-position:center center!important;
margin:0!important;
border-radius:0!important;
}
}
/* =========================================================
V162 — BRANDS & VENUES MOBILE PIG HERO FOCAL CROP
Mobile only. Keep the actual gold pig + THE PIG sign in view.
V160 homepage remains locked; desktop/iPad unchanged.
========================================================= */
@media (max-width:800px){
body img[src*="real-pig-sign.jpg"]{
display:block!important;
width:100%!important;
max-width:none!important;
height:clamp(300px,62vw,430px)!important;
object-fit:cover!important;
object-position:50% 18%!important;
margin:0!important;
border-radius:0!important;
}
}
/* =========================================================
V164 — FESTIVALS & LARGE EVENTS
Structured proof, real-event imagery and operational detail
without isolated cards or empty gallery space.
========================================================= */
.festival-intro-v164 .split{
align-items:end;
}
.festival-proof-v164{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
margin-top:48px;
border-top:1px solid rgba(13,23,77,.18);
border-bottom:1px solid rgba(13,23,77,.18);
}
.festival-proof-v164>div{
min-width:0;
padding:24px 22px 26px;
border-left:1px solid rgba(13,23,77,.18);
}
.festival-proof-v164>div:first-child{
border-left:0;
}
.festival-proof-v164 strong,
.festival-proof-v164 span{
display:block;
}
.festival-proof-v164 strong{
color:var(--navy);
font-family:'Audiowide',Arial,sans-serif;
font-size:13px;
line-height:1.3;
letter-spacing:.06em;
}
.festival-proof-v164 span{
margin-top:9px;
color:#5c657d;
font-size:14px;
line-height:1.48;
}
.festival-work-v164 .eyebrow{
color:var(--green);
}
.festival-work-v164 h2{
max-width:980px;
}
.festival-gallery-v164{
display:grid;
grid-template-columns:minmax(0,7fr) minmax(0,5fr);
grid-template-rows:repeat(2,minmax(238px,1fr));
gap:12px;
margin-top:38px;
}
.festival-gallery-v164 figure{
position:relative;
min-width:0;
min-height:238px;
margin:0;
overflow:hidden;
background:#071038;
}
.festival-gallery-v164 figure:first-child{
grid-row:1 / 3;
min-height:488px;
}
.festival-gallery-v164 img{
display:block;
width:100%;
height:100%;
min-height:238px;
object-fit:cover;
transition:transform .45s ease;
}
.festival-gallery-v164 figure:first-child img{
min-height:488px;
}
.festival-gallery-v164 figure:hover img{
transform:scale(1.02);
}
.festival-gallery-v164 figcaption{
position:absolute;
left:0;
bottom:0;
padding:12px 15px 11px;
border-top:2px solid var(--green);
background:rgba(13,23,77,.94);
color:#fff;
font-size:12px;
font-weight:900;
line-height:1.25;
letter-spacing:.08em;
text-transform:uppercase;
}
.festival-logistics-v164 .split{
align-items:start;
}
.festival-ops-v164{
margin-top:28px;
border-top:1px solid rgba(13,23,77,.2);
}
.festival-ops-v164>div{
display:grid;
grid-template-columns:54px minmax(0,1fr);
gap:18px;
align-items:start;
padding:18px 0;
border-bottom:1px solid rgba(13,23,77,.2);
}
.festival-ops-v164 span{
color:var(--green);
font-family:'Audiowide',Arial,sans-serif;
font-size:16px;
line-height:1.4;
}
.festival-ops-v164 p{
margin:0;
color:#59627a;
font-size:16px;
line-height:1.55;
}
.festival-ops-v164 strong{
display:block;
margin-bottom:3px;
color:var(--navy);
font-size:17px;
}
@media(max-width:900px){
.festival-proof-v164{
grid-template-columns:repeat(2,minmax(0,1fr));
}
.festival-proof-v164>div:nth-child(3){
border-left:0;
border-top:1px solid rgba(13,23,77,.18);
}
.festival-proof-v164>div:nth-child(4){
border-top:1px solid rgba(13,23,77,.18);
}
.festival-gallery-v164{
grid-template-rows:repeat(2,minmax(204px,1fr));
}
.festival-gallery-v164 figure:first-child,
.festival-gallery-v164 figure:first-child img{
min-height:420px;
}
}
@media(max-width:620px){
.festival-proof-v164{
margin-top:28px;
}
.festival-proof-v164>div{
padding:17px 14px 19px;
}
.festival-proof-v164 strong{
font-size:11px;
}
.festival-proof-v164 span{
font-size:12.5px;
}
.festival-gallery-v164{
grid-template-columns:repeat(2,minmax(0,1fr));
grid-template-rows:auto;
gap:7px;
margin-top:24px;
}
.festival-gallery-v164 figure,
.festival-gallery-v164 figure img{
min-height:170px;
height:170px;
}
.festival-gallery-v164 figure:first-child{
grid-column:1 / -1;
grid-row:auto;
}
.festival-gallery-v164 figure:first-child,
.festival-gallery-v164 figure:first-child img{
min-height:280px;
height:280px;
}
.festival-gallery-v164 figcaption{
padding:9px 10px 8px;
font-size:9.5px;
}
.festival-ops-v164{
margin-top:20px;
}
.festival-ops-v164>div{
grid-template-columns:38px minmax(0,1fr);
gap:10px;
padding:14px 0;
}
.festival-ops-v164 span{
font-size:13px;
}
.festival-ops-v164 p,
.festival-ops-v164 strong{
font-size:13.5px;
}
}
/* =========================================================
V165 — FESTIVALS & LARGE EVENTS
Warmer, more direct copy with compact real-delivery proof.
Photos support the story without becoming space-fillers.
========================================================= */
body.festival-page-v165 .subhero h1{
max-width:12ch;
font-size:clamp(38px,4.4vw,62px)!important;
line-height:.96!important;
}
body.festival-page-v165 .section h2{
max-width:15ch!important;
font-size:clamp(34px,4.4vw,52px)!important;
line-height:.98!important;
}
.subheroMedia.festival-hero-v165{
display:grid!important;
grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)!important;
grid-template-rows:repeat(2,minmax(0,1fr))!important;
gap:10px!important;
padding:16px!important;
overflow:hidden!important;
background:var(--navy)!important;
}
.festival-hero-v165 figure{
position:relative;
min-width:0;
min-height:0;
margin:0;
overflow:hidden;
background:#071038;
}
.festival-hero-v165 .festival-hero-main-v165{
grid-row:1 / 3;
}
.subheroMedia.festival-hero-v165 img{
display:block!important;
width:100%!important;
height:100%!important;
min-height:0!important;
max-height:none!important;
aspect-ratio:auto!important;
object-fit:cover!important;
object-position:center!important;
}
.festival-hero-v165 figure:nth-child(2) img{
object-position:58% center!important;
}
.festival-hero-v165 figure:nth-child(3) img{
object-position:center 50%!important;
}
.festival-hero-v165 figcaption,
.festival-gallery-v165 figcaption{
position:absolute;
left:0;
bottom:0;
padding:9px 11px 8px;
border-top:2px solid var(--green);
background:rgba(13,23,77,.94);
color:#fff;
font-size:12px;
font-weight:900;
line-height:1.2;
letter-spacing:.04em;
text-transform:uppercase;
}
.festival-intro-v165 .split{
align-items:start;
}
.festival-proof-v165{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
margin-top:42px;
border-top:1px solid rgba(13,23,77,.18);
border-bottom:1px solid rgba(13,23,77,.18);
}
.festival-proof-v165>div{
min-width:0;
padding:20px;
border-left:1px solid rgba(13,23,77,.18);
}
.festival-proof-v165>div:first-child{
border-left:0;
}
.festival-proof-v165 strong,
.festival-proof-v165 span{
display:block;
}
.festival-proof-v165 strong{
color:var(--navy);
font-family:'Audiowide',Arial,sans-serif;
font-size:13px;
line-height:1.35;
letter-spacing:.04em;
}
.festival-proof-v165 span{
margin-top:8px;
color:#5c657d;
font-size:14px;
line-height:1.48;
}
.festival-work-v165 .eyebrow{
color:var(--green);
}
.festival-work-v165 h2{
max-width:18ch!important;
}
.festival-gallery-v165{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:9px;
margin-top:28px;
}
.festival-gallery-v165 figure{
position:relative;
min-width:0;
height:220px;
margin:0;
overflow:hidden;
background:#071038;
}
.festival-gallery-v165 img{
display:block;
width:100%;
height:100%;
object-fit:cover;
}
.festival-plan-v165 .split{
align-items:start;
}
.festival-list-v165{
margin-top:25px;
border-top:1px solid rgba(13,23,77,.2);
}
.festival-list-v165 p{
margin:0;
padding:15px 0;
border-bottom:1px solid rgba(13,23,77,.2);
}
.festival-list-v165 strong,
.festival-list-v165 span{
display:block;
}
.festival-list-v165 strong{
color:var(--navy);
font-size:16px;
line-height:1.4;
}
.festival-list-v165 span{
margin-top:3px;
color:#59627a;
font-size:14px;
line-height:1.5;
}
@media(max-width:900px){
.subheroMedia.festival-hero-v165{
height:420px!important;
min-height:420px!important;
}
.festival-proof-v165{
grid-template-columns:repeat(2,minmax(0,1fr));
}
.festival-proof-v165>div:nth-child(3){
border-top:1px solid rgba(13,23,77,.18);
border-left:0;
}
.festival-proof-v165>div:nth-child(4){
border-top:1px solid rgba(13,23,77,.18);
}
.festival-gallery-v165{
grid-template-columns:repeat(3,minmax(0,1fr));
}
.festival-gallery-v165 figure{
height:180px;
}
}
@media(max-width:620px){
body.festival-page-v165 .subhero h1{
max-width:11ch;
font-size:clamp(34px,10.5vw,44px)!important;
}
body.festival-page-v165 .section h2{
font-size:clamp(30px,9vw,38px)!important;
}
.subheroMedia.festival-hero-v165{
height:320px!important;
min-height:320px!important;
gap:7px!important;
padding:7px!important;
}
.festival-hero-v165 figcaption,
.festival-gallery-v165 figcaption{
padding:7px 8px 6px;
font-size:12px;
letter-spacing:0;
}
.festival-proof-v165{
margin-top:28px;
}
.festival-proof-v165>div{
padding:17px 14px 19px;
}
.festival-proof-v165 strong{
font-size:12px;
}
.festival-proof-v165 span{
font-size:14px;
}
.festival-gallery-v165{
grid-template-columns:minmax(0,1fr);
gap:7px;
margin-top:24px;
}
.festival-gallery-v165 figure{
height:150px;
}
}
/* V168 — WEDDINGS & EVENTS: shorter, conversational headlines. */
body.wedding-page-v168 .subhero h1{
max-width:10ch;
font-size:clamp(40px,5vw,64px)!important;
line-height:.96!important;
}
body.wedding-page-v168 .section h2{
max-width:17ch!important;
font-size:clamp(34px,4.4vw,52px)!important;
line-height:.98!important;
}
@media(max-width:620px){
body.wedding-page-v168 .subhero h1{
font-size:clamp(34px,10.5vw,44px)!important;
}
body.wedding-page-v168 .section h2{
font-size:clamp(30px,9vw,38px)!important;
}
}
/* V174 — WEDDING HERO: shorter, centred and never clipped. */
body.wedding-page-v174 .subhero{
min-height:460px!important;
height:auto!important;
}
body.wedding-page-v174 .subheroCopy{
min-height:460px!important;
box-sizing:border-box!important;
padding-top:48px!important;
padding-bottom:48px!important;
}
body.wedding-page-v174 .subhero h1{
max-width:16ch!important;
font-size:clamp(36px,3.5vw,50px)!important;
line-height:.98!important;
}
body.wedding-page-v174 .subheroMedia{
min-height:460px!important;
height:460px!important;
overflow:hidden!important;
}
body.wedding-page-v174 .subheroMedia img{
width:100%!important;
height:460px!important;
min-height:460px!important;
max-height:none!important;
aspect-ratio:auto!important;
object-fit:cover!important;
object-position:center center!important;
}
@media(max-width:960px){
body.wedding-page-v174 .subhero,
body.wedding-page-v174 .subheroCopy{
min-height:0!important;
}
body.wedding-page-v174 .subheroMedia,
body.wedding-page-v174 .subheroMedia img{
height:360px!important;
min-height:360px!important;
}
}
@media(max-width:620px){
body.wedding-page-v174 .subheroMedia,
body.wedding-page-v174 .subheroMedia img{
height:280px!important;
min-height:280px!important;
}
}
/* =========================================================
V178 — COMPLETE TABLET-LANDSCAPE LANDINGS
Safari on iPad leaves less usable height beneath its browser
chrome. Size these two approved landings to the visible space
below the fixed header so neither the next section nor the
bottom of the festival photo grid is left half-cut.
========================================================= */
@media (min-width:901px) and (max-width:1180px){
body.wedding-page-v174 .subhero,
body.festival-page-v165 .subhero{
height:calc(100svh - 132px)!important;
min-height:500px!important;
max-height:680px!important;
}
body.wedding-page-v174 .subheroCopy,
body.festival-page-v165 .subheroCopy,
body.wedding-page-v174 .subheroMedia,
body.festival-page-v165 .subheroMedia{
height:100%!important;
min-height:0!important;
box-sizing:border-box!important;
}
body.wedding-page-v174 .subheroCopy,
body.festival-page-v165 .subheroCopy{
padding-top:38px!important;
padding-bottom:38px!important;
}
body.wedding-page-v174 .subheroMedia img,
body.festival-page-v165 .subheroMedia img{
width:100%!important;
height:100%!important;
min-height:0!important;
max-height:none!important;
}
}
/* =========================================================
V183 — ABOUT PAGE UNIFORM NAVY LANDING
Use the same full-width split hero as the other main pages,
then turn the following statement light so the colour rhythm
remains deliberate rather than producing two navy bands.
========================================================= */
body.about-page-v183 .about-hero-v183{
background:#0D174D!important;
color:#fff!important;
}
body.about-page-v183 .about-hero-copy-v183 .eyebrow{
color:#B0BC70!important;
}
body.about-page-v183 .about-hero-copy-v183 h1{
color:#fff!important;
max-width:15ch!important;
}
body.about-page-v183 .about-hero-copy-v183 p,
body.about-page-v183 .about-hero-copy-v183 .about54-lead{
color:#e7eaf2!important;
}
body.about-page-v183 .about-hero-copy-v183 .about-location-v183{
font-size:16px!important;
line-height:1.55!important;
margin-top:18px!important;
}
body.about-page-v183 .about-hero-media-v183 img{
object-position:50% 42%!important;
}
body.about-page-v183 .about54-statement-light-v183{
background:#f5f4ef!important;
color:#0D174D!important;
}
body.about-page-v183 .about54-statement-light-v183 p{
color:#7e8b43!important;
}
body.about-page-v183 .about54-statement-light-v183 p em{
color:#0D174D!important;
}
body.about-page-v183 .about54-statement-light-v183 h2{
color:#0D174D!important;
}
@media(max-width:760px){
body.about-page-v183 .about-location-v183{display:none!important}
body.about-page-v183 .about-hero-copy-v183 h1{
font-size:clamp(37px,11vw,48px)!important;
margin:10px 0 16px!important;
}
}
/* iPad Pro landscape exposes a desktop-width viewport. */
@media (min-width:1181px) and (max-width:1366px) and (hover:none) and (pointer:coarse){
body.wedding-page-v174 .subhero,
body.festival-page-v165 .subhero{
height:calc(100svh - 160px)!important;
min-height:520px!important;
max-height:720px!important;
}
body.wedding-page-v174 .subheroCopy,
body.festival-page-v165 .subheroCopy,
body.wedding-page-v174 .subheroMedia,
body.festival-page-v165 .subheroMedia{
height:100%!important;
min-height:0!important;
box-sizing:border-box!important;
}
body.wedding-page-v174 .subheroCopy,
body.festival-page-v165 .subheroCopy{
padding-top:42px!important;
padding-bottom:42px!important;
}
body.wedding-page-v174 .subheroMedia img,
body.festival-page-v165 .subheroMedia img{
width:100%!important;
height:100%!important;
min-height:0!important;
max-height:none!important;
}
}
/* =========================================================
V186 — ONE RELIABLE INTERNAL-PAGE LANDING SYSTEM
Final cascade layer: all photographed internal landings share one
complete, centred frame. The homepage and text-only pages are separate.
========================================================= */
@media (min-width:961px){
body .subhero:not(.info-hero-v138){
height:540px!important;
height:clamp(500px,56svh,560px)!important;
min-height:500px!important;
max-height:560px!important;
grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
}
body .subhero:not(.info-hero-v138) .subheroCopy,
body .subhero:not(.info-hero-v138) .subheroMedia{
height:100%!important;
min-height:0!important;
max-height:none!important;
box-sizing:border-box!important;
}
body .subhero:not(.info-hero-v138) .subheroCopy{
align-items:center!important;
padding:40px 0!important;
}
body .subhero:not(.info-hero-v138) .subheroCopy .wrap{
width:min(590px,84%)!important;
margin-left:auto!important;
margin-right:auto!important;
}
body .subhero:not(.info-hero-v138) h1{
max-width:15ch!important;
margin:13px 0 18px!important;
font-size:clamp(43px,4.2vw,60px)!important;
line-height:.95!important;
}
body .subhero:not(.info-hero-v138) p{
margin-bottom:0!important;
font-size:clamp(16px,1.25vw,19px)!important;
line-height:1.55!important;
}
body .subhero:not(.info-hero-v138) .subheroMedia:not(.festival-hero-v165) img{
display:block!important;
width:100%!important;
height:100%!important;
min-height:0!important;
max-height:none!important;
aspect-ratio:auto!important;
object-fit:cover!important;
}
body .subhero .festival-hero-v165{
height:100%!important;
min-height:0!important;
max-height:none!important;
}
body.about-page-v183 .about-hero-media-v183 img{object-position:50% 66%!important}
body.faq-page-v185 .subheroMedia img{object-position:50% 52%!important}
body.delivery-explained-page-v186 .subheroMedia img{object-position:50% 58%!important}
.contact-landing-head-v135{
min-height:360px!important;
box-sizing:border-box!important;
display:flex!important;
align-items:center!important;
padding:46px 0 76px!important;
}
.contact-landing-grid-v135{
width:100%!important;
align-items:center!important;
}
}
@media (min-width:961px) and (max-height:760px){
body .subhero:not(.info-hero-v138){height:500px!important}
}
@media (max-width:960px){
body .subhero:not(.info-hero-v138){
height:auto!important;
min-height:0!important;
max-height:none!important;
}
body .subhero:not(.info-hero-v138) .subheroCopy{min-height:0!important}
body .subhero:not(.info-hero-v138) .subheroMedia:not(.festival-hero-v165),
body .subhero:not(.info-hero-v138) .subheroMedia:not(.festival-hero-v165) img{
height:clamp(280px,58vw,390px)!important;
min-height:0!important;
max-height:none!important;
aspect-ratio:auto!important;
}
body.about-page-v183 .about-hero-media-v183 img{object-position:50% 66%!important}
body.faq-page-v185 .subheroMedia img{object-position:50% 52%!important}
body.delivery-explained-page-v186 .subheroMedia img{object-position:50% 58%!important}
}
/* =========================================================
V187 — TARGETED iPAD / DESKTOP LANDING CORRECTIONS
Only the pages identified in the final visual review use the shorter
landing. Approved homepage, festival and product-detail landings stay put.
========================================================= */
@media (min-width:961px){
body.landing-compact-v187 .subhero:not(.info-hero-v138){
height:440px!important;
min-height:440px!important;
max-height:440px!important;
}
body.landing-compact-v187 .subheroCopy,
body.landing-compact-v187 .subheroMedia{
height:440px!important;
min-height:0!important;
max-height:440px!important;
}
body.landing-compact-v187 .subheroCopy{
align-items:center!important;
padding-top:32px!important;
padding-bottom:32px!important;
}
body.landing-compact-v187 .subheroCopy .wrap{
width:min(560px,82%)!important;
margin-left:auto!important;
margin-right:auto!important;
}
body.landing-compact-v187 .subhero h1{
margin-top:11px!important;
margin-bottom:16px!important;
font-size:clamp(41px,4vw,56px)!important;
}
body.landing-compact-v187 .subheroMedia:not(.festival-hero-v165) img{
height:100%!important;
min-height:0!important;
max-height:none!important;
}
body.brands-page-v182 .pig-sign-hero img{
object-fit:cover!important;
object-position:50% 15%!important;
padding:0!important;
background:#0D174D!important;
}
body.delivery-explained-page-v186 .subheroMedia img{
object-position:50% 88%!important;
}
body.contact-page-body-v187 .contact-landing-head-v135{
min-height:300px!important;
padding:34px 0 62px!important;
}
body.contact-page-body-v187 .contact-landing-grid-v135{
width:min(1180px,90%)!important;
max-width:1180px!important;
margin-left:auto!important;
margin-right:auto!important;
gap:clamp(34px,5vw,72px)!important;
}
body.contact-page-body-v187 .contact-landing-copy-v135 h1{
font-size:clamp(46px,5vw,68px)!important;
}
body.contact-page-body-v187 .contact-form-first-v135{
margin-top:-34px!important;
}
body.contact-page-body-v187 .contact-form-first-v135 .contact-details{
margin-top:0!important;
}
}
body.surrey-page-v187 .subheroMedia .mediaCaption{
position:absolute!important;
z-index:2!important;
left:14px!important;
right:auto!important;
bottom:14px!important;
max-width:calc(100% - 28px)!important;
padding:8px 12px!important;
background:rgba(13,23,77,.92)!important;
color:#fff!important;
}
/* =========================================================
V188 — CLEAN TITLE-ONLY LANDINGS + CONTAINED FAQ HERO
On iPad and desktop the supporting paragraphs leave the landing so the
titles sit deliberately in the middle, never along the lower edge.
========================================================= */
@media (min-width:961px){
body.landing-compact-v187 .subhero:not(.info-hero-v138){
height:410px!important;
min-height:410px!important;
max-height:410px!important;
}
body.landing-compact-v187 .subheroCopy,
body.landing-compact-v187 .subheroMedia{
height:410px!important;
max-height:410px!important;
}
body.landing-compact-v187 .subheroCopy p{
display:none!important;
}
body.landing-compact-v187 .subheroCopy{
align-items:center!important;
padding-top:34px!important;
padding-bottom:34px!important;
}
body.landing-compact-v187 .subhero h1{
margin-bottom:0!important;
}
body.faq-page-v185 main{
background:#0D174D!important;
}
body.faq-page-v185 .subhero{
width:min(1180px,90%)!important;
margin-left:auto!important;
margin-right:auto!important;
grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)!important;
overflow:visible!important;
}
body.faq-page-v185 .subheroCopy .wrap{
width:84%!important;
margin-left:0!important;
margin-right:auto!important;
}
body.faq-page-v185 .subheroMedia{
align-self:center!important;
height:320px!important;
min-height:320px!important;
max-height:320px!important;
overflow:hidden!important;
}
body.faq-page-v185 .subheroMedia img{
height:320px!important;
min-height:320px!important;
max-height:320px!important;
object-position:50% 52%!important;
}
}
/* =========================================================
V189 — DECISIVE TITLE-ONLY DESKTOP / iPAD LANDINGS
No small label and no paragraph in the reviewed split landings. FAQs use
a deliberately simple full-width title panel with no decorative photograph.
========================================================= */
@media (min-width:961px){
body.landing-compact-v187 .subhero:not(.info-hero-v138){
height:390px!important;
min-height:390px!important;
max-height:390px!important;
}
body.landing-compact-v187 .subheroCopy,
body.landing-compact-v187 .subheroMedia{
height:390px!important;
min-height:0!important;
max-height:390px!important;
}
body.landing-compact-v187 .subheroCopy .eyebrow,
body.landing-compact-v187 .subheroCopy p{
display:none!important;
}
body.landing-compact-v187 .subheroCopy{
align-items:center!important;
padding-top:30px!important;
padding-bottom:30px!important;
}
body.landing-compact-v187 .subhero h1{
margin-top:0!important;
margin-bottom:0!important;
}
body.faq-page-v185 .faq-title-only-v189{
display:block!important;
width:100%!important;
height:320px!important;
min-height:320px!important;
max-height:320px!important;
margin:0!important;
overflow:hidden!important;
background:#0D174D!important;
}
body.faq-page-v185 .faq-title-only-v189 .subheroCopy{
width:100%!important;
height:320px!important;
min-height:320px!important;
max-height:320px!important;
padding:36px 0!important;
}
body.faq-page-v185 .faq-title-only-v189 .subheroCopy .wrap{
width:min(1180px,90%)!important;
margin:0 auto!important;
}
body.faq-page-v185 .faq-title-only-v189 h1{
max-width:18ch!important;
margin:0 auto!important;
text-align:center!important;
font-size:clamp(48px,5vw,68px)!important;
line-height:.94!important;
}
}
@media (max-width:960px){
body.faq-page-v185 .faq-title-only-v189{
display:block!important;
}
body.faq-page-v185 .faq-title-only-v189 .subheroCopy{
width:100%!important;
}
}
/* =========================================================
V190 — TRUE DESKTOP LANDING FRAME
The tablet treatment above is intentionally left untouched. On desktop,
remove the inherited section padding that was shrinking 390px heroes to a
262px content row, then give the reviewed landing pages one consistent,
properly proportioned title-and-image frame. FAQs keep their approved
title-only treatment.
========================================================= */
@media (min-width:1181px){
body.landing-compact-v187 .subhero:not(.info-hero-v138):not(.faq-title-only-v189),
body.about-page-v183 .about-hero-v183{
height:clamp(480px,calc(100svh - 210px),540px)!important;
min-height:480px!important;
max-height:540px!important;
padding:0!important;
grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
overflow:hidden!important;
}
body.landing-compact-v187 .subhero:not(.info-hero-v138):not(.faq-title-only-v189) .subheroCopy,
body.landing-compact-v187 .subhero:not(.info-hero-v138):not(.faq-title-only-v189) .subheroMedia,
body.about-page-v183 .about-hero-v183 .subheroCopy,
body.about-page-v183 .about-hero-v183 .subheroMedia{
width:100%!important;
height:100%!important;
min-height:0!important;
max-height:none!important;
box-sizing:border-box!important;
}
body.landing-compact-v187 .subhero:not(.info-hero-v138):not(.faq-title-only-v189) .subheroCopy,
body.about-page-v183 .about-hero-v183 .subheroCopy{
display:flex!important;
align-items:center!important;
padding:48px 0!important;
}
body.landing-compact-v187 .subhero:not(.info-hero-v138):not(.faq-title-only-v189) .subheroCopy .wrap,
body.about-page-v183 .about-hero-v183 .subheroCopy .wrap{
width:min(560px,82%)!important;
margin-left:auto!important;
margin-right:auto!important;
}
body.landing-compact-v187 .subhero:not(.info-hero-v138):not(.faq-title-only-v189) .subheroCopy .eyebrow,
body.landing-compact-v187 .subhero:not(.info-hero-v138):not(.faq-title-only-v189) .subheroCopy p,
body.about-page-v183 .about-hero-v183 .subheroCopy .eyebrow,
body.about-page-v183 .about-hero-v183 .subheroCopy p{
display:none!important;
}
body.landing-compact-v187 .subhero:not(.info-hero-v138):not(.faq-title-only-v189) h1,
body.about-page-v183 .about-hero-v183 h1{
max-width:15ch!important;
margin:0!important;
font-size:clamp(48px,4.35vw,64px)!important;
line-height:.94!important;
}
body.landing-compact-v187 .subhero:not(.info-hero-v138):not(.faq-title-only-v189) .subheroMedia img,
body.about-page-v183 .about-hero-v183 .subheroMedia img{
display:block!important;
width:100%!important;
height:100%!important;
min-height:0!important;
max-height:none!important;
aspect-ratio:auto!important;
object-fit:cover!important;
}
body.about-page-v183 .about-hero-media-v183 img{
object-position:50% 66%!important;
}
}