/* Premium enquiry experience for the LSRR Designs Contact page */
:root {
    --primary-color: #e6535f;
    --primary-dark: #ca3f4b;
    --secondary-color: #20201f;
    --ink-deep: #181715;
    --lux-gold: #bd9460;
    --paper-color: #fbfaf7;
    --line-color: #e9e5df;
    --text-color: #625e59;
    --heading-font: 'Manrope', sans-serif;
    --body-font: 'Manrope', sans-serif;
    --shadow-soft: 0 24px 70px rgba(35,29,25,.11);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { margin: 0; overflow-x: hidden; background: var(--paper-color) !important; color: var(--text-color) !important; font-family: var(--body-font) !important; }
body::before { display: none !important; }
.container { width: min(1380px,calc(100% - 56px)); max-width: 1380px !important; margin: 0 auto; padding: 0 !important; }
h1,h2,h3 { color: var(--secondary-color); font-family: var(--heading-font) !important; letter-spacing: -.045em; }
h1 { font-size: clamp(3.2rem,6vw,6.4rem) !important; font-weight: 800 !important; line-height: .95 !important; }
h2 { font-size: clamp(2.15rem,4vw,4rem) !important; font-weight: 800 !important; line-height: 1.06 !important; }
h3 { font-weight: 800 !important; }
p { line-height: 1.8; }

.top-promise-bar { position: relative; z-index: 1001; background: #262422; color: #fff; font-size: .77rem; }
.top-promise-inner { min-height: 34px; display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.top-promise-inner p { margin: 0; color: rgba(255,255,255,.82); font-size: inherit; }
.top-promise-inner p span { margin-right: .35rem; color: #ff8d96; }
.top-promise-inner #global-promise-text { margin-right: 0; color: inherit; }
.top-promise-inner a { color: #fff; text-decoration: none; }

.header,.header.scrolled { position: sticky !important; top: 0 !important; z-index: 1000; width: 100%; padding: 0 max(28px,calc((100vw - 1380px)/2)) !important; background: rgba(255,255,255,.96) !important; border-bottom: 1px solid rgba(32,32,31,.08); box-shadow: 0 8px 28px rgba(34,29,25,.04); backdrop-filter: blur(18px); }
.navbar { max-width: 1380px !important; height: 76px !important; margin: 0 auto; padding: 0 !important; gap: 24px; }
.nav-logo { display: inline-flex; align-items: center; gap: 12px; color: var(--secondary-color) !important; font-family: var(--body-font) !important; font-size: 1.25rem !important; font-weight: 800 !important; letter-spacing: -.035em; text-decoration: none; }
.nav-logo img { width: 42px !important; height: 42px !important; padding: 4px !important; border-radius: 10px !important; background: #fff !important; box-shadow: none !important; object-fit: contain; }
.nav-logo span::after { display: none !important; }
.nav-menu { gap: clamp(.45rem,1.3vw,1.2rem) !important; align-items: center; }
.nav-item { margin-left: 0 !important; }
.nav-link { color: #45413e !important; font-size: .8rem !important; font-weight: 700 !important; letter-spacing: .015em !important; text-transform: none !important; }
.nav-link.active { color: var(--primary-color) !important; }
.nav-link::after { bottom: .22rem !important; height: 2px !important; background: var(--primary-color) !important; }
.nav-action-link { padding: .78rem 1.08rem !important; border: 0 !important; border-radius: 9px !important; background: var(--primary-color) !important; color: #fff !important; box-shadow: 0 10px 24px rgba(230,83,95,.24) !important; }
.nav-login-link { padding: .72rem .2rem !important; border: 0 !important; background: transparent !important; }

.contact-hero-v2 { position: relative; min-height: min(790px,calc(100vh - 110px)) !important; height: auto !important; display: flex; align-items: stretch; padding: 0 !important; isolation: isolate; text-align: left !important; }
.contact-hero-v2 .page-hero-background { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; background-size: cover; background-position: center; filter: saturate(.9) contrast(1.03); }
.contact-hero-v2 .page-hero-overlay { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,rgba(18,16,14,.9),rgba(18,16,14,.64) 52%,rgba(18,16,14,.16)) !important; }
.contact-hero-v2::before,.contact-hero-v2::after { display: none !important; }
.contact-hero-layout { display: grid; grid-template-columns: minmax(0,1fr) 340px; align-items: end; gap: clamp(3rem,8vw,9rem); padding-top: 105px !important; padding-bottom: 72px !important; }
.contact-hero-v2 .page-hero-content { position: relative !important; z-index: 2; width: auto !important; max-width: 860px !important; margin: 0 !important; padding: 0 !important; text-align: left !important; transform: none !important; }
.contact-eyebrow,.subheading { display: inline-flex !important; align-items: center; gap: .55rem; color: var(--primary-color) !important; font-size: .7rem !important; font-weight: 800 !important; letter-spacing: .14em !important; text-transform: uppercase; }
.contact-eyebrow { margin-bottom: 1rem; color: #ff9ba3 !important; }
.contact-eyebrow::before,.subheading::before { content: ''; width: 26px !important; height: 2px; background: currentColor !important; }
.contact-hero-v2 h1 { max-width: 820px; margin: 0 0 1.25rem !important; color: #fff !important; text-shadow: none !important; }
.contact-hero-v2 .page-hero-content p { max-width: 670px; margin: 0 !important; color: rgba(255,255,255,.74) !important; font-size: 1.04rem !important; }
.contact-hero-actions { display: flex; align-items: center; gap: 1.25rem; margin-top: 1.9rem; }
.btn { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; padding: .9rem 1.35rem !important; border-radius: 9px !important; font-size: .82rem !important; font-weight: 800 !important; text-decoration: none; }
.btn-primary { border: 1px solid var(--primary-color) !important; background: var(--primary-color) !important; color: #fff !important; box-shadow: 0 12px 28px rgba(230,83,95,.25) !important; }
.btn-primary:hover { border-color: var(--primary-dark) !important; background: var(--primary-dark) !important; transform: translateY(-2px); }
.contact-text-link { color: #fff; font-size: .8rem; font-weight: 800; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.42); padding-bottom: .3rem; }
.contact-hero-note { padding: 1.4rem; border: 1px solid rgba(255,255,255,.22); border-radius: 6px; background: rgba(18,16,14,.3); box-shadow: 0 22px 65px rgba(0,0,0,.2); backdrop-filter: blur(18px); }
.contact-hero-note > span { color: #ff9ba3; font-size: .65rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.contact-hero-note strong { display: block; margin: .8rem 0 1.5rem; color: #fff; font-size: 1.08rem; line-height: 1.5; }
.contact-hero-note small { display: block; padding-top: .8rem; border-top: 1px solid rgba(255,255,255,.16); color: rgba(255,255,255,.55); font-size: .65rem; }

.section-padding { padding: clamp(76px,6.5vw,96px) 0 !important; }
#contact-details { position: relative; background: var(--paper-color); isolation: isolate; }
.contact-section-heading { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(300px,.85fr); align-items: end; gap: clamp(2rem,7vw,7rem); margin-bottom: 2.8rem; }
.contact-section-heading h2 { max-width: 720px; margin: .55rem 0 0; }
.contact-section-heading > p { max-width: 520px; margin: 0 0 .25rem; color: #79736d; }
.contact-grid { display: grid !important; grid-template-columns: minmax(560px,1.2fr) minmax(360px,.8fr) !important; gap: 18px !important; align-items: stretch !important; }
.contact-grid.is-info-hidden { grid-template-columns: minmax(0,1fr) !important; }
.contact-form-wrapper,.contact-info-wrapper { padding: clamp(1.6rem,3.2vw,2.5rem) !important; border: 1px solid var(--line-color); border-radius: 6px !important; box-shadow: none !important; }
.contact-form-wrapper { background: #fff !important; }
.contact-info-wrapper { display: flex; flex-direction: column; background: var(--ink-deep) !important; }
.form-index { display: block; margin-bottom: 2rem; color: var(--lux-gold); font-size: .64rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.contact-form-wrapper h2,.contact-info-wrapper h2 { margin: 0 0 .6rem !important; font-size: clamp(1.7rem,2.6vw,2.5rem) !important; }
.contact-form-wrapper > p { margin: 0 0 1.8rem; color: #7a746e; }
.contact-info-wrapper h2 { color: #fff !important; }
#contact-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.form-group { margin: 0 !important; }
.form-group-full { grid-column: 1/-1; }
.form-group label { display: block !important; position: static !important; width: auto !important; height: auto !important; margin: 0 0 .45rem !important; clip: auto !important; color: #5e5954 !important; font-size: .67rem !important; font-weight: 750 !important; letter-spacing: .03em; overflow: visible !important; }
.form-group input,.form-group textarea { width: 100%; padding: .92rem !important; border: 1px solid #ddd8d2 !important; border-radius: 6px !important; background: #fbfaf8 !important; color: var(--secondary-color); font-family: var(--body-font) !important; font-size: .82rem !important; }
.form-group input { min-height: 51px; }
.form-group textarea { min-height: 160px; resize: vertical; }
.form-group input:focus,.form-group textarea:focus { outline: none; border-color: var(--primary-color) !important; box-shadow: 0 0 0 3px rgba(230,83,95,.1); }
#contact-submit-button { grid-column: 1/-1; width: 100%; margin-top: .25rem; cursor: pointer; }
.contact-form-status { grid-column: 1/-1; }
.contact-info-wrapper .info-item { display: grid !important; grid-template-columns: 36px 1fr; gap: 1rem !important; margin: 0 !important; padding: 1.3rem 0 !important; border-bottom: 1px solid rgba(255,255,255,.13); }
.info-number { color: #ff9ba3; font-size: .63rem; font-weight: 800; letter-spacing: .1em; }
.info-text h3 { margin: 0 0 .35rem !important; color: rgba(255,255,255,.52) !important; font-family: var(--body-font) !important; font-size: .65rem !important; letter-spacing: .11em !important; text-transform: uppercase; }
.info-text a { color: #fff !important; font-size: .88rem !important; font-weight: 700 !important; overflow-wrap: anywhere; }
.contact-response-note { display: flex; gap: .8rem; margin-top: auto; padding-top: 1.5rem; }
.contact-response-note > span { display: grid; place-items: center; flex: 0 0 34px; height: 34px; border-radius: 50%; background: rgba(230,83,95,.16); color: #ff9ba3; font-weight: 900; }
.contact-response-note p { display: flex; flex-direction: column; margin: 0; color: rgba(255,255,255,.55); font-size: .7rem; line-height: 1.6; }
.contact-response-note strong { margin-bottom: .15rem; color: #fff; font-size: .78rem; }

#map-section { position: relative; background: #f1ece7; isolation: isolate; }
.map-layout { display: grid; grid-template-columns: minmax(320px,.68fr) minmax(580px,1.32fr); gap: clamp(3rem,7vw,7rem); align-items: center; }
.map-copy h2 { margin: .65rem 0 1rem; }
.map-copy > p { color: #6e6862; }
.map-availability { display: flex; flex-direction: column; gap: .35rem; margin-top: 2rem; padding: 1.1rem 0 1.1rem 1.2rem; border-left: 2px solid var(--lux-gold); }
.map-availability span { color: #999087; font-size: .62rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.map-availability strong { color: var(--secondary-color); font-size: .88rem; }
.map-visual { position: relative; min-height: 480px; }
.map-visual::before { content: ''; position: absolute; inset: 28px -18px -18px 28px; border: 1px solid rgba(189,148,96,.48); }
.map-placeholder,.contact-map-embed { position: absolute !important; inset: 0; width: 100% !important; height: 100% !important; overflow: hidden; border-radius: 6px !important; background: #ddd; box-shadow: var(--shadow-soft); }
.map-placeholder img { width: 100%; height: 100%; object-fit: cover; }
.contact-map-embed iframe { width: 100%; height: 100%; border: 0; }
.map-overlay-text { display: none !important; }

#contact-seo-content { position: relative; background: #fff; isolation: isolate; }
.section-header { max-width: none !important; margin: 0 0 2.8rem !important; text-align: left !important; }
.section-header h2 { max-width: 980px; margin: .55rem 0 0 !important; }
.contact-seo-grid { display: grid; grid-template-columns: minmax(420px,1fr) minmax(340px,.72fr); gap: clamp(3rem,8vw,8rem); align-items: start; }
.contact-seo-grid > div:first-child p { color: #6d6761; }
.contact-service-list { padding: 1.5rem; border: 1px solid var(--line-color); background: var(--paper-color); }
.contact-service-list > span { color: var(--primary-color); font-size: .66rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.contact-service-list ul { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: 1rem 0 0; padding: 0; list-style: none; }
.contact-service-list li { padding: .8rem .6rem .8rem 1.1rem; border-top: 1px solid var(--line-color); color: #56514c; font-size: .76rem; position: relative; }
.contact-service-list li::before { content: ''; position: absolute; left: 0; top: 1.08rem; width: 5px; height: 5px; border-radius: 50%; background: var(--lux-gold); }

.footer { padding: 68px 0 24px !important; background: #1e1d1c !important; color: #fff; text-align: left !important; }
.footer-grid { display: grid; grid-template-columns: 1.25fr .55fr 1fr; gap: clamp(2rem,6vw,6rem); }
.footer .nav-logo { color: #fff !important; }
.footer-brand p { max-width: 320px; margin-top: 1rem; color: rgba(255,255,255,.56) !important; font-size: .82rem; }
.footer-links,.footer-contact { display: flex; flex-direction: column; align-items: flex-start; gap: .7rem; }
.footer-links strong,.footer-contact > strong { margin-bottom: .45rem; color: #fff; font-size: .73rem; letter-spacing: .08em; text-transform: uppercase; }
.footer-links a,.footer-contact-row a { color: rgba(255,255,255,.62) !important; font-size: .78rem !important; text-decoration: none; }
.footer-contact-row { display: flex !important; flex-direction: column; align-items: flex-start !important; gap: .7rem !important; }
.footer #global-footer-text { grid-column: 1/-1; width: 100%; margin: 2.7rem 0 0; padding-top: 1.2rem; border-top: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.4) !important; font-size: .7rem; }

@media (min-width: 1580px) {
    #contact-details::before,#map-section::before,#contact-seo-content::before { position: absolute; top: 96px; bottom: 96px; left: max(22px,calc((100vw - 1515px)/2)); display: flex; align-items: center; padding-right: 13px; border-right: 1px solid rgba(32,32,31,.14); color: #9c9389; font-size: .58rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; writing-mode: vertical-rl; pointer-events: none; }
    #contact-details::before { content: '01 / Tell us about your project'; }
    #map-section::before { content: '02 / Studio location'; }
    #contact-seo-content::before { content: '03 / Design capabilities'; }
}

@media (max-width: 980px) {
    .contact-hero-layout { grid-template-columns: 1fr; align-content: end; gap: 2.5rem; }
    .contact-hero-note { max-width: 540px; }
    .contact-grid { grid-template-columns: 1fr !important; }
    .contact-info-wrapper { min-height: 500px; }
    .map-layout,.contact-seo-grid { grid-template-columns: 1fr; }
    .map-copy { max-width: 620px; }
    .map-visual { min-height: 460px; }
    .footer-grid { grid-template-columns: 1fr 1fr; }
    .footer-brand { grid-column: 1/-1; }
}

@media (max-width: 768px) {
    .top-promise-inner { justify-content: center; }
    .top-promise-inner p { display: none; }
    .header,.header.scrolled { padding: 0 18px !important; }
    .navbar { height: 70px !important; }
    .hamburger { display: flex !important; position: relative; top: auto !important; right: auto !important; flex-direction: column; padding: .55rem; border-radius: 8px; background: #fff; }
    .nav-menu { top: 70px !important; right: 0; width: min(88vw,330px); height: calc(100dvh - 70px) !important; padding: 1.5rem !important; background: #fff !important; }
    .contact-hero-v2 { min-height: 780px !important; }
    .contact-hero-v2 .page-hero-overlay { background: linear-gradient(180deg,rgba(20,18,16,.42),rgba(20,18,16,.92)) !important; }
    .contact-hero-layout { padding-top: 80px !important; padding-bottom: 48px !important; }
    .contact-section-heading { grid-template-columns: 1fr; gap: 1rem; }
}

@media (max-width: 560px) {
    .container { width: min(100% - 30px,1380px); }
    h1 { font-size: clamp(2.8rem,13vw,3.8rem) !important; }
    h2 { font-size: clamp(1.95rem,9vw,2.75rem) !important; }
    .section-padding { padding: 70px 0 !important; }
    .contact-hero-actions { align-items: flex-start; flex-direction: column; }
    .contact-hero-note { padding: 1.1rem; }
    .contact-form-wrapper,.contact-info-wrapper { padding: 1.25rem !important; }
    #contact-form { grid-template-columns: 1fr; }
    .form-group-full,#contact-submit-button,.contact-form-status { grid-column: 1; }
    .map-visual { width: calc(100% - 14px); min-height: 390px; }
    .map-visual::before { inset: 18px -14px -14px 18px; }
    .contact-service-list ul { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: 1fr; }
    .footer-brand,.footer #global-footer-text { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
    .animate-on-scroll { transition: none !important; animation: none !important; }
}

/* Premium direct-contact panel — intentionally defined last to supersede legacy cards. */
.contact-info-wrapper {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border-color: rgba(255,255,255,.08) !important;
    border-radius: 16px !important;
    background:
        radial-gradient(circle at 92% 4%,rgba(230,83,95,.16),transparent 32%),
        radial-gradient(circle at 8% 100%,rgba(189,148,96,.12),transparent 34%),
        linear-gradient(150deg,#1e1d1b 0%,#151513 68%,#11110f 100%) !important;
    box-shadow: 0 28px 70px rgba(24,20,17,.16) !important;
}

.contact-info-wrapper::before {
    content: '';
    position: absolute;
    z-index: -1;
    top: 0;
    right: 0;
    width: 120px;
    height: 120px;
    border-top: 1px solid rgba(255,255,255,.12);
    border-right: 1px solid rgba(255,255,255,.12);
    border-radius: 0 16px 0 100%;
    pointer-events: none;
}

.contact-info-wrapper .form-index {
    width: max-content;
    margin-bottom: 1.35rem;
    padding: .48rem .7rem;
    border: 1px solid rgba(189,148,96,.28);
    border-radius: 999px;
    background: rgba(189,148,96,.08);
    color: #e0ae70;
}

.contact-info-wrapper h2 {
    max-width: 410px;
    margin-bottom: 1.65rem !important;
    font-size: clamp(1.8rem,2.45vw,2.55rem) !important;
}

.contact-info-wrapper .info-item {
    --card-accent: #f3737d;
    position: relative;
    min-height: 92px;
    display: grid !important;
    grid-template-columns: 42px minmax(0,1fr);
    align-items: center;
    gap: 1rem !important;
    margin: 0 0 10px !important;
    padding: 1.05rem 3.75rem 1.05rem 1rem !important;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.1) !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg,rgba(255,255,255,.085),rgba(255,255,255,.035)) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
    transition: transform .22s ease,border-color .22s ease,background .22s ease;
}

.contact-info-wrapper .info-item:nth-of-type(2) { --card-accent: #d7a566; }
.contact-info-wrapper .info-item:nth-of-type(3) { --card-accent: #79c79a; }

.contact-info-wrapper .info-item::before {
    content: '';
    position: absolute;
    top: 16px;
    bottom: 16px;
    left: 0;
    width: 3px;
    height: auto;
    border-radius: 0 4px 4px 0;
    background: var(--card-accent);
}

.contact-info-wrapper .info-item::after {
    content: '\2197';
    position: absolute;
    top: 50%;
    right: 16px;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 50%;
    background: rgba(255,255,255,.045);
    color: rgba(255,255,255,.72);
    font-size: .85rem;
    transform: translateY(-50%);
    transition: background .22s ease,color .22s ease,transform .22s ease;
    pointer-events: none;
}

.contact-info-wrapper .info-number {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(243,115,125,.34);
    border-color: color-mix(in srgb,var(--card-accent) 45%,transparent);
    border-radius: 50%;
    background: rgba(243,115,125,.1);
    background: color-mix(in srgb,var(--card-accent) 12%,transparent);
    color: var(--card-accent);
    font-size: .63rem;
    letter-spacing: .08em;
}

.contact-info-wrapper .info-text { min-width: 0; }
.contact-info-wrapper .info-text h3 {
    margin-bottom: .38rem !important;
    color: rgba(255,255,255,.5) !important;
    font-size: .64rem !important;
    letter-spacing: .14em !important;
}

.contact-info-wrapper .info-text a {
    position: static;
    display: inline;
    color: #fff !important;
    font-size: clamp(.9rem,1.15vw,1.02rem) !important;
    font-weight: 750 !important;
    line-height: 1.45;
    text-decoration: none;
}

.contact-info-wrapper .info-text a::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
}

.contact-info-wrapper .info-item:focus-within {
    border-color: color-mix(in srgb,var(--card-accent) 40%,transparent) !important;
    background: linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.045)) !important;
    transform: translateY(-2px);
}

.contact-info-wrapper .info-item:focus-within::after {
    background: var(--card-accent);
    color: #171614;
    transform: translateY(-50%) rotate(6deg);
}

.contact-info-wrapper .info-item:focus-within {
    outline: 3px solid rgba(230,83,95,.2);
    outline-offset: 2px;
}

@media (hover: hover) and (pointer: fine) {
    .contact-info-wrapper .info-item:hover {
        border-color: color-mix(in srgb,var(--card-accent) 40%,transparent) !important;
        background: linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.045)) !important;
        transform: translateY(-2px);
    }
    .contact-info-wrapper .info-item:hover::after {
        background: var(--card-accent);
        color: #171614;
        transform: translateY(-50%) rotate(6deg);
    }
}

.contact-info-wrapper .contact-response-note {
    align-items: center;
    gap: .9rem;
    margin-top: auto;
    padding: 1.1rem;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 12px;
    background: rgba(255,255,255,.04);
}

.contact-info-wrapper .contact-response-note > span {
    flex-basis: 42px;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(243,115,125,.18);
    background: rgba(230,83,95,.14);
}

.contact-info-wrapper .contact-response-note p {
    margin: 0 !important;
    color: rgba(255,255,255,.5) !important;
    font-size: .72rem;
}

.contact-info-wrapper .contact-response-note strong {
    color: #fff;
    font-size: .82rem;
}

@media (max-width: 980px) {
    .contact-info-wrapper {
        min-height: 0;
        padding: 2rem !important;
    }
    .contact-info-wrapper .contact-response-note { margin-top: 1.15rem; }
}

@media (max-width: 560px) {
    #contact-details .contact-info-wrapper {
        padding: 20px !important;
        border-radius: 13px !important;
    }
    .contact-info-wrapper .form-index {
        margin-bottom: 1rem;
        padding: .42rem .62rem;
    }
    .contact-info-wrapper h2 {
        margin-bottom: 1.15rem !important;
        font-size: clamp(1.72rem,8vw,2.1rem) !important;
    }
    .contact-info-wrapper .info-item {
        min-height: 84px;
        grid-template-columns: 38px minmax(0,1fr);
        gap: .8rem !important;
        padding: .9rem 3.25rem .9rem .85rem !important;
        border-radius: 10px !important;
    }
    .contact-info-wrapper .info-number {
        width: 38px;
        height: 38px;
    }
    .contact-info-wrapper .info-item::after {
        right: 12px;
        width: 30px;
        height: 30px;
    }
    .contact-info-wrapper .info-text a {
        font-size: .94rem !important;
        overflow-wrap: anywhere;
    }
    .contact-info-wrapper .contact-response-note {
        align-items: flex-start;
        padding: .95rem;
    }
}

@media (max-width: 370px) {
    #contact-details .contact-info-wrapper { padding: 16px !important; }
    .contact-info-wrapper .info-item { padding-right: .85rem !important; }
    .contact-info-wrapper .info-item::after { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .contact-info-wrapper .info-item,
    .contact-info-wrapper .info-item::after { transition: none !important; }
}