:root {


  
  /* Brand Colors */

  --color-primary: rgb(0, 53, 150);    
  --color-secondary: rgb(255, 255, 255); 
  --color-tertiary: rgb(158, 31, 46); 


  /* Font Colors */
 
  --primary-font-color: rgb(0, 53, 150);     
  --secondary-font-color: rgb(255, 255, 255); 
  --tertiary-font-color:rgb(158, 31, 46); 
  

  /* Background Colors */

    --primary-bg-color: linear-gradient(133deg,rgba(5, 32, 82, 1) 10%, rgba(38, 67, 120, 1) 54%, rgba(0, 53, 150, 1) 95%); 
    --secondary-bg-color: rgb(255, 255, 255); 
    --tertiary-bg-color: linear-gradient(161deg,rgba(158, 31, 46, 1) 10%, rgba(120, 0, 14, 1) 95%); 
   

  /* CTA Font Colors */

  --cta-primary-font-color: rgb(0, 53, 150); 
  --cta-secondary-font-color: rgb(255, 255, 255);
  --cta-tertiary-font-color: rgb(158, 31, 46); 

  /* CTA Backgrounds */

    --cta-primary-bg-color: var(--primary-bg-color);    
    --cta-secondary-bg-color: var(--secondary-bg-color); 
    --cta-tertiary-bg-color: var(--tertiary-bg-color); 



  /* Border Colors */

    --border-primary-color: var(--color-primary);   
    --border-secondary-color: var(--color-secondary);
    --border-tertiary-color: var(--color-tertiary);
 
 
 
    /* Font Sizes */

    --font-size-small: 0.875rem;  /* 14px */
    --font-size-medium: 1rem;     /* 16px */
    --font-size-large: 1.25rem;   /* 20px */
    --font-size-xlarge: 1.5rem;   /* 24px */
    --font-size-xxlarge: 2rem;    /* 32px */
    --font-size-special: 3rem;    /* 48px */
    

/* CTA padding */

 --cta-padding-y: 14px;
 --cta-padding-x: 28px;



 --transition-timing: 0.3s;


  /* Fonts with Fallbacks */
  --font-heading: "Montserrat", Georgia, "Times New Roman", serif;
  --font-body: "Google Sans", "Open Sans", Arial, Helvetica, sans-serif;
  --font-cta: "Roboto", "Roboto", Arial, Helvetica, sans-serif;

/* EFFECTS */

    --transition-timing: 0.3s;

    --nav-height: 88px;
    --nav-mobile-height: 76px;

    --nav-shadow: 0 8px 30px rgba(0, 0, 0, 0.09);

    --nav-glass: rgba(255, 255, 255, 0.94);

    --nav-radius: 8px;

    --nav-z-index: 1000;

    /* CONFIGURABLE LOCAL IMAGE */

    --mobile-contact-image: url(
        "../images/YOUR-ACTUAL-BUILDING-IMAGE"
    );




/* Scrollbar Styling */
::-webkit-scrollbar {
    width: 6px;
   
}

::-webkit-scrollbar-track {
    background: var(--color-secondary);
}

::-webkit-scrollbar-thumb {
    background: var(--color-primary);
    border-radius: 0px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--color-tertiary);
    width: 8px;
    
}

  



}



/* =========================================
   GLOBAL
========================================= */

body {
    margin: 0;
    padding: 0;
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.5;
}

body.menu-open {
    overflow: hidden;
}

.site-header *,
.site-header *::before,
.site-header *::after {
    box-sizing: border-box;
}

.site-header a {
    text-decoration: none;
}

.site-header button {
    font: inherit;
}

.site-header ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.site-header button:focus-visible,
.site-header a:focus-visible {
    outline: 3px solid var(--color-tertiary);
    outline-offset: 4px;
}


/* =========================================
   HEADER
========================================= */

.site-header {
    position: sticky;
    top: 0;
    width: 100%;
    z-index: var(--nav-z-index);

    /* SECONDARY BACKGROUND */
    background: var(--secondary-bg-color);

    border-bottom: 1px solid rgba(0, 53, 150, 0.08);

    transition:
        background var(--transition-timing) ease,
        box-shadow var(--transition-timing) ease,
        border-color var(--transition-timing) ease;
}

/* Keep the secondary background when scrolling */

.site-header.scrolled {
    background: var(--secondary-bg-color);

    border-bottom: 1px solid rgba(0, 53, 150, 0.10);

    box-shadow: var(--nav-shadow);

    -webkit-backdrop-filter: blur(16px) saturate(160%);
    backdrop-filter: blur(16px) saturate(160%);
}


/* =========================================
   NAV CONTAINER
========================================= */

.nav-container {
    width: min(100% - 64px, 1500px);
    min-height: var(--nav-height);

    margin: 0 auto;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 30px;
}


/* =========================================
   LOGO
========================================= */

.brand-logo {
    flex-shrink: 0;

    display: flex;
    align-items: center;

    width: 350px;
    min-width: 0;
}

.brand-logo img {
    display: block;

    width: 100%;
    height: auto;
    max-height: 85px;

    object-fit: contain;
}


/* =========================================
   DESKTOP NAVIGATION
========================================= */

.desktop-nav {
    display: flex;
    align-items: center;

    flex: 1;
    justify-content: center;
}

.nav-list {
    display: flex;
    align-items: center;

    gap: clamp(15px, 2vw, 30px);
}

.nav-item {
    position: relative;

    display: flex;
    align-items: center;

    height: var(--nav-height);
}

.nav-item > a,
.nav-link {
    position: relative;

    display: inline-flex;
    align-items: center;

    gap: 8px;
    padding: 10px 0;

    /* BLUE TEXT ON WHITE BACKGROUND */
    color: var(--color-primary);

    font-family: var(--font-body);
    font-size: var(--font-size-medium);
    font-weight: 400;

    white-space: nowrap;

    background: transparent;
    border: none;

    cursor: pointer;

    transition: color var(--transition-timing) ease;
}



.nav-item > a:hover::after,
.nav-link:hover::after,
.nav-item > a.active::after {
    width: 100%;
}

.nav-item > a:hover,
.nav-link:hover,
.nav-item > a.active {
    color: var(--color-tertiary);
}


/* SCROLLED NAV COLORS */

.site-header.scrolled .nav-item > a,
.site-header.scrolled .nav-link {
    color: var(--color-primary);
}

.site-header.scrolled .nav-item > a:hover,
.site-header.scrolled .nav-link:hover {
    color: var(--color-tertiary);
}


/* =========================================
   CHEVRON
========================================= */

.chevron {
    width: 8px;
    height: 8px;

    display: inline-block;

    border-right: 1.8px solid currentColor;
    border-bottom: 1.8px solid currentColor;

    transform: rotate(45deg);
    margin-top: -4px;

    transition: transform var(--transition-timing) ease;
}

.dropdown.open .chevron,
.mobile-accordion.open .chevron {
    transform: rotate(225deg);
    margin-top: 4px;
}


/* =========================================
   DESKTOP DROPDOWNS
========================================= */

.dropdown-panel {
    position: absolute;

    top: calc(100% - 2px);
    left: -25px;

    width: 390px;
    padding: 25px;

    background: var(--secondary-bg-color);

    border: 1px solid rgba(0, 53, 150, 0.08);
    

    box-shadow: 0 15px 45px rgba(0, 24, 65, 0.15);

    opacity: 0;
    visibility: hidden;

    transform: translateY(12px);

    transition:
        opacity var(--transition-timing) ease,
        transform var(--transition-timing) ease,
        visibility var(--transition-timing) ease;
}

.dropdown.open > .dropdown-panel {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}


/* DROPDOWN HEADING */

.dropdown-heading {
    padding-bottom: 18px;
    margin-bottom: 12px;

    border-bottom: 1px solid #e9edf4;
}

.dropdown-heading > span {
    display: block;

    color: var(--color-tertiary);

    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.6px;

    margin-bottom: 7px;
}

.dropdown-heading h3 {
    margin: 0;

    color: var(--color-primary);

    font-family: var(--font-heading);
    font-size: 17px;
    font-weight: 700;
    line-height: 1.4;
}


/* DROPDOWN LINKS */

.dropdown-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.dropdown-list a {
    display: block;

    padding: 11px 12px;

    color: #34445e;

    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;

    border-radius: 5px;

    transition:
        color var(--transition-timing) ease,
        background var(--transition-timing) ease,
        padding var(--transition-timing) ease;
}

.dropdown-list a:hover,
.dropdown-list a.active {
    color: var(--color-primary);

    background: #f0f4fb;

    padding-left: 17px;
}


/* =========================================
   AREAS DROPDOWN
========================================= */

.areas-panel {
    width: 510px;
    left: -120px;
}

.areas-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3px 10px;
}


/* =========================================
   TELEPHONE CTA
========================================= */

.nav-call {
    display: inline-flex;

    flex-shrink: 0;

    align-items: center;
    justify-content: center;

    gap: 11px;
    padding: 12px 18px;

    /* BLUE TEXT AND BORDER */
    color: var(--color-primary);

    border: 1.5px solid var(--color-primary);
    border-radius: 5px;

    font-family: var(--font-cta);
    font-size: 14px;
    font-weight: 600;

    white-space: nowrap;

    transition:
        background var(--transition-timing) ease,
        color var(--transition-timing) ease,
        border-color var(--transition-timing) ease;
}

.nav-call img {
    display: block;
    width: 19px;
    height: 19px;
    object-fit: contain;
}

.nav-call:hover {
    color: #ffffff;

    background: var(--color-primary);
    border-color: var(--color-primary);
}

.nav-call:hover img {
    filter: brightness(0) invert(1);
}


/* SCROLLED CTA */

.site-header.scrolled .nav-call {
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.site-header.scrolled .nav-call:hover {
    color: #ffffff;
    background: var(--color-primary);
    border-color: var(--color-primary);
}


/* =========================================
   MOBILE MENU BUTTON
========================================= */

.mobile-menu-toggle {
    display: none;

    width: 46px;
    height: 46px;

    flex-shrink: 0;

    align-items: center;
    justify-content: center;

    background: transparent;

    border: none;
    

    cursor: pointer;
}

.hamburger-icon {
    display: flex;

    width: 23px;

    flex-direction: column;
    gap: 6px;
}

.hamburger-icon span {
    width: 100%;
    height: 2px;

    display: block;

    background: var(--color-primary);

    border-radius: 2px;

    transition:
        transform var(--transition-timing) ease,
        opacity var(--transition-timing) ease;
}

.mobile-menu-toggle.active .hamburger-icon span:first-child {
    transform: translateY(8px) rotate(45deg);
}

.mobile-menu-toggle.active .hamburger-icon span:nth-child(2) {
    opacity: 0;
}

.mobile-menu-toggle.active .hamburger-icon span:last-child {
    transform: translateY(-8px) rotate(-45deg);
}


/* =========================================
   MOBILE NAVIGATION
========================================= */

.mobile-navigation {
    display: none;

    position: fixed;

    top: var(--nav-mobile-height);
    left: 0;

    width: 100%;
    height: calc(100dvh - var(--nav-mobile-height));

    overflow-y: auto;
    overscroll-behavior: contain;

    background: var(--secondary-bg-color);

    padding: 20px 24px 35px;

    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.12);

    z-index: 999;
}

.mobile-navigation[hidden] {
    display: none !important;
}

.mobile-navigation:not([hidden]) {
    display: block;
}

.mobile-nav-list > li {
    border-bottom: 1px solid #e9edf4;
}

.mobile-nav-list > li > a,
.mobile-accordion-toggle {
    display: flex;

    width: 100%;
    min-height: 54px;

    align-items: center;
    justify-content: space-between;

    padding: 14px 4px;

    color: var(--color-primary);

    font-size: 16px;
    font-weight: 600;

    background: transparent;
    border: none;

    text-align: left;
    cursor: pointer;
}

.mobile-nav-list > li > a:hover,
.mobile-accordion-toggle:hover {
    color: var(--color-tertiary);
}


/* MOBILE ACCORDION */

.mobile-submenu {
    padding: 0 0 12px 15px !important;

    border-left: 2px solid rgba(0, 53, 150, 0.12);

    margin-left: 4px !important;
}

.mobile-submenu[hidden] {
    display: none !important;
}

.mobile-submenu a {
    display: block;

    padding: 10px 12px;

    color: #53647c;

    font-size: 14px;
    line-height: 1.5;

    border-radius: 4px;

    transition:
        color var(--transition-timing) ease,
        background var(--transition-timing) ease;
}

.mobile-submenu a:hover,
.mobile-submenu a.active {
    color: var(--color-primary);
    background: #f0f4fb;
}


/* =========================================
   MOBILE TELEPHONE CTA
========================================= */

.mobile-call {
    display: flex;

    flex-direction: column;
    gap: 4px;

    margin: 25px 0;
    padding: 16px 20px;

    color: #ffffff;

    background: var(--primary-bg-color);

    border-radius: 5px;

    font-size: 15px;
    font-weight: 600;
}

.mobile-call span {
    font-size: 19px;
    font-weight: 700;
}


/* =========================================
   MOBILE CONTACT CARD
========================================= */

.mobile-contact-card {
    position: relative;

    min-height: 370px;

    overflow: hidden;

    border-radius: 7px;

    background-color: #052052;

    background-image:
        linear-gradient(
            135deg,
            rgba(5, 32, 82, 0.94),
            rgba(0, 25, 70, 0.86)
        ),
        var(--mobile-contact-image);

    background-position: center;
    background-size: cover;

    color: #ffffff;
}

.contact-overlay {
    position: absolute;
    inset: 0;

    background: linear-gradient(
        180deg,
        rgba(5, 32, 82, 0.35),
        rgba(5, 32, 82, 0.85)
    );
}

.contact-content {
    position: relative;
    z-index: 1;

    padding: 23px 20px;
}

.contact-content h3 {
    margin: 0 0 8px;

    color: #ffffff;

    font-family: var(--font-heading);
    font-size: 19px;
    font-weight: 700;
    letter-spacing: 0.6px;
}

.company-description {
    margin: 0 0 20px;

    color: rgba(255, 255, 255, 0.85);

    font-size: 13px;
}

.contact-detail {
    display: flex;
    flex-direction: column;

    gap: 4px;
    margin-bottom: 15px;
}

.contact-detail strong {
    color: #ffffff;

    font-size: 12px;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.8px;
}

.contact-detail p,
.contact-detail a {
    margin: 0;

    color: rgba(255, 255, 255, 0.9);

    font-size: 13px;
    line-height: 1.7;

    overflow-wrap: anywhere;
}

.contact-detail a:hover {
    color: #ffffff;
    text-decoration: underline;
}


/* =========================================
   RESPONSIVE BREAKPOINTS
========================================= */

@media (max-width: 1199px) {

    .nav-container {
        width: calc(100% - 40px);
        gap: 15px;
    }

    .desktop-nav,
    .nav-call {
        display: none;
    }

    .mobile-menu-toggle {
        display: flex;
    }

    .brand-logo {
        width: 175px;
    }
}


/* SMALL MOBILE */

@media (max-width: 480px) {

    :root {
        --nav-mobile-height: 70px;
    }

    .nav-container {
        width: calc(100% - 32px);
        min-height: var(--nav-mobile-height);
    }

    .brand-logo {
        width: 255px;
    }

    .brand-logo img {
        max-height: 55px;
    }

    .mobile-navigation {
        padding: 16px 18px 30px;
    }
}


/* LARGE DESKTOP */

@media (min-width: 1600px) {

    .nav-container {
        width: min(100% - 100px, 1600px);
    }
}


/* =========================================
   REDUCED MOTION
========================================= */

@media (prefers-reduced-motion: reduce) {

    .site-header *,
    .site-header *::before,
    .site-header *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}


/* =========================================
   BACKDROP FILTER FALLBACK
========================================= */

@supports not (backdrop-filter: blur(16px)) {

    .site-header.scrolled {
        background: var(--secondary-bg-color);
    }
}













/* =========================================
   MILAN AUCTIONEERS
   CORPORATE HERO SECTION
========================================= */

/* =========================================================
   MILAN AUCTIONEERS
   HOMEPAGE HERO SECTION
   Responsive Two-Slide Carousel
   ========================================================= */


/* =========================================================
   1. HERO ROOT
   ========================================================= */

.milan-hero {
    /* Brand integration */
    --milan-hero-accent: var(--color-primary, #b58a43);
    --milan-hero-white: #ffffff;
    --milan-hero-dark: #101010;

    position: relative;
    isolation: isolate;

    width: 100%;
    min-height: 90vh;
    min-height: 90svh;

    overflow: hidden;

    background-color: var(--milan-hero-dark);

    color: var(--milan-hero-white);

    font-family: var(--font-primary, inherit);
}


/* =========================================================
   2. SLIDE STRUCTURE
   ========================================================= */

.milan-hero__slides {
    position: relative;

    width: 100%;
    min-height: 90vh;
    min-height: 90svh;
}

.milan-hero__slide {
    position: absolute;
    inset: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    min-height: 90vh;
    min-height: 90svh;

    overflow: hidden;

    opacity: 0;
    visibility: hidden;

    pointer-events: none;

    transition:
        opacity 1s ease,
        visibility 1s ease;
}

.milan-hero__slide.is-active {
    position: relative;

    opacity: 1;
    visibility: visible;

    pointer-events: auto;

    z-index: 2;
}


/* =========================================================
   3. BACKGROUND IMAGE
   ========================================================= */

.milan-hero__background {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    overflow: hidden;

    z-index: -2;
}

.milan-hero__background img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center center;

    transform: scale(1.02);

    transition: transform 8s ease;
}

.milan-hero__slide.is-active
.milan-hero__background img {
    transform: scale(1.08);
}


/* =========================================================
   4. IMAGE OVERLAY
   ========================================================= */

.milan-hero__overlay {
    position: absolute;
    inset: 0;

    z-index: -1;

    background:
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.43) 0%,
            rgba(0, 0, 0, 0.57) 45%,
            rgba(0, 0, 0, 0.76) 100%
        );
}


/* =========================================================
   5. HERO CONTENT CONTAINER
   ========================================================= */

.milan-hero__container {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: center;

    width: min(1200px, 90%);

    margin: 0 auto;

    padding: 100px 0 120px;

    text-align: center;
}

.milan-hero__content {
    display: flex;
    flex-direction: column;
    align-items: center;

    width: 100%;
    max-width: 1050px;

    margin: 0 auto;
}


/* =========================================================
   6. EYEBROW HEADING
   ========================================================= */

.milan-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 24px;

    color: var(--color-secondary);

    font-size: 14px;
    font-weight: 700;

    line-height: 1.4;

    letter-spacing: 4px;
    text-transform: uppercase;
}


/* =========================================================
   7. MAIN HEADING
   ========================================================= */

.milan-hero__heading {
    width: 100%;
    max-width: 1000px;

    margin: 0 auto 24px;

    color: var(--milan-hero-white);

    font-family: var(--font-heading, inherit);

    font-size: clamp(2.5rem, 5.3vw, 5.3rem);

    font-weight: 800;

    line-height: 1.08;

    letter-spacing: -1.5px;

    text-align: center;

    text-wrap: balance;
}


/* =========================================================
   8. DESCRIPTION
   ========================================================= */

.milan-hero__description {
    width: 100%;
    max-width: 820px;

    margin: 0 auto;

    color: rgba(255, 255, 255, 0.91);

    font-size: clamp(15px, 1.25vw, 18px);

    font-weight: 400;

    line-height: 1.85;

    text-align: center;

    text-wrap: pretty;
}


/* =========================================================
   9. CALL-TO-ACTION GROUP
   ========================================================= */

.milan-hero__actions {
    display: flex;
    align-items: center;
    justify-content: center;

    flex-wrap: wrap;

    width: 100%;

    gap: 18px;

    margin-top: 38px;

    text-align: center;
}


/* =========================================================
   10. CTA BUTTON BASE
   ========================================================= */

.milan-hero__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    

    gap: 12px;

    padding: 14px 18px;

    border: 1px solid transparent;

    border-radius: 4px;

    font-family: inherit;

    font-size: 15px;

    font-weight: 700;

    line-height: 1;

    text-decoration: none;

    cursor: pointer;

    transition:
        color 0.3s ease,
        background-color 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


/* CTA Icons */

.milan-hero__button svg {
    display: block;

    flex-shrink: 0;

    width: 19px;
    height: 19px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.8;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* =========================================================
   11. PRIMARY CTA
   ========================================================= */

.milan-hero__button--primary {
    background-color: var(--milan-hero-accent);

    border-color: var(--milan-hero-accent);

    color: #ffffff;
}

.milan-hero__button--primary:hover {
    background-color: #ffffff;

    border-color: #ffffff;

    color: var(--milan-hero-dark);

    transform: translateY(-3px);

    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.2);
}


/* =========================================================
   12. SECONDARY CTA
   ========================================================= */

.milan-hero__button--outline {
    background-color: rgba(255, 255, 255, 0.04);

    border-color: rgba(255, 255, 255, 0.85);

    color: var(--color-secondary);
}

.milan-hero__button--outline:hover {
    background-color:var(--color-secondary);

    border-color: var(--color-secondary);

    color: var(--milan-hero-dark);

    transform: translateY(-3px);
}


/* =========================================================
   13. CAROUSEL NAVIGATION
   ========================================================= */

.milan-hero__navigation {
    position: absolute;

    bottom: 38px;
    left: 50%;

    z-index: 5;

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 22px;

    transform: translateX(-50%);
}


/* =========================================================
   14. PREVIOUS AND NEXT CONTROLS
   ========================================================= */

.milan-hero__control {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 48px;
    height: 48px;

    padding: 0;

    background-color: rgba(255, 255, 255, 0.08);

    border: 1px solid rgba(255, 255, 255, 0.45);

    border-radius: 50%;

    color: #ffffff;

    cursor: pointer;

    transition:
        background-color 0.3s ease,
        color 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease;
}

.milan-hero__control:hover {
    background-color: var(--milan-hero-accent);

    border-color: var(--milan-hero-accent);

    color: #ffffff;

    transform: scale(1.06);
}

.milan-hero__arrow {
    font-size: 23px;

    font-weight: 400;

    line-height: 1;
}


/* =========================================================
   15. SLIDE PAGINATION
   ========================================================= */

.milan-hero__pagination {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 12px;

    color: #ffffff;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 1px;
}

.milan-hero__current {
    color: var(--milan-hero-accent);
}

.milan-hero__total {
    color: rgba(255, 255, 255, 0.7);
}

.milan-hero__pagination-line {
    display: block;

    width: 35px;
    height: 1px;

    background-color: rgba(255, 255, 255, 0.65);
}


/* =========================================================
   16. KEYBOARD FOCUS
   ========================================================= */

.milan-hero :focus-visible {
    outline: 3px solid var(--milan-hero-accent);

    outline-offset: 5px;
}

.milan-hero__control:focus:not(:focus-visible),
.milan-hero__button:focus:not(:focus-visible) {
    outline: none;
}


/* =========================================================
   17. TABLET RESPONSIVENESS
   ========================================================= */

@media (max-width: 1024px) {

    .milan-hero__container {
        width: 88%;

        padding: 100px 0 120px;
    }

    .milan-hero__heading {
        max-width: 850px;

        font-size: clamp(2.5rem, 6vw, 4.5rem);
    }

    .milan-hero__description {
        max-width: 740px;

        font-size: 16px;

        line-height: 1.8;
    }

}


/* =========================================================
   18. MOBILE RESPONSIVENESS
   ========================================================= */

@media (max-width: 767px) {

    .milan-hero {
        min-height: 90vh;
        min-height: 90svh;
    }

    .milan-hero__slides {
        min-height: 90vh;
        min-height: 90svh;
    }

    .milan-hero__slide {
        min-height: 90vh;
        min-height: 90svh;
    }

    .milan-hero__container {
        width: 90%;

        padding: 90px 0 125px;
    }

    .milan-hero__eyebrow {
        margin-bottom: 18px;

        font-size: 11px;

        letter-spacing: 3px;
    }

    .milan-hero__heading {
        max-width: 600px;

        margin-bottom: 20px;

        font-size: clamp(2.1rem, 8vw, 3.4rem);

        line-height: 1.13;

        letter-spacing: -0.8px;
    }

    .milan-hero__description {
        max-width: 550px;

        font-size: 14px;

        line-height: 1.75;
    }

    .milan-hero__actions {
        gap: 12px;

        margin-top: 28px;
    }

    .milan-hero__button {
        

        padding: 14px 22px;

        font-size: 14px;
    }

    .milan-hero__navigation {
        bottom: 25px;

        gap: 16px;
    }

    .milan-hero__control {
        width: 43px;
        height: 43px;
    }

    .milan-hero__arrow {
        font-size: 20px;
    }

}


/* =========================================================
   19. SMALL MOBILE DEVICES
   ========================================================= */

@media (max-width: 400px) {

    .milan-hero__container {
        width: 92%;
    }

    .milan-hero__heading {
        font-size: clamp(2.5rem, 8vw, 3.5rem);
    }

    .milan-hero__description {
        font-size: 13px;

        line-height: 1.7;
    }

    .milan-hero__actions {
        gap: 10px;
    }

    .milan-hero__button {
        

        padding: 13px 17px;

        font-size: 13px;
    }

}


/* =========================================================
   20. REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .milan-hero *,
    .milan-hero *::before,
    .milan-hero *::after {
        scroll-behavior: auto !important;

        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;

        transition-duration: 0.01ms !important;
    }

    .milan-hero__slide.is-active
    .milan-hero__background img {
        transform: none;
    }

}








/* =========================================================
   MILAN AUCTIONEERS
   ABOUT US & ACHIEVEMENTS SECTION
   ========================================================= */


/* =========================================================
   SECTION BASE
   ========================================================= */

.milan-about-section {
    position: relative;
    isolation: isolate;
    width: 100%;
    padding: clamp(70px, 8vw, 110px) 0;
    background: var(--secondary-bg-color);
    color: var(--primary-font-color);
    font-family: var(--font-body);
    overflow: hidden;
}

.milan-about-section *,
.milan-about-section *::before,
.milan-about-section *::after {
    box-sizing: border-box;
}


/* =========================================================
   CONTENT CONTAINER
   ========================================================= */

.milan-about-container {
    width: min(1200px, 92%);
    margin-inline: auto;
}


/* =========================================================
   CENTERED SECTION HEADER
   ========================================================= */

.milan-about-header {
    width: min(900px, 100%);
    margin: 0 auto clamp(40px, 5vw, 65px);
    text-align: center;
}

.milan-about-eyebrow {
    margin: 0 0 14px;
    color: var(--tertiary-font-color);
    font-family: var(--font-cta);
    font-size: var(--font-size-small);
    font-weight: 700;
    letter-spacing: 0.16em;
    line-height: 1.5;
    text-transform: uppercase;
}

.milan-about-title {
    margin: 0;
    color: var(--primary-font-color);
    font-family: var(--font-heading);
    font-size: clamp(2rem, 4.2vw, 3.15rem);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.035em;
    text-align: center;
    text-wrap: balance;
}


/* =========================================================
   MAIN TWO-COLUMN LAYOUT
   ========================================================= */

.milan-about-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 0.85fr);
    align-items: center;
    gap: clamp(35px, 6vw, 80px);
}


/* =========================================================
   LEFT COLUMN: ABOUT TEXT
   ========================================================= */

.milan-about-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 22px;
    min-width: 0;
   
}

.milan-about-text p {
    
    margin: 0;
    color: var(--primary-font-color);
    font-family: var(--font-body);
    font-size: clamp(0.98rem, 1.15vw, 1.075rem);
    font-weight: 400;
    line-height: 1.9;
    text-align: left;
}


/* =========================================================
   RIGHT COLUMN
   ========================================================= */

.milan-about-right {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-width: 0;
    width: 100%;
}


/* =========================================================
   ACHIEVEMENTS CONTAINER
   ========================================================= */

.milan-achievements {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-width: 0;
    padding: clamp(15px, 2vw, 22px);
    background: var(--primary-bg-color)!important;
    border-radius:  4px;
   
}


/* =========================================================
   INDIVIDUAL ACHIEVEMENT
   ========================================================= */

.milan-achievement {
    display: grid;
    grid-template-columns: minmax(125px, 0.8fr) minmax(0, 1.2fr);
    align-items: center;
    gap: 20px;
    padding: 25px 0;
    min-width: 0;
}

.milan-achievement:first-child {
    padding-top: 0;
}

.milan-achievement:last-child {
    padding-bottom: 0;
}

.milan-achievement + .milan-achievement {
    border-top: 1px solid rgba(255, 255, 255, 0.25);
}


/* =========================================================
   ACHIEVEMENT STATISTICS
   ========================================================= */

.milan-achievement__stat {
    min-width: 0;
    color: var(--secondary-font-color)!important;
    font-family: var(--font-heading);
    font-size: clamp(1.8rem, 3.2vw, 2.65rem);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.045em;
    overflow-wrap: anywhere;
}

.milan-achievement__stat > span {
    display: inline-block;
}

.milan-counter {
    font-variant-numeric: tabular-nums;
}


/* =========================================================
   ACHIEVEMENT DETAILS
   ========================================================= */

.milan-achievement__details {
    min-width: 0;
}

.milan-achievement__title {
    margin: 0 0 7px;
    color: var(--secondary-font-color)!important;
    font-family: var(--font-heading);
    font-size: clamp(0.95rem, 1.2vw, 1.1rem);
    font-weight: 700;
    line-height: 1.4;
}

.milan-achievement__description {
    margin: 0;
    color: rgba(255, 255, 255, 0.88)!important;
    font-family: var(--font-body);
    font-size: 0.88rem;
    font-weight: 400;
    line-height: 1.7;
}


/* =========================================================
   ABOUT US LINK
   ========================================================= */

.milan-about-link-wrapper {
    display: flex;
    justify-content: flex-end;
    width: 100%;
    margin-top: 22px;
}

.milan-about-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 48px;
    padding: 12px 22px;
    background: none;
    color: var(--color-primary);
    border: none;
    
    font-family: var(--font-cta);
    font-size: var(--font-size-medium);
    font-weight: 600;
    line-height: 1.4;
    text-decoration: none;
    transition:
        background var(--transition-timing) ease,
        color var(--transition-timing) ease,
        border-color var(--transition-timing) ease,
        transform var(--transition-timing) ease;
}

.milan-about-link:hover {
    background: none;
    color: var(--color-tertiary);
    
    transform: translateY(-2px);
}

.milan-about-link:focus-visible {
    outline: 3px solid var(--color-tertiary);
    outline-offset: 4px;
}

.milan-about-link__icon {
    display: block;
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    transition: transform var(--transition-timing) ease;
}

.milan-about-link:hover .milan-about-link__icon {
    transform: translateX(4px);
}


/* =========================================================
   SCREEN READER ONLY CONTENT
   ========================================================= */

.milan-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1023px) {

    .milan-about-content {
        grid-template-columns: minmax(0, 1fr) minmax(290px, 0.9fr);
        gap: 35px;
    }

    .milan-achievements {
        padding: 28px;
    }

    .milan-achievement {
        grid-template-columns: minmax(105px, 0.8fr) minmax(0, 1.2fr);
        gap: 15px;
    }

    .milan-achievement__stat {
        font-size: clamp(1.7rem, 3.5vw, 2.3rem);
    }

}


/* =========================================================
   SMALL TABLET AND MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .milan-about-section {
        padding: 70px 0;
    }

    .milan-about-container {
        width: min(100% - 36px, 600px);
    }

    .milan-about-header {
        margin-bottom: 32px;
    }

    .milan-about-title {
        font-size: clamp(1.85rem, 7vw, 2.5rem);
        line-height: 1.2;
    }

    .milan-about-content {
        grid-template-columns: minmax(0, 1fr);
        gap: 35px;
    }

    .milan-about-text {
        gap: 18px;
    }

    .milan-about-text p {
        font-size: 1rem;
        line-height: 1.8;
    }

    .milan-achievements {
        padding: 25px;
        border-radius: 4px;
    }

    .milan-achievement {
        grid-template-columns: minmax(110px, 0.8fr) minmax(0, 1.2fr);
        gap: 18px;
        padding: 23px 0;
    }

    .milan-achievement__stat {
        font-size: clamp(1.75rem, 7vw, 2.4rem);
    }

    .milan-achievement__title {
        font-size: 1rem;
    }

    .milan-achievement__description {
        font-size: 0.85rem;
    }

    .milan-about-link-wrapper {
        justify-content: center;
        margin-top: 20px;
    }

    .milan-about-link {
        width: 100%;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 374px) {

    .milan-about-container {
        width: calc(100% - 28px);
    }

    .milan-about-title {
        font-size: 1.8rem;
    }

    .milan-achievements {
        padding: 20px;
    }

    .milan-achievement {
        grid-template-columns: minmax(95px, 0.75fr) minmax(0, 1.25fr);
        gap: 12px;
    }

    .milan-achievement__stat {
        font-size: 1.65rem;
    }

    .milan-achievement__title {
        font-size: 0.9rem;
    }

    .milan-achievement__description {
        font-size: 0.8rem;
        line-height: 1.6;
    }

    .milan-about-link {
        padding: 11px 15px;
        font-size: var(--font-size-small);
    }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .milan-about-section *,
    .milan-about-section *::before,
    .milan-about-section *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

}











/* =========================================================
   MILAN AUCTIONEERS
   OUR SERVICES SECTION
   Editorial Two-Column Layout
   ========================================================= */


/* ---------------------------------------------------------
   SECTION
   --------------------------------------------------------- */

.milan-services {
    position: relative;
    isolation: isolate;
    width: 100%;
    padding: clamp(75px, 9vw, 125px) 0;
    overflow: hidden;

    background: var(--secondary-bg-color);
    color: var(--primary-font-color);

    font-family: var(--font-body);
}

.milan-services *,
.milan-services *::before,
.milan-services *::after {
    box-sizing: border-box;
}

.milan-services__container {
    width: min(1320px, 91%);
    margin-inline: auto;
}


/* ---------------------------------------------------------
   SECTION HEADER
   --------------------------------------------------------- */

.milan-services__header {
    width: min(850px, 100%);
    margin: 0 auto clamp(55px, 7vw, 85px);
    text-align: center;
}

.milan-services__eyebrow {
    display: inline-block;
    margin-bottom: 18px;

    color: var(--tertiary-font-color);

    font-family: var(--font-cta);
    font-size: var(--font-size-small);
    font-weight: 700;
    letter-spacing: 0.2em;
    line-height: 1.4;
    text-transform: uppercase;
}

.milan-services__heading {
    max-width: 820px;
    margin: 0 auto;

    color: var(--primary-font-color);

    font-family: var(--font-heading);
    font-size: clamp(2rem, 4.2vw, 3.35rem);
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: -0.045em;
    text-wrap: balance;
}

.milan-services__intro {
    max-width: 690px;
    margin: 22px auto 0;

    color: var(--primary-font-color);

    font-family: var(--font-body);
    font-size: clamp(0.95rem, 1.2vw, 1.05rem);
    font-weight: 400;
    line-height: 1.85;
    opacity: 0.82;
}


/* ---------------------------------------------------------
   INDIVIDUAL SERVICE ROW
   --------------------------------------------------------- */

.milan-service {
    display: grid;
    grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
    align-items: stretch;

    width: 100%;
    min-width: 0;
    margin-bottom: clamp(65px, 8vw, 105px);

    background: var(--secondary-bg-color);
}

.milan-service:last-child {
    margin-bottom: 0;
}


/* ---------------------------------------------------------
   SERVICE IMAGE
   --------------------------------------------------------- */

.milan-service__visual {
    position: relative;
    isolation: isolate;

    width: 100%;
    min-width: 0;
    min-height: 540px;

    overflow: hidden;
    background: var(--primary-bg-color);
}

.milan-service__image {
    position: absolute;
    inset: 0;
    z-index: -2;

    display: block;
    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    transition:
        transform var(--transition-timing) ease;
}

.milan-service__image-overlay {
    position: absolute;
    inset: 0;
    z-index: -1;

    background:
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.08) 0%,
            rgba(0, 0, 0, 0.12) 35%,
            rgba(0, 0, 0, 0.68) 100%
        );
}

.milan-service__visual-content {
    position: absolute;
    inset: 0;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-end;

    padding: clamp(25px, 3vw, 42px);
    text-align: right;
}

.milan-service__number {
    display: inline-block;

    color: var(--secondary-font-color);

    font-family: var(--font-heading);
    font-size: clamp(1.35rem, 2.2vw, 1.8rem);
    font-weight: 600;
    line-height: 1;

    letter-spacing: 0.06em;
}

.milan-service__visual-title {
    max-width: 100%;
    margin: 0;

    color: var(--secondary-font-color);

    font-family: var(--font-heading);
    font-size: clamp(1.8rem, 3.1vw, 2.8rem);
    font-weight: 700;
    line-height: 1.14;
    letter-spacing: -0.035em;

    text-wrap: balance;
}


/* ---------------------------------------------------------
   SERVICE INFORMATION
   --------------------------------------------------------- */

.milan-service__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;

    min-width: 0;
    padding: clamp(28px, 4vw, 55px) clamp(28px, 5vw, 72px);
}

.milan-service__description {
    width: 100%;
}

.milan-service__description p {
    margin: 0 0 16px;

    color: var(--primary-font-color);

    font-family: var(--font-body);
    font-size: clamp(0.92rem, 1.1vw, 1rem);
    font-weight: 400;
    line-height: 1.9;
}

.milan-service__description p:last-child {
    margin-bottom: 0;
}


/* ---------------------------------------------------------
   JURISDICTION NOTICE
   --------------------------------------------------------- */

.milan-service__jurisdiction {
    margin-top: 20px !important;
    padding: 15px 18px;

    

    background: rgba(158, 31, 46, 0.055);

    font-size: 0.9rem !important;
    line-height: 1.75 !important;
}

.milan-service__jurisdiction strong {
    color: var(--tertiary-font-color);
    font-weight: 700;
}


/* ---------------------------------------------------------
   DIVIDER
   --------------------------------------------------------- */

.milan-service__divider {
    width: 100%;
    height: 1px;
    margin: 27px 0;

    background: rgba(0, 53, 150, 0.2);
}


/* ---------------------------------------------------------
   SERVICE LIST
   --------------------------------------------------------- */

.milan-service__details {
    width: 100%;
}

.milan-service__subheading {
    margin: 0 0 20px;

    color: var(--primary-font-color);

    font-family: var(--font-heading);
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.4;

    letter-spacing: 0.055em;
}

.milan-service__list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 13px;

    margin: 0;
    padding: 0;

    list-style: none;
}

.milan-service__list li {
    position: relative;

    display: flex;
    align-items: flex-start;
    gap: 13px;

    margin: 0;
    padding: 0;

    color: var(--primary-font-color);

    font-family: var(--font-body);
    font-size: 0.94rem;
    font-weight: 500;
    line-height: 1.65;
}

.milan-service__list li::before {
    content: "";

    flex: 0 0 7px;
    width: 7px;
    height: 7px;

    margin-top: 9px;

    border-radius: 50%;
    background: var(--color-tertiary);
}


/* ---------------------------------------------------------
   LEARN MORE LINK
   --------------------------------------------------------- */

.milan-service__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 17px;

    min-height: 48px;
    margin-top: 32px;
    padding: 12px 22px;

    border: 1px solid transparent;
    border-radius: 2px;

    background: none;
    color: var(--cta-primary-font-color);

    font-family: var(--font-cta);
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.035em;
    line-height: 1.3;
    text-decoration: none;
    text-transform: uppercase;

    transition:
        background var(--transition-timing) ease,
        color var(--transition-timing) ease,
        border-color var(--transition-timing) ease,
        transform var(--transition-timing) ease;
}

.milan-service__link-arrow {
    display: inline-block;

    font-size: 0.9rem;
    line-height: 1;
    
    transition:
        transform var(--transition-timing) ease;
}

.milan-service__link:hover {
    background: none;
    color: var(--cta-tertiary-font-color);
    transform: translateY(-2px);
}

.milan-service__link:hover .milan-service__link-arrow {
    transform: translateX(4px);
}

.milan-service__link:focus-visible {
    outline: 3px solid var(--color-tertiary);
    outline-offset: 5px;
}


/* ---------------------------------------------------------
   TABLET
   --------------------------------------------------------- */

@media (max-width: 1024px) {

    .milan-services__container {
        width: min(94%, 900px);
    }

    .milan-service {
        grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    }

    .milan-service__visual {
        min-height: 570px;
    }

    .milan-service__content {
        padding: 30px;
    }

    .milan-service__visual-title {
        font-size: clamp(1.65rem, 3vw, 2.25rem);
    }

}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 700px) {

    .milan-services {
        padding: 70px 0;
    }

    .milan-services__container {
        width: min(92%, 560px);
    }

    .milan-services__header {
        margin-bottom: 45px;
    }

    .milan-services__heading {
        font-size: clamp(1.85rem, 8vw, 2.55rem);
        line-height: 1.2;
    }

    .milan-services__intro {
        margin-top: 17px;
        line-height: 1.75;
    }

    .milan-service {
        grid-template-columns: minmax(0, 1fr);
        margin-bottom: 60px;
    }

    .milan-service__visual {
        min-height: 0;
        aspect-ratio: 4 / 3;
    }

    .milan-service__visual-content {
        padding: 25px;
    }

    .milan-service__visual-title {
        font-size: clamp(1.8rem, 7vw, 2.4rem);
    }

    .milan-service__content {
        padding: 30px 0 0;
    }

    .milan-service__description p {
        font-size: 0.95rem;
        line-height: 1.8;
    }

    .milan-service__divider {
        margin: 23px 0;
    }

    .milan-service__link {
        margin-top: 27px;
    }

}


/* ---------------------------------------------------------
   SMALL MOBILE
   --------------------------------------------------------- */

@media (max-width: 380px) {

    .milan-services__container {
        width: 90%;
    }

    .milan-service__visual-content {
        padding: 19px;
    }

    .milan-service__visual-title {
        font-size: 1.65rem;
    }

    .milan-service__content {
        padding-top: 24px;
    }

    .milan-service__list li {
        font-size: 0.9rem;
    }

}


/* ---------------------------------------------------------
   REDUCED MOTION
   --------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {

    .milan-services *,
    .milan-services *::before,
    .milan-services *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }

}













/* =========================================================
   MILAN AUCTIONEERS
   OPERATING HOURS & CONTACT CTA
   UNIQUE NAMESPACE: MILANX-OPERATING-AVAILABILITY-2026
   ========================================================= */

.milanx-operating-availability-2026 {
    position: relative;
    width: 100%;
    padding: clamp(70px, 8vw, 110px) 0;
    background: var(--secondary-bg-color);
    overflow: hidden;
    font-family: var(--font-body);
    color: var(--color-primary);
}

.milanx-operating-availability-2026 *,
.milanx-operating-availability-2026 *::before,
.milanx-operating-availability-2026 *::after {
    box-sizing: border-box;
}

.milanx-operating-availability-2026__container {
    width: min(1200px, 92%);
    margin: 0 auto;
}

/* SECTION HEADER */

.milanx-operating-availability-2026__header {
    max-width: 790px;
    margin: 0 auto 55px;
    text-align: center;
}

.milanx-operating-availability-2026__eyebrow {
    display: inline-block;
    margin-bottom: 15px;
    color: var(--color-tertiary);
    font-family: var(--font-cta);
    font-size: var(--font-size-small);
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.milanx-operating-availability-2026__title {
    margin: 0 0 18px;
    color: var(--color-primary);
    font-family: var(--font-heading);
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.8px;
}

.milanx-operating-availability-2026__intro {
    max-width: 720px;
    margin: 0 auto;
    color: #596579;
    font-size: 1rem;
    line-height: 1.85;
}

/* TWO-COLUMN LAYOUT */

.milanx-operating-availability-2026__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 28px;
}

/* OPERATING HOURS PANEL */

.milanx-operating-availability-2026__hours {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: clamp(26px, 3.5vw, 40px);
    background: none;
    border-radius: 14px;
}

.milanx-operating-availability-2026__hours-heading {
    display: flex;
    align-items: flex-start;
    gap: 17px;
    margin-bottom: 30px;
}

.milanx-operating-availability-2026__hours-icon {
    display: flex;
    flex: 0 0 52px;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    color: var(--color-secondary);
    background: var(--color-primary);
    border-radius: 12px;
}

.milanx-operating-availability-2026__hours-icon svg {
    display: block;
    width: 27px;
    height: 27px;
}

.milanx-operating-availability-2026__hours-heading h3 {
    margin: 2px 0 9px;
    color: var(--color-primary);
    font-family: var(--font-heading);
    font-size: clamp(1.25rem, 2vw, 1.5rem);
    font-weight: 700;
    line-height: 1.3;
}

.milanx-operating-availability-2026__hours-heading p {
    margin: 0;
    color: #667286;
    font-size: 0.94rem;
    line-height: 1.7;
}

/* HOURS SCHEDULE */

.milanx-operating-availability-2026__schedule {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0;
    padding: 0;
}

.milanx-operating-availability-2026__schedule-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding: 19px 0;
    border-bottom: 1px solid #e8edf3;
}

.milanx-operating-availability-2026__schedule-row:first-child {
    border-top: 1px solid #e8edf3;
}

.milanx-operating-availability-2026__schedule-row dt {
    color: #344258;
    font-size: 0.94rem;
    font-weight: 600;
    line-height: 1.5;
}

.milanx-operating-availability-2026__schedule-row dd {
    margin: 0;
    color: var(--color-primary);
    font-size: 0.94rem;
    font-weight: 700;
    text-align: right;
    line-height: 1.5;
}

.milanx-operating-availability-2026__schedule-row--closed dd {
    flex-shrink: 0;
}

.milanx-operating-availability-2026__closed-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 78px;
    padding: 6px 12px;
    color: var(--color-tertiary);
    background: none;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.7px;
    text-transform: uppercase;
}

.milanx-operating-availability-2026__note {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: auto 0 0;
    padding-top: 25px;
    color: #667286;
    font-size: 0.85rem;
    line-height: 1.7;
}

.milanx-operating-availability-2026__note > span {
    display: inline-flex;
    flex: 0 0 19px;
    align-items: center;
    justify-content: center;
    width: 19px;
    height: 19px;
    margin-top: 1px;
    color: var(--color-primary);
    border: 1px solid var(--color-primary);
    border-radius: 50%;
    font-family: Georgia, serif;
    font-size: 0.78rem;
    font-weight: 700;
}

/* CONTACT CTA PANEL */

.milanx-operating-availability-2026__contact {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: clamp(28px, 3.5vw, 42px);
    color: var(--secondary-font-color);
    background: var(--color-primary);
    border-radius: 4px;
}

.milanx-operating-availability-2026__contact-top {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 22px;
}

.milanx-operating-availability-2026__contact-icon {
    display: flex;
    flex: 0 0 48px;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    color: var(--color-primary);
    background: var(--color-secondary);
    border-radius: 11px;
}

.milanx-operating-availability-2026__contact-icon svg {
    display: block;
    width: 26px;
    height: 26px;
}

.milanx-operating-availability-2026__contact-eyebrow {
    color: rgba(255, 255, 255, 0.85);
    font-family: var(--font-cta);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 1.6px;
}

.milanx-operating-availability-2026__contact h3 {
    max-width: 430px;
    margin: 0 0 14px;
    color: var(--color-secondary);
    font-family: var(--font-heading);
    font-size: clamp(1.5rem, 2.5vw, 1.85rem);
    font-weight: 700;
    line-height: 1.3;
}

.milanx-operating-availability-2026__contact-description {
    margin: 0 0 27px;
    color: rgba(255, 255, 255, 0.88);
    font-size: 0.94rem;
    line-height: 1.8;
}

/* CONTACT DETAILS */

.milanx-operating-availability-2026__contact-details {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 28px;
}

.milanx-operating-availability-2026__contact-detail {
    display: flex;
    align-items: center;
    gap: 15px;
    min-width: 0;
    padding: 14px 15px;
    color: var(--color-secondary);
    background: none;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 9px;
    text-decoration: none;
    transition:
        background var(--transition-timing) ease,
        border-color var(--transition-timing) ease,
        transform var(--transition-timing) ease;
}

.milanx-operating-availability-2026__contact-detail:hover {
    background: none;
    border-color: rgba(255, 255, 255, 0.4);
    transform: translateY(-2px);
}

.milanx-operating-availability-2026__detail-icon {
    display: flex;
    flex: 0 0 38px;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: var(--color-secondary);
    background: rgba(255, 255, 255, 0.12);
    border-radius: 8px;
}

.milanx-operating-availability-2026__detail-icon svg {
    display: block;
    width: 21px;
    height: 21px;
}

.milanx-operating-availability-2026__detail-content {
    display: flex;
    flex-direction: column;
    min-width: 0;
    gap: 4px;
}

.milanx-operating-availability-2026__detail-label {
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.76rem;
    font-weight: 500;
}

.milanx-operating-availability-2026__detail-content strong {
    overflow-wrap: anywhere;
    color: var(--color-secondary);
    font-size: 0.96rem;
    font-weight: 700;
    line-height: 1.5;
}

/* CTA ACTIONS */

.milanx-operating-availability-2026__contact-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 15px;
    margin-top: auto;
}

.milanx-operating-availability-2026__contact-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
    min-height: 50px;
    padding: 13px 23px;
    color: var(--cta-primary-font-color);
    background: var(--cta-secondary-bg-color);
    border: 2px solid var(--color-secondary);
    border-radius: 6px;
    font-family: var(--font-cta);
    font-size: 0.9rem;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    transition:
        color var(--transition-timing) ease,
        background var(--transition-timing) ease,
        border-color var(--transition-timing) ease,
        transform var(--transition-timing) ease;
}

.milanx-operating-availability-2026__contact-button span {
    font-size: 1.2rem;
    line-height: 1;
    transition: transform var(--transition-timing) ease;
}

.milanx-operating-availability-2026__contact-button:hover {
    color: var(--color-secondary);
    background: transparent;
    transform: translateY(-2px);
}

.milanx-operating-availability-2026__contact-button:hover span {
    transform: translateX(4px);
}

.milanx-operating-availability-2026__contact-call {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 11px 8px;
    color: var(--color-secondary);
    border-bottom: 1px solid rgba(255, 255, 255, 0.65);
    font-size: 0.9rem;
    font-weight: 700;
    text-decoration: none;
    transition:
        color var(--transition-timing) ease,
        border-color var(--transition-timing) ease;
}

.milanx-operating-availability-2026__contact-call:hover {
    color: #ffffff;
    border-color: #ffffff;
}

/* KEYBOARD ACCESSIBILITY */

.milanx-operating-availability-2026 a:focus-visible {
    outline: 3px solid var(--color-tertiary);
    outline-offset: 4px;
}

.milanx-operating-availability-2026__contact a:focus-visible {
    outline-color: #ffffff;
}

/* TABLET RESPONSIVENESS */

@media (max-width: 900px) {

    .milanx-operating-availability-2026__grid {
        gap: 20px;
    }

    .milanx-operating-availability-2026__hours,
    .milanx-operating-availability-2026__contact {
        padding: 27px;
    }

    .milanx-operating-availability-2026__schedule-row {
        align-items: flex-start;
    }

    .milanx-operating-availability-2026__contact-actions {
        align-items: stretch;
    }

}

/* MOBILE RESPONSIVENESS */

@media (max-width: 650px) {

    .milanx-operating-availability-2026 {
        padding: 65px 0;
    }

    .milanx-operating-availability-2026__container {
        width: min(100% - 36px, 520px);
    }

    .milanx-operating-availability-2026__header {
        margin-bottom: 35px;
    }

    .milanx-operating-availability-2026__title {
        font-size: clamp(1.85rem, 7vw, 2.4rem);
        letter-spacing: -0.5px;
    }

    .milanx-operating-availability-2026__intro {
        font-size: 0.94rem;
        line-height: 1.75;
    }

    .milanx-operating-availability-2026__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 20px;
    }

    .milanx-operating-availability-2026__hours,
    .milanx-operating-availability-2026__contact {
        padding: 25px 22px;
    }

    .milanx-operating-availability-2026__hours-heading {
        gap: 13px;
        margin-bottom: 23px;
    }

    .milanx-operating-availability-2026__hours-icon {
        flex-basis: 46px;
        width: 46px;
        height: 46px;
    }

    .milanx-operating-availability-2026__hours-icon svg {
        width: 24px;
        height: 24px;
    }

    .milanx-operating-availability-2026__schedule-row {
        gap: 10px;
        padding: 17px 0;
    }

    .milanx-operating-availability-2026__schedule-row dt,
    .milanx-operating-availability-2026__schedule-row dd {
        font-size: 0.87rem;
    }

    .milanx-operating-availability-2026__closed-label {
        min-width: 70px;
        padding: 5px 9px;
        font-size: 0.72rem;
    }

    .milanx-operating-availability-2026__contact-actions {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .milanx-operating-availability-2026__contact-button,
    .milanx-operating-availability-2026__contact-call {
        width: 100%;
    }

}

/* SMALL MOBILE SCREENS */

@media (max-width: 380px) {

    .milanx-operating-availability-2026__container {
        width: calc(100% - 28px);
    }

    .milanx-operating-availability-2026__hours,
    .milanx-operating-availability-2026__contact {
        padding: 22px 17px;
    }

    .milanx-operating-availability-2026__schedule-row {
        flex-wrap: wrap;
    }

    .milanx-operating-availability-2026__schedule-row dt {
        max-width: 60%;
    }

    .milanx-operating-availability-2026__contact-detail {
        gap: 11px;
        padding: 12px 10px;
    }

    .milanx-operating-availability-2026__detail-content strong {
        font-size: 0.86rem;
    }

}

/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {

    .milanx-operating-availability-2026 *,
    .milanx-operating-availability-2026 *::before,
    .milanx-operating-availability-2026 *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

}












/* =========================================================
   MILAN AUCTIONEERS
   WHY CHOOSE US SECTION
   ========================================================= */

.milan-why-choose {
    position: relative;
    width: 100%;
    padding: clamp(75px, 8vw, 115px) 0;
    background: var(--secondary-bg-color);
    color: #344054;
    font-family: var(--font-body);
    overflow: clip;
}

.milan-why-choose *,
.milan-why-choose *::before,
.milan-why-choose *::after {
    box-sizing: border-box;
}

.milan-why-choose__container {
    width: min(1240px, 92%);
    margin: 0 auto;
}


/* =========================================================
   SECTION HEADER
   ========================================================= */

.milan-why-choose__header {
    max-width: 850px;
    margin: 0 auto 65px;
    text-align: center;
}

.milan-why-choose__eyebrow {
    display: inline-block;
    margin-bottom: 16px;
    color: var(--color-tertiary);
    font-family: var(--font-cta);
    font-size: var(--font-size-small);
    font-weight: 700;
    letter-spacing: 2px;
    line-height: 1.5;
    text-transform: uppercase;
}

.milan-why-choose__heading {
    margin: 0 0 20px;
    color: var(--color-primary);
    font-family: var(--font-heading);
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.8px;
}

.milan-why-choose__intro {
    max-width: 790px;
    margin: 0 auto;
    color: #606d80;
    font-size: 1rem;
    line-height: 1.9;
}


/* =========================================================
   MAIN TWO-COLUMN LAYOUT
   ========================================================= */

.milan-why-choose__layout {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    align-items: start;
    gap: clamp(35px, 5vw, 75px);
}

.milan-why-choose__content {
    min-width: 0;
}

.milan-why-choose__description {
    margin: 0 0 30px;
    color: #606d80;
    font-size: 0.98rem;
    line-height: 1.85;
}


/* =========================================================
   REASONS LIST
   ========================================================= */

.milan-why-choose__list {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.milan-why-choose__item {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    min-width: 0;
    padding: 25px 0;
    border-bottom: 1px solid #e6eaf0;
}

.milan-why-choose__item:first-child {
    border-top: 1px solid #e6eaf0;
}

.milan-why-choose__icon {
    display: flex;
    flex: 0 0 48px;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    color: var(--color-primary);
    background: none;
    border: 1px solid rgba(0, 53, 150, 0.1);
    border-radius: 10px;
}

.milan-why-choose__icon svg {
    display: block;
    width: 24px;
    height: 24px;
}

.milan-why-choose__item-content {
    flex: 1;
    min-width: 0;
}

.milan-why-choose__item-content h3 {
    margin: 1px 0 9px;
    color: var(--color-primary);
    font-family: var(--font-heading);
    font-size: 1.08rem;
    font-weight: 700;
    line-height: 1.45;
}

.milan-why-choose__item-content p {
    margin: 0;
    color: #667286;
    font-size: 0.93rem;
    line-height: 1.8;
}


/* =========================================================
   RIGHT COLUMN - STICKY IMAGE
   ========================================================= */

.milan-why-choose__visual {
    position: relative;
    min-width: 0;
    align-self: stretch;
}

.milan-why-choose__image-wrapper {
    position: sticky;
    top: 100px;

    width: 100%;

    /* Tall enough to balance the seven reasons,
       without occupying the entire viewport. */
    height: clamp(440px, 65vh, 620px);
    max-height: 620px;

    overflow: hidden;
    isolation: isolate;

    background: #e9edf3;
    border-radius: 4px;
    box-shadow: 0 18px 45px rgba(15, 35, 70, 0.12);
}

.milan-why-choose__image-wrapper img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.6s ease;
}

.milan-why-choose__image-wrapper:hover img {
    transform: scale(1.025);
}


/* IMAGE OVERLAY */

.milan-why-choose__image-overlay {
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(5, 20, 45, 0.02) 35%,
        rgba(5, 20, 45, 0.78) 100%
    );
    pointer-events: none;
}


/* IMAGE CAPTION */

.milan-why-choose__image-caption {
    position: absolute;
    z-index: 2;
    right: 30px;
    bottom: 30px;
    left: 30px;
    color: var(--color-secondary);
}

.milan-why-choose__image-caption > span {
    display: inline-block;
    margin-bottom: 12px;
    color: var(--color-secondary);
    font-family: var(--font-cta);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 2px;
}

.milan-why-choose__image-caption p {
    max-width: 390px;
    margin: 0;
    color: var(--color-secondary);
    font-family: var(--font-heading);
    font-size: clamp(1.3rem, 2.3vw, 1.8rem);
    font-weight: 700;
    line-height: 1.4;
}


/* =========================================================
   ACCESSIBILITY - KEYBOARD FOCUS
   ========================================================= */

.milan-why-choose a:focus-visible {
    outline: 3px solid var(--color-tertiary);
    outline-offset: 4px;
}


/* =========================================================
   DESKTOP HEIGHT ADJUSTMENTS
   ========================================================= */

@media (min-width: 1200px) and (max-height: 760px) {

    .milan-why-choose__image-wrapper {
        height: 500px;
        max-height: 500px;
    }

}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1024px) {

    .milan-why-choose {
        padding: 80px 0;
    }

    .milan-why-choose__header {
        margin-bottom: 50px;
    }

    .milan-why-choose__layout {
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.85fr);
        gap: 30px;
    }

    .milan-why-choose__image-wrapper {
        position: relative;
        top: auto;
        height: 540px;
        max-height: 540px;
    }

    .milan-why-choose__item {
        gap: 15px;
        padding: 22px 0;
    }

    .milan-why-choose__icon {
        flex-basis: 43px;
        width: 43px;
        height: 43px;
    }

    .milan-why-choose__icon svg {
        width: 22px;
        height: 22px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .milan-why-choose {
        padding: 65px 0;
    }

    .milan-why-choose__container {
        width: min(92%, 540px);
    }

    .milan-why-choose__header {
        margin-bottom: 35px;
    }

    .milan-why-choose__eyebrow {
        font-size: 0.78rem;
        letter-spacing: 1.5px;
    }

    .milan-why-choose__heading {
        font-size: clamp(1.85rem, 7vw, 2.4rem);
        letter-spacing: -0.5px;
    }

    .milan-why-choose__intro {
        font-size: 0.94rem;
        line-height: 1.8;
    }

    .milan-why-choose__layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 30px;
    }

    .milan-why-choose__description {
        margin-bottom: 25px;
        font-size: 0.94rem;
    }

    .milan-why-choose__item {
        gap: 15px;
        padding: 21px 0;
    }

    .milan-why-choose__item-content h3 {
        font-size: 1rem;
    }

    .milan-why-choose__item-content p {
        font-size: 0.9rem;
    }

    /* Image returns to normal document flow. */
    .milan-why-choose__image-wrapper {
        position: relative;
        top: auto;
        height: auto;
        max-height: none;
        aspect-ratio: 4 / 5;
    }

    .milan-why-choose__image-caption {
        right: 22px;
        bottom: 23px;
        left: 22px;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 380px) {

    .milan-why-choose__container {
        width: calc(100% - 30px);
    }

    .milan-why-choose__item {
        gap: 12px;
    }

    .milan-why-choose__icon {
        flex-basis: 40px;
        width: 40px;
        height: 40px;
    }

    .milan-why-choose__icon svg {
        width: 20px;
        height: 20px;
    }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .milan-why-choose *,
    .milan-why-choose *::before,
    .milan-why-choose *::after {
        animation: none !important;
        transition: none !important;
        scroll-behavior: auto !important;
    }

}














/* =========================================================
   MILAN AUCTIONEERS
   AREAS WE SERVE & INDUSTRIES WE SERVE
========================================================= */

.milan-coverage {
    position: relative;
    width: 100%;
    padding: 105px 0;
    background: var(--secondary-bg-color);
    color: var(--primary-font-color);
    isolation: isolate;
}

.milan-coverage *,
.milan-coverage *::before,
.milan-coverage *::after {
    box-sizing: border-box;
}

.milan-coverage__container {
    width: min(1240px, 92%);
    margin: 0 auto;
}


/* =========================================================
   SECTION HEADER
========================================================= */

.milan-coverage__header {
    width: min(790px, 100%);
    margin: 0 auto 65px;
    text-align: center;
}

.milan-coverage__eyebrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 17px;
    color: var(--tertiary-font-color);
    font-family: var(--font-cta);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 2.4px;
    line-height: 1.5;
    text-transform: uppercase;
}



.milan-coverage__title {
    margin: 0 0 20px;
    color: var(--primary-font-color);
    font-family: var(--font-heading);
    font-size: clamp(2.15rem, 4vw, 3.35rem);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -1.5px;
}

.milan-coverage__intro {
    max-width: 760px;
    margin: 0 auto;
    color: #5d6675;
    font-family: var(--font-body);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.85;
}


/* =========================================================
   MAIN GRID
========================================================= */

.milan-coverage__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
    align-items: start;
    gap: 55px;
}

.milan-coverage__column {
    min-width: 0;
}


/* =========================================================
   COLUMN HEADERS
========================================================= */

.milan-coverage__column-header {
    margin-bottom: 29px;
}

.milan-coverage__section-label {
    display: inline-block;
    margin-bottom: 12px;
    color: var(--tertiary-font-color);
    font-family: var(--font-cta);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 1.7px;
    line-height: 1.5;
    text-transform: uppercase;
}

.milan-coverage__column-title {
    margin: 0 0 15px;
    color: var(--primary-font-color);
    font-family: var(--font-heading);
    font-size: clamp(1.55rem, 2.5vw, 2.05rem);
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.5px;
}

.milan-coverage__column-description {
    margin: 0;
    color: #5d6675;
    font-family: var(--font-body);
    font-size: 0.94rem;
    line-height: 1.8;
}


/* =========================================================
   LOCATION LIST
========================================================= */

.milan-coverage__location-list {
    display: grid;
    grid-template-columns:  1fr;
    gap: 13px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.milan-coverage__location {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    min-width: 0;
    padding: 19px 15px;
    background: #ffffff;
    
    
    transition:
        border-color var(--transition-timing) ease,
        box-shadow var(--transition-timing) ease,
        transform var(--transition-timing) ease;
}

.milan-coverage__location:hover {
    border-color: rgba(0, 53, 150, 0.28);
    box-shadow: 0 9px 25px rgba(0, 35, 95, 0.07);
    transform: translateY(-3px);
}


/* LOCATION ICON */

.milan-coverage__location-icon {
    display: flex;
    flex: 0 0 37px;
    align-items: center;
    justify-content: center;
    width: 37px;
    height: 37px;
    margin-top: 1px;
    color: var(--secondary-font-color);
    background: var(--primary-bg-color);
    border-radius: 8px;
}

.milan-coverage__location-icon svg {
    display: block;
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}


/* LOCATION CONTENT */

.milan-coverage__location-content {
    flex: 1;
    min-width: 0;
}

.milan-coverage__location-title {
    margin: 0 0 7px;
    color: var(--primary-font-color);
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.4;
}

.milan-coverage__location-content p {
    margin: 0 0 12px;
    color: #657080;
    font-family: var(--font-body);
    font-size: 0.82rem;
    line-height: 1.7;
}

.milan-coverage__location-link {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    min-height: 30px;
    color: var(--tertiary-font-color);
    font-family: var(--font-cta);
    font-size: 0.75rem;
    font-weight: 800;
    line-height: 1.5;
    text-decoration: none;
    transition: color var(--transition-timing) ease;
}

.milan-coverage__location-link span {
    display: inline-block;
    font-size: 1rem;
    transition: transform var(--transition-timing) ease;
}

.milan-coverage__location-link:hover {
    color: var(--primary-font-color);
}

.milan-coverage__location-link:hover span {
    transform: translateX(4px);
}


/* =========================================================
   GEOGRAPHICAL JURISDICTION NOTICE
========================================================= */

.milan-coverage__jurisdiction {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    margin-top: 22px;
    padding: 19px;
    background: #f3f6fb;
    
    border-radius: 0 8px 8px 0;
}

.milan-coverage__jurisdiction-icon {
    display: flex;
    flex: 0 0 25px;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 25px;
    color: var(--tertiary-font-color);
}

.milan-coverage__jurisdiction-icon svg {
    display: block;
    width: 21px;
    height: 21px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.milan-coverage__jurisdiction p {
    margin: 0;
    color: #4f5d70;
    font-family: var(--font-body);
    font-size: 0.82rem;
    line-height: 1.75;
}

.milan-coverage__jurisdiction strong {
    color: var(--primary-font-color);
    font-weight: 800;
}


/* =========================================================
   INDUSTRIES LIST
========================================================= */

.milan-coverage__industry-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.milan-coverage__industry {
    display: flex;
    align-items: flex-start;
    gap: 17px;
    padding: 19px 0;
    border-bottom: 1px solid #e8ebf0;
}

.milan-coverage__industry:first-child {
    padding-top: 5px;
}

.milan-coverage__industry:last-child {
    padding-bottom: 5px;
    border-bottom: 0;
}


/* INDUSTRY ICON */

.milan-coverage__industry-icon {
    display: flex;
    flex: 0 0 47px;
    align-items: center;
    justify-content: center;
    width: 47px;
    height: 47px;
    color: var(--tertiary-font-color);
    background: rgba(158, 31, 46, 0.07);
    border: 1px solid rgba(158, 31, 46, 0.12);
    border-radius: 9px;
    transition:
        color var(--transition-timing) ease,
        background var(--transition-timing) ease,
        border-color var(--transition-timing) ease;
}

.milan-coverage__industry:hover .milan-coverage__industry-icon {
    color: #ffffff;
    background: var(--tertiary-bg-color);
    border-color: transparent;
}

.milan-coverage__industry-icon svg {
    display: block;
    width: 23px;
    height: 23px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}


/* INDUSTRY CONTENT */

.milan-coverage__industry-content {
    flex: 1;
    min-width: 0;
}

.milan-coverage__industry-content h4 {
    margin: 1px 0 6px;
    color: var(--primary-font-color);
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.4;
}

.milan-coverage__industry-content p {
    margin: 0;
    color: #657080;
    font-family: var(--font-body);
    font-size: 0.86rem;
    line-height: 1.75;
}


/* =========================================================
   ACCESSIBILITY
========================================================= */

.milan-coverage a:focus-visible {
    outline: 3px solid var(--color-tertiary);
    outline-offset: 4px;
    border-radius: 3px;
}


/* =========================================================
   LARGE TABLETS
========================================================= */

@media (max-width: 1100px) {

    .milan-coverage {
        padding: 85px 0;
    }

    .milan-coverage__grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
        gap: 32px;
    }

    .milan-coverage__location-list {
        grid-template-columns: 1fr;
    }

    .milan-coverage__location {
        padding: 17px;
    }

}


/* =========================================================
   TABLETS
========================================================= */

@media (max-width: 800px) {

    .milan-coverage {
        padding: 75px 0;
    }

    .milan-coverage__header {
        margin-bottom: 48px;
    }

    .milan-coverage__grid {
        grid-template-columns: 1fr;
        gap: 55px;
    }

    .milan-coverage__location-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .milan-coverage__industries {
        padding-top: 35px;
        border-top: 1px solid #e8ebf0;
    }

    .milan-coverage__industry-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 25px;
    }

    .milan-coverage__industry {
        padding: 18px 0;
    }

    .milan-coverage__industry:first-child {
        padding-top: 18px;
    }

}


/* =========================================================
   MOBILE DEVICES
========================================================= */

@media (max-width: 560px) {

    .milan-coverage {
        padding: 65px 0;
    }

    .milan-coverage__container {
        width: min(100% - 36px, 480px);
    }

    .milan-coverage__header {
        margin-bottom: 40px;
    }

    .milan-coverage__eyebrow {
        font-size: 0.7rem;
        letter-spacing: 1.8px;
    }

    .milan-coverage__eyebrow::before,
    .milan-coverage__eyebrow::after {
        width: 17px;
    }

    .milan-coverage__title {
        font-size: clamp(2rem, 8vw, 2.6rem);
        letter-spacing: -1px;
    }

    .milan-coverage__intro {
        font-size: 0.92rem;
        line-height: 1.8;
    }

    .milan-coverage__grid {
        gap: 43px;
    }

    .milan-coverage__column-title {
        font-size: 1.65rem;
    }

    .milan-coverage__column-description {
        font-size: 0.9rem;
    }

    .milan-coverage__location-list {
        grid-template-columns: 1fr;
        gap: 11px;
    }

    .milan-coverage__location {
        padding: 17px 15px;
    }

    .milan-coverage__location-content p {
        font-size: 0.85rem;
    }

    .milan-coverage__location-link {
        font-size: 0.78rem;
    }

    .milan-coverage__industries {
        padding-top: 30px;
    }

    .milan-coverage__industry-list {
        grid-template-columns: 1fr;
    }

    .milan-coverage__industry {
        gap: 14px;
        padding: 17px 0;
    }

    .milan-coverage__industry-icon {
        flex-basis: 43px;
        width: 43px;
        height: 43px;
    }

    .milan-coverage__industry-content h4 {
        font-size: 0.98rem;
    }

    .milan-coverage__industry-content p {
        font-size: 0.85rem;
    }

    .milan-coverage__jurisdiction {
        padding: 16px 13px;
    }

    .milan-coverage__jurisdiction p {
        font-size: 0.79rem;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .milan-coverage *,
    .milan-coverage *::before,
    .milan-coverage *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

}




















/* =========================================================
   MILAN AUCTIONEERS
   FREQUENTLY ASKED QUESTIONS
   ========================================================= */

.milan-faq-section {
    position: relative;
    width: 100%;
    padding: 105px 0;
    background: var(--secondary-bg-color);
    overflow: clip;
}

.milan-faq-container {
    width: min(1240px, 92%);
    margin: 0 auto;
}


/* =========================================================
   SECTION HEADER
   ========================================================= */

.milan-faq-header {
    max-width: 790px;
    margin: 0 auto 65px;
    text-align: center;
}

.milan-faq-eyebrow {
    display: inline-block;
    margin-bottom: 15px;
    color: var(--color-tertiary);
    font-family: var(--font-cta);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 2px;
    line-height: 1.5;
    text-transform: uppercase;
}

.milan-faq-header h2 {
    margin: 0 0 20px;
    color: var(--primary-font-color);
    font-family: var(--font-heading);
    font-size: clamp(2rem, 4vw, 3.1rem);
    font-weight: 800;
    line-height: 1.18;
    letter-spacing: -1.2px;
}

.milan-faq-header p {
    max-width: 730px;
    margin: 0 auto;
    color: #626b79;
    font-family: var(--font-body);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.85;
}


/* =========================================================
   MAIN LAYOUT
   ========================================================= */

.milan-faq-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(310px, 0.75fr);
    align-items: start;
    gap: 65px;
}

.milan-faq-content {
    min-width: 0;
}

.milan-faq-sidebar {
    position: sticky;
    top: 105px;
    min-width: 0;
}


/* =========================================================
   FAQ ITEMS
   ========================================================= */

.milan-faq-list {
    width: 100%;
}

.milan-faq-item {
    width: 100%;
    margin: 0;
    border-bottom: 1px solid rgba(0, 53, 150, 0.13);
}

.milan-faq-item:first-child {
    border-top: 1px solid rgba(0, 53, 150, 0.13);
}

.milan-faq-item h3 {
    margin: 0;
    padding: 0;
}

.milan-faq-question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    width: 100%;
    min-height: 77px;
    padding: 20px 5px;
    border: 0;
    background: transparent;
    color: var(--primary-font-color);
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.55;
    text-align: left;
    cursor: pointer;
    transition:
        color var(--transition-timing) ease,
        padding var(--transition-timing) ease;
}

.milan-faq-question > span {
    flex: 1;
    min-width: 0;
}

.milan-faq-question:hover {
    color: var(--color-tertiary);
}

.milan-faq-question:focus-visible {
    outline: 2px solid var(--color-tertiary);
    outline-offset: 5px;
    border-radius: 3px;
}


/* =========================================================
   PLUS / X SVG ICON
   ========================================================= */

.milan-faq-icon {
    flex: 0 0 25px;
    width: 25px;
    height: 25px;
    fill: none;
    stroke: var(--color-tertiary);
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    transform: rotate(0deg);
    transition:
        transform 0.35s ease,
        stroke var(--transition-timing) ease;
}

.milan-faq-question[aria-expanded="true"] .milan-faq-icon {
    transform: rotate(45deg);
    stroke: var(--color-primary);
}


/* =========================================================
   ANSWERS
   ========================================================= */

.milan-faq-answer {
    padding: 0 48px 24px 5px;
    animation: milanFaqReveal 0.3s ease both;
}

.milan-faq-answer[hidden] {
    display: none;
}

.milan-faq-answer p {
    margin: 0;
    color: #657080;
    font-family: var(--font-body);
    font-size: 0.95rem;
    font-weight: 400;
    line-height: 1.9;
}

@keyframes milanFaqReveal {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* =========================================================
   VIEW ALL QUESTIONS
   ========================================================= */

.milan-faq-more {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 11px;
    padding-top: 30px;
}

.milan-faq-more-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
    min-height: 48px;
    padding: 11px 19px;
    border: 1px solid var(--color-primary);
    border-radius: 3px;
    background: transparent;
    color: var(--primary-font-color);
    font-family: var(--font-cta);
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.2px;
    cursor: pointer;
    transition:
        background var(--transition-timing) ease,
        color var(--transition-timing) ease,
        border-color var(--transition-timing) ease;
}

.milan-faq-more-button:hover {
    border-color: var(--color-primary);
    background: var(--primary-bg-color);
    color: var(--secondary-font-color);
}

.milan-faq-more-button:focus-visible {
    outline: 2px solid var(--color-tertiary);
    outline-offset: 4px;
}

.milan-faq-more-icon {
    width: 19px;
    height: 19px;
    flex: 0 0 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform 0.35s ease;
}

.milan-faq-more-button[aria-expanded="true"] .milan-faq-more-icon {
    transform: rotate(45deg);
}

.milan-faq-count {
    margin: 0;
    color: #858d99;
    font-family: var(--font-body);
    font-size: 0.78rem;
    line-height: 1.5;
}


/* =========================================================
   CONTACT CARD
   ========================================================= */

.milan-faq-contact-card {
    width: 90%;
    overflow: hidden;
    border: none;
    border-radius: 4px;
    background: var(--secondary-bg-color);
    
}


/* =========================================================
   CONTACT IMAGE
   ========================================================= */

.milan-faq-image-wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 600 / 340;
    overflow: hidden;
    background: #e9edf3;
}

.milan-faq-image-wrap img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.65s ease;
}

.milan-faq-contact-card:hover .milan-faq-image-wrap img {
    transform: scale(1.04);
}

.milan-faq-image-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.02) 25%,
        rgba(0, 20, 55, 0.68) 100%
    );
    pointer-events: none;
}

.milan-faq-image-label {
    position: absolute;
    left: 25px;
    bottom: 22px;
    color: #fff;
    font-family: var(--font-cta);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 2px;
}


/* =========================================================
   CONTACT CONTENT
   ========================================================= */

.milan-faq-contact-content {
    padding: 31px 29px 30px;
}

.milan-faq-contact-eyebrow {
    display: block;
    margin-bottom: 10px;
    color: var(--color-tertiary);
    font-family: var(--font-cta);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 1.7px;
    line-height: 1.5;
}

.milan-faq-contact-content h3 {
    margin: 0 0 13px;
    color: var(--primary-font-color);
    font-family: var(--font-heading);
    font-size: clamp(1.45rem, 2vw, 1.8rem);
    font-weight: 800;
    line-height: 1.3;
}

.milan-faq-contact-content > p {
    margin: 0 0 24px;
    color: #657080;
    font-family: var(--font-body);
    font-size: 0.91rem;
    line-height: 1.8;
}


/* =========================================================
   CONTACT DETAILS
   ========================================================= */

.milan-faq-contact-details {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-bottom: 27px;
}

.milan-faq-contact-link {
    display: flex;
    align-items: center;
    gap: 13px;
    min-width: 0;
    color: var(--primary-font-color);
    font-family: var(--font-body);
    font-size: 0.88rem;
    font-weight: 600;
    line-height: 1.5;
    text-decoration: none;
    overflow-wrap: anywhere;
    transition: color var(--transition-timing) ease;
}

.milan-faq-contact-link:hover {
    color: var(--color-tertiary);
}

.milan-faq-contact-link:focus-visible {
    outline: 2px solid var(--color-tertiary);
    outline-offset: 4px;
}

.milan-faq-contact-link svg {
    flex: 0 0 19px;
    width: 19px;
    height: 19px;
    fill: none;
    stroke: var(--color-tertiary);
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}


/* =========================================================
   CONTACT BUTTON
   ========================================================= */

.milan-faq-contact-button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    width: 100%;
    min-height: 54px;
    padding: 14px 19px;
    border: 0;
    border-radius: 3px;
    background: none;
    color: var(--cta-primary-font-color);
    font-family: var(--font-cta);
    font-size: 0.9rem;
    font-weight: 700;
    text-decoration: none;
    transition:
        background var(--transition-timing) ease,
        transform var(--transition-timing) ease;
}

.milan-faq-contact-button:hover {
    background: none;
    transform: translateY(-2px);
}

.milan-faq-contact-button:focus-visible {
    outline: 2px solid var(--color-tertiary);
    outline-offset: 4px;
}

.milan-faq-contact-button svg {
    flex: 0 0 19px;
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform var(--transition-timing) ease;
}

.milan-faq-contact-button:hover svg {
    transform: translateX(4px);
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1000px) {

    .milan-faq-section {
        padding: 85px 0;
    }

    .milan-faq-layout {
        grid-template-columns: minmax(0, 1fr) minmax(270px, 0.8fr);
        gap: 35px;
    }

    .milan-faq-sidebar {
        position: relative;
        top: auto;
    }

    .milan-faq-contact-content {
        padding: 25px 22px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 760px) {

    .milan-faq-section {
        padding: 70px 0;
    }

    .milan-faq-container {
        width: min(100% - 36px, 600px);
    }

    .milan-faq-header {
        margin-bottom: 42px;
    }

    .milan-faq-header h2 {
        font-size: clamp(1.85rem, 7vw, 2.5rem);
    }

    .milan-faq-header p {
        font-size: 0.93rem;
        line-height: 1.8;
    }

    .milan-faq-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 45px;
    }

    .milan-faq-sidebar {
        position: static;
    }

    .milan-faq-question {
        min-height: 72px;
        gap: 15px;
        padding: 18px 3px;
        font-size: 0.94rem;
    }

    .milan-faq-icon {
        width: 22px;
        height: 22px;
        flex-basis: 22px;
    }

    .milan-faq-answer {
        padding: 0 30px 21px 3px;
    }

    .milan-faq-answer p {
        font-size: 0.9rem;
        line-height: 1.8;
    }

    .milan-faq-more {
        padding-top: 25px;
    }

    .milan-faq-contact-content {
        padding: 27px 23px;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 380px) {

    .milan-faq-container {
        width: calc(100% - 28px);
    }

    .milan-faq-question {
        font-size: 0.88rem;
    }

    .milan-faq-contact-content {
        padding: 23px 18px;
    }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .milan-faq-section *,
    .milan-faq-section *::before,
    .milan-faq-section *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

}
/* =========================================================
   MILAN AUCTIONEERS — CONTACT SECTION
   Uses the site's existing :root design tokens.
   All selectors are scoped to .milan-contact.
   ========================================================= */

.milan-contact {
  width: 100%;
  padding: clamp(4.5rem, 8vw, 7.5rem) 0;
  background: var(--secondary-bg-color, #fff);
  color: #263246;
  font-family: var(--font-body, Arial, sans-serif);
}

.milan-contact *,
.milan-contact *::before,
.milan-contact *::after {
  box-sizing: border-box;
}

.milan-contact__container {
  width: min(1200px, 92%);
  margin-inline: auto;
}

.milan-contact__header {
  max-width: 790px;
  margin: 0 auto clamp(2.75rem, 5vw, 4.25rem);
  text-align: center;
}

.milan-contact__eyebrow {
  display: inline-block;
  margin: 0 0 0.85rem;
  color: var(--color-tertiary, #9e1f2e);
  font-family: var(--font-cta, Arial, sans-serif);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  line-height: 1.4;
  text-transform: uppercase;
}

.milan-contact__header h2 {
  margin: 0;
  color: var(--color-primary, #003596);
  font-family: var(--font-heading, Georgia, serif);
  font-size: clamp(2rem, 4.4vw, 3.45rem);
  font-weight: 800;
  letter-spacing: -0.045em;
  line-height: 1.12;
}

.milan-contact__lead {
  max-width: 730px;
  margin: 1.15rem auto 0;
  color: #5d6878;
  font-size: 1rem;
  line-height: 1.8;
}

.milan-contact__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
  align-items: start;
  gap: clamp(2.25rem, 5vw, 4.75rem);
}

.milan-contact__form-column,
.milan-contact__office {
  min-width: 0;
}

.milan-contact__column-heading {
  margin-bottom: 1.65rem;
}

.milan-contact__column-heading .milan-contact__eyebrow {
  margin-bottom: 0.55rem;
}

.milan-contact__column-heading h3 {
  margin: 0;
  color: var(--color-primary, #003596);
  font-family: var(--font-heading, Georgia, serif);
  font-size: clamp(1.55rem, 2.4vw, 2rem);
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1.2;
}

.milan-contact__column-heading > p:last-child {
  margin: 0.8rem 0 0;
  color: #657082;
  font-size: 0.96rem;
  line-height: 1.75;
}

.milan-contact__form {
  display: grid;
  gap: 1.15rem;
}

.milan-contact__field {
  display: grid;
  gap: 0.48rem;
  min-width: 0;
}

.milan-contact__field label {
  color: #27354a;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.45;
}

.milan-contact__field label span {
  color: var(--color-tertiary, #9e1f2e);
}

.milan-contact__field input,
.milan-contact__field select,
.milan-contact__field textarea {
  display: block;
  width: 100%;
  min-width: 0;
  border: 1px solid #d8dee8;
  border-radius: 7px;
  outline: none;
  background: #fff;
  color: #243247;
  font: inherit;
  font-size: 0.94rem;
  line-height: 1.5;
  transition: border-color 180ms ease, box-shadow 180ms ease, background-color 180ms ease;
}

.milan-contact__field input,
.milan-contact__field select {
  min-height: 54px;
  padding: 0.85rem 1rem;
}

.milan-contact__field select {
  cursor: pointer;
}

.milan-contact__field textarea {
  min-height: 155px;
  padding: 0.9rem 1rem;
  resize: vertical;
}

.milan-contact__field input::placeholder,
.milan-contact__field textarea::placeholder {
  color: #929baa;
  opacity: 1;
}

.milan-contact__field input:focus,
.milan-contact__field select:focus,
.milan-contact__field textarea:focus {
  border-color: var(--color-primary, #003596);
  box-shadow: 0 0 0 3px rgba(0, 53, 150, 0.12);
}

.milan-contact__field [aria-invalid="true"] {
  border-color: #b42332;
  background: #fffafa;
}

.milan-contact__hint,
.milan-contact__error {
  display: block;
  min-height: 0.2rem;
  font-size: 0.78rem;
  line-height: 1.45;
}

.milan-contact__hint {
  color: #687486;
}

.milan-contact__error {
  color: #a51d2d;
  font-weight: 600;
}

.milan-contact__trap {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  clip-path: inset(50%) !important;
}

.milan-contact__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  margin-top: 0.25rem;
}

.milan-contact__submit,
.milan-contact__call-button {
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  padding: 0.85rem 1.35rem;
  border: 1px solid transparent;
  border-radius: 6px;
  font-family: var(--font-cta, Arial, sans-serif);
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.milan-contact__submit {
  min-width: 180px;
  background: var(--cta-primary-bg-color, #003596);
  color: var(--cta-secondary-font-color, #fff);
}

.milan-contact__submit:hover:not(:disabled) {
  background: #002b79;
  transform: translateY(-1px);
}

.milan-contact__submit:disabled {
  cursor: wait;
  opacity: 0.72;
}

.milan-contact__call-button {
  border-color: var(--color-primary, #003596);
  background: #fff;
  color: var(--color-primary, #003596);
}

.milan-contact__call-button:hover {
  background: #f1f5fc;
}

.milan-contact__call-button svg,
.milan-contact__icon svg {
  width: 19px;
  height: 19px;
  fill: currentColor;
}

.milan-contact__spinner {
  display: none;
  width: 16px;
  height: 16px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: milan-contact-spin 650ms linear infinite;
}

.milan-contact__form.is-submitting .milan-contact__spinner {
  display: inline-block;
}

.milan-contact__form-status {
  min-height: 1.4em;
  margin: 0;
  color: #275c37;
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1.5;
}

.milan-contact__form-status.is-error {
  color: #a51d2d;
}

.milan-contact__privacy {
  margin: 0;
  color: #778191;
  font-size: 0.76rem;
  line-height: 1.65;
}

.milan-contact__privacy a {
  color: var(--color-primary, #003596);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.milan-contact__map-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border: 1px solid #e1e5ec;
  border-radius: 9px;
  background: #edf1f6;
}

.milan-contact__map-wrap iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.milan-contact__directions {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.85rem;
  color: var(--color-primary, #003596);
  font-size: 0.88rem;
  font-weight: 800;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}

.milan-contact__location-note {
  margin: 0.7rem 0 0;
  padding: 0.75rem 0.85rem;
  border-left: 3px solid var(--color-tertiary, #9e1f2e);
  background: #f8f8fa;
  color: #626d7c;
  font-size: 0.78rem;
  line-height: 1.6;
}

.milan-contact__details {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin-top: 1.5rem;
  border-top: 1px solid #e6e9ef;
}

.milan-contact__detail {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  min-width: 0;
  padding: 1.2rem 0.75rem 1.2rem 0;
  border-bottom: 1px solid #e6e9ef;
}

.milan-contact__icon {
  display: inline-flex;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(0, 53, 150, 0.08);
  color: var(--color-primary, #003596);
}

.milan-contact__icon svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.milan-contact__detail h4 {
  margin: 0 0 0.4rem;
  color: #25344a;
  font-size: 0.88rem;
  font-weight: 800;
  line-height: 1.35;
}

.milan-contact__detail p,
.milan-contact__detail address,
.milan-contact__detail a {
  display: block;
  margin: 0;
  color: #667184;
  font-size: 0.82rem;
  font-style: normal;
  line-height: 1.7;
  overflow-wrap: anywhere;
}

.milan-contact__detail a {
  color: #4f5d72;
  text-decoration: none;
}

.milan-contact__detail a:hover {
  color: var(--color-primary, #003596);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.milan-contact a:focus-visible,
.milan-contact button:focus-visible {
  outline: 3px solid #e0a1aa;
  outline-offset: 3px;
}

@keyframes milan-contact-spin {
  to { transform: rotate(360deg); }
}

@media (max-width: 900px) {
  .milan-contact__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 3.5rem;
  }

  .milan-contact__office {
    max-width: 760px;
  }
}

@media (max-width: 560px) {
  .milan-contact {
    padding: 4rem 0;
  }

  .milan-contact__container {
    width: min(100% - 32px, 1200px);
  }

  .milan-contact__header {
    margin-bottom: 2.5rem;
    text-align: left;
  }

  .milan-contact__lead {
    margin-inline: 0;
  }

  .milan-contact__actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .milan-contact__submit,
  .milan-contact__call-button {
    width: 100%;
  }

  .milan-contact__details {
    grid-template-columns: minmax(0, 1fr);
  }

  .milan-contact__detail {
    padding-right: 0;
  }

  .milan-contact__map-wrap {
    aspect-ratio: 4 / 3;
  }
}

@media (prefers-reduced-motion: reduce) {
  .milan-contact *,
  .milan-contact *::before,
  .milan-contact *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}



















/* =========================================================
   MILAN AUCTIONEERS — GLOBAL FOOTER
   Uses existing Milan Auctioneers root design tokens.
   Scoped to .milan-global-footer to avoid unrelated changes.
   ========================================================= */

.milan-global-footer {
  width: 100%;
  color: rgba(255, 255, 255, 0.88);
  background: var(--color-primary, #003596);
  font-family: var(--font-body, Arial, sans-serif);
}

.milan-global-footer *,
.milan-global-footer *::before,
.milan-global-footer *::after {
  box-sizing: border-box;
}

.milan-global-footer__main {
  padding: clamp(3.5rem, 6vw, 5.5rem) 0 2.8rem;
  background: var(--color-primary, #003596);
}

.milan-global-footer__container {
  width: min(1240px, 92%);
  margin-inline: auto;
}

.milan-global-footer__grid {
  display: grid;
  grid-template-columns: 0.88fr 1.05fr 1.15fr 1.15fr;
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
}

.milan-global-footer__column {
  min-width: 0;
}

.milan-global-footer__heading {
  position: relative;
  margin: 0 0 1.5rem;
  padding: 0 0 0.9rem;
  color: #fff;
  font-family: var(--font-heading, Georgia, serif);
  font-size: 1.15rem;
  font-weight: 800;
  line-height: 1.3;
}



.milan-global-footer__links {
  display: grid;
  gap: 0.82rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.milan-global-footer__links a,
.milan-global-footer__contact-group a {
  color: rgba(255, 255, 255, 0.84);
  font-size: 0.88rem;
  line-height: 1.55;
  text-decoration: none;
  overflow-wrap: anywhere;
  transition: color 160ms ease, opacity 160ms ease;
}

.milan-global-footer__links a {
  display: inline-block;
}

.milan-global-footer__links a:hover,
.milan-global-footer__contact-group a:hover,
.milan-global-footer__directions:hover {
  color: #fff;
  text-decoration: underline;
  text-decoration-color: var(--color-tertiary, #9e1f2e);
  text-underline-offset: 4px;
}

.milan-global-footer__coverage-note,
.milan-global-footer__map-note {
  margin: 1.2rem 0 0;
  color: rgba(255, 255, 255, 0.68);
  font-size: 0.75rem;
  line-height: 1.65;
}

.milan-global-footer__contact-group {
  display: grid;
  gap: 0.35rem;
  margin-bottom: 1.15rem;
}

.milan-global-footer__subheading {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0 0 0.25rem;
  color: #fff;
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1.4;
}

.milan-global-footer__subheading svg {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.milan-global-footer__contact-group address,
.milan-global-footer__contact-group p {
  margin: 0;
  color: rgba(255, 255, 255, 0.84);
  font-size: 0.82rem;
  font-style: normal;
  line-height: 1.65;
  overflow-wrap: anywhere;
}

.milan-global-footer__map {
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.12);
}

.milan-global-footer__map iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.milan-global-footer__directions {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.85rem;
  color: #fff;
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1.5;
  text-decoration: underline;
  text-decoration-color: rgba(255, 255, 255, 0.5);
  text-underline-offset: 4px;
}

.milan-global-footer__brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: clamp(3rem, 5vw, 4.5rem);
  padding: clamp(2.25rem, 4vw, 3.5rem) 1.5rem 0;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  text-align: center;
}

.milan-global-footer__logo-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.2rem;
}

.milan-global-footer__logo-link img {
  display: block;
  width: clamp(145px, 16vw, 190px);
  height: auto;
  max-width: 100%;
  object-fit: contain;
}

.milan-global-footer__brand-name {
  margin: 0;
  color: #fff;
  font-family: var(--font-heading, Georgia, serif);
  font-size: 1.35rem;
  font-weight: 800;
  line-height: 1.3;
}

.milan-global-footer__description {
  max-width: 850px;
  margin: 0.85rem auto 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.88rem;
  line-height: 1.8;
}

.milan-global-footer__tagline {
  margin: 1rem 0 0;
  color: #fff;
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1.6;
}

.milan-global-footer__services {
  margin: 0.55rem 0 0;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.78rem;
  letter-spacing: 0.025em;
  line-height: 1.6;
}

.milan-global-footer__services span {
  padding-inline: 0.35rem;
  color: rgba(255, 255, 255, 0.48);
}

.milan-global-footer__bottom {
  background: #002b79;
}

.milan-global-footer__bottom-inner {
  display: flex;
  width: min(1240px, 92%);
  min-height: 68px;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 2rem;
  margin-inline: auto;
  padding-block: 1rem;
}

.milan-global-footer__bottom p {
  margin: 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.76rem;
  line-height: 1.6;
}

.milan-global-footer__bottom p span {
  color: #fff;
  font-weight: 800;
}

.milan-global-footer__bottom a {
  color: #fff;
  font-weight: 800;
  text-decoration: underline;
  text-decoration-color: rgba(255, 255, 255, 0.5);
  text-underline-offset: 3px;
}

.milan-global-footer a:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 4px;
  border-radius: 2px;
}

@media (max-width: 1050px) {
  .milan-global-footer__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 2.5rem;
    row-gap: 3rem;
  }

  .milan-global-footer__map {
    max-width: 480px;
  }
}

@media (max-width: 600px) {
  .milan-global-footer__main {
    padding-top: 3.25rem;
  }

  .milan-global-footer__container,
  .milan-global-footer__bottom-inner {
    width: min(100% - 36px, 1240px);
  }

  .milan-global-footer__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 2.4rem;
  }

  .milan-global-footer__heading {
    margin-bottom: 1.15rem;
  }

  .milan-global-footer__map {
    max-width: none;
    aspect-ratio: 16 / 10;
  }

  .milan-global-footer__brand {
    margin-top: 2.75rem;
    padding-inline: 0;
  }

  .milan-global-footer__bottom-inner {
    flex-direction: column;
    justify-content: center;
    text-align: center;
    gap: 0.45rem;
    padding-block: 1.15rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .milan-global-footer *,
  .milan-global-footer *::before,
  .milan-global-footer *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}













































/*===============================================

Milan About Us Page

===============================================*/


/* =========================================================
   MILAN AUCTIONEERS
   ABOUT US PAGE
   Premium Corporate Styling
   ========================================================= */


/* =========================================================
   1. BASE PAGE STYLES
   ========================================================= */

.milan-about-hero,
.milan-about-section,
.milan-about-contact-cta {
    width: 100%;
    position: relative;
    box-sizing: border-box;
}

.milan-about-hero *,
.milan-about-section *,
.milan-about-contact-cta * {
    box-sizing: border-box;
}

.milan-about-container {
    width: min(1200px, 92%);
    margin-inline: auto;
}

.milan-about-section {
    padding: 100px 0;
}

.milan-about-section-header {
    width: min(850px, 100%);
    margin: 0 auto 58px;
    text-align: center;
}

.milan-about-eyebrow {
    display: block;
    width: fit-content;
    margin: 0 auto 16px;
    color: var(--color-tertiary);
    font-family: var(--font-cta);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 2px;
    line-height: 1.5;
    text-transform: uppercase;
}

.milan-about-section-header h2 {
    margin: 0 auto 18px;
    color: var(--primary-font-color);
    font-family: var(--font-heading);
    font-size: clamp(1.9rem, 3.5vw, 2.8rem);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.8px;
}

.milan-about-section-intro {
    max-width: 760px;
    margin: 0 auto;
    color: #5c6472;
    font-family: var(--font-body);
    font-size: 1.04rem;
    font-weight: 400;
    line-height: 1.8;
    text-align: center;
}

.milan-about-section p,
.milan-about-section li {
    font-family: var(--font-body);
}

.milan-about-section p {
    color: #525d6b;
    font-size: 0.98rem;
    line-height: 1.85;
}

.milan-about-section h3 {
    color: var(--primary-font-color);
    font-family: var(--font-heading);
    font-size: 1.25rem;
    font-weight: 800;
    line-height: 1.4;
}

.milan-about-section ul {
    padding-left: 20px;
}

.milan-about-section li {
    color: #525d6b;
    font-size: 0.94rem;
    line-height: 1.75;
}

.milan-about-section a,
.milan-about-contact-cta a {
    text-decoration: none;
}


/* =========================================================
   2. BUTTON SYSTEM
   ========================================================= */

.milan-about-button {
    display: inline-flex;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    padding: var(--cta-padding-y) var(--cta-padding-x);
    border: 1px solid transparent;
    border-radius: 5px;
    font-family: var(--font-cta);
    font-size: 0.92rem;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition:
        background var(--transition-timing) ease,
        color var(--transition-timing) ease,
        border-color var(--transition-timing) ease,
        transform var(--transition-timing) ease,
        box-shadow var(--transition-timing) ease;
}

.milan-about-button:hover {
    transform: translateY(-3px);
}

.milan-about-button:focus-visible,
.milan-about-service-link:focus-visible,
.milan-about-contact-cta__details a:focus-visible {
    outline: 3px solid var(--color-tertiary);
    outline-offset: 4px;
}

.milan-about-button--light {
    color: var(--cta-primary-font-color);
    background: var(--cta-secondary-bg-color);
    border-color: var(--color-secondary);
}

.milan-about-button--light:hover {
    color: var(--cta-secondary-font-color);
    background: transparent;
    border-color: var(--color-secondary);
}

.milan-about-button--outline-light {
    color: var(--cta-secondary-font-color);
    background: transparent;
    border-color: rgba(255, 255, 255, 0.75);
}

.milan-about-button--outline-light:hover {
    color: var(--cta-primary-font-color);
    background: var(--color-secondary);
    border-color: var(--color-secondary);
}


/* =========================================================
   3. HERO SECTION
   ========================================================= */

.milan-about-hero {
    min-height: 590px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 110px 0 115px;
    background: var(--primary-bg-color);
    isolation: isolate;
}

.milan-about-hero__background {
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(
            circle at 85% 15%,
            rgba(255, 255, 255, 0.12),
            transparent 34%
        ),
        radial-gradient(
            circle at 10% 90%,
            rgba(158, 31, 46, 0.18),
            transparent 35%
        );
}

.milan-about-hero__content {
    max-width: 1000px;
    text-align: center;
}

.milan-about-hero .milan-about-eyebrow {
    color: var(--color-tertiary);
}

.milan-about-hero h1 {
    max-width: 950px;
    margin: 0 auto 24px;
    color: #ffffff;
    font-family: var(--font-heading);
    font-size: clamp(2.5rem, 5.2vw, 4.4rem);
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -1.5px;
}

.milan-about-hero__description {
    max-width: 790px;
    margin: 0 auto;
    color: rgba(255, 255, 255, 0.9);
    font-family: var(--font-body);
    font-size: clamp(1rem, 1.4vw, 1.12rem);
    line-height: 1.85;
}

.milan-about-hero__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 15px;
    margin-top: 34px;
}


/* =========================================================
   4. COMPANY OVERVIEW
   ========================================================= */

.milan-about-overview {
    background: var(--color-secondary);
}

.milan-about-overview__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    align-items: start;
    gap: 55px;
}

.milan-about-overview__content p {
    margin: 0 0 18px;
    text-align: left;
}

.milan-about-overview__visual {
    min-width: 0;
}

.milan-about-image-placeholder {
    min-height: 310px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px;
    border-radius: 8px;
    background:
        linear-gradient(
            135deg,
            rgba(5, 32, 82, 0.92),
            rgba(0, 53, 150, 0.82)
        );
    color: #ffffff;
    text-align: center;
    font-family: var(--font-body);
    font-size: 0.95rem;
    font-weight: 600;
}

.milan-about-company-details {
    margin-top: 24px;
    padding: 27px;
    
    background: var(--color-secondary);;
    
}

.milan-about-company-details h3 {
    margin: 0 0 20px;
}

.milan-about-company-details dl,
.milan-about-details-list {
    margin: 0;
}

.milan-about-company-details dl > div,
.milan-about-details-list > div {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    padding: 12px 0;
    border-bottom: 1px solid #edf0f4;
}

.milan-about-company-details dl > div:last-child,
.milan-about-details-list > div:last-child {
    border-bottom: none;
}

.milan-about-company-details dt,
.milan-about-details-list dt {
    color: #6a7280;
    font-family: var(--font-body);
    font-size: 0.85rem;
    font-weight: 600;
}

.milan-about-company-details dd,
.milan-about-details-list dd {
    max-width: 58%;
    margin: 0;
    color: var(--primary-font-color);
    font-family: var(--font-body);
    font-size: 0.88rem;
    font-weight: 700;
    line-height: 1.5;
    text-align: right;
}


/* =========================================================
   5. COMPANY HISTORY TIMELINE
   ========================================================= */

.milan-about-history {
    background: var(--color-secondary);
}

.milan-about-timeline {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
    padding-top: 22px;
}

.milan-about-timeline::before {
    position: absolute;
    top: 38px;
    left: 9%;
    right: 9%;
    height: 2px;
    content: "";
    background: linear-gradient(
        90deg,
        var(--color-primary),
        var(--color-tertiary)
    );
}

.milan-about-timeline__item {
    position: relative;
    z-index: 1;
    min-width: 0;
    padding: 0 18px 25px;
    text-align: left;
}

.milan-about-timeline__year {
    width: fit-content;
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 27px;
    padding: 7px 14px;
    border: 4px solid #f6f8fc;
    border-radius: 10px;
    background: var(--color-primary);
    color: #ffffff;
    font-family: var(--font-cta);
    font-size: 0.8rem;
    font-weight: 800;
    white-space: nowrap;
}

.milan-about-timeline__item h3 {
    margin: 0 0 13px;
    font-size: 1.1rem;
}

.milan-about-timeline__item p {
    margin: 0;
    font-size: 0.9rem;
    text-align: left;
}


/* =========================================================
   6. MISSION AND VISION
   ========================================================= */

.milan-about-purpose {
    background: var(--color-secondary);
}

.milan-about-purpose__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 28px;
}

.milan-about-purpose-card {
    min-height: 100px;
    padding: 14px;
   
    background: #ffffff;
    
    transition:
        transform var(--transition-timing) ease,
        box-shadow var(--transition-timing) ease;
}

.milan-about-purpose-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 40px rgba(0, 34, 92, 0.1);
}

.milan-about-card-icon {
    width: 55px;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
    border-radius: 7px;
    background: rgba(0, 53, 150, 0.08);
    color: var(--color-primary);
}

.milan-about-card-icon svg {
    width: 27px;
    height: 27px;
}

.milan-about-purpose-card h3 {
    margin: 0 0 14px;
}

.milan-about-purpose-card p {
    margin: 0;
    text-align: left;
}


/* =========================================================
   7. LICENSING AND COMPLIANCE
   ========================================================= */

.milan-about-licensing {
    background: var(--color-secondary);
}

.milan-about-licensing__grid {
    display: grid;
    grid-template-columns:  minmax(0, 1fr);
    gap: 30px;
}

.milan-about-licensing__details,
.milan-about-licensing__activities {
    min-width: 0;
    padding: 34px;
    border: 1px solid #e6eaf1;
    border-radius: 8px;
    background: #ffffff;
    
}

.milan-about-licensing__details h3,
.milan-about-licensing__activities h3 {
    margin: 0 0 22px;
}

.milan-about-document-placeholder {
    min-height: 145px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 25px;
    padding: 20px;
    border: 1px dashed rgba(0, 53, 150, 0.35);
    border-radius: 6px;
    background: #f7f9fd;
    color: var(--primary-font-color);
    font-family: var(--font-body);
    font-size: 0.9rem;
    font-weight: 600;
    text-align: center;
}

.milan-about-check-list {
    display: grid;
    gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.milan-about-check-list li {
    position: relative;
    padding-left: 28px;
    text-align: left;
}




/* =========================================================
   8. AREAS OF JURISDICTION
   ========================================================= */

.milan-about-jurisdiction {
    background: var(--color-secondary);
}

.milan-about-jurisdiction__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 28px;
}

.milan-about-jurisdiction-card {
    min-width: 0;
    padding: 36px;
    border: 1px solid #e7ebf2;
    border-radius: 8px;
    background: #ffffff;
    
}

.milan-about-jurisdiction-card h3 {
    margin: 0 0 16px;
}

.milan-about-jurisdiction-card > p {
    margin: 0 0 22px;
    text-align: left;
}



.milan-about-county-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.milan-about-county-grid li {
    display: flex;
    min-height: 43px;
    align-items: center;
    justify-content: center;
    padding: 8px;
    
    background: #ffffff;
    color: var(--primary-font-color);
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1.35;
    text-align: center;
}


/* =========================================================
   9. SERVICES OVERVIEW
   ========================================================= */

.milan-about-services {
    background: var(--color-secondary);
}

.milan-about-services__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 2fr));
    align-items: stretch;
    gap: 22px;
}

.milan-about-service-card {
    min-width: 0;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    padding: 29px 23px;
    border: 1px solid #e7ebf2;
    border-radius: 7px;
    background: #ffffff;
    box-shadow: 0 10px 28px rgba(0, 34, 92, 0.045);
    transition:
        transform var(--transition-timing) ease,
        box-shadow var(--transition-timing) ease;
}

.milan-about-service-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 36px rgba(0, 34, 92, 0.1);
}

.milan-about-service-card .milan-about-card-icon {
    margin-bottom: 20px;
}

.milan-about-service-card h3 {
    margin: 0 0 14px;
    font-size: 1.08rem;
}

.milan-about-service-card p {
    margin: 0 0 17px;
    font-size: 0.9rem;
    text-align: left;
}

.milan-about-service-card ul {
    display: grid;
    gap: 9px;
    margin: 0 0 24px;
    padding-left: 18px;
}

.milan-about-service-card li {
    font-size: 0.84rem;
    line-height: 1.6;
    text-align: left;
}

.milan-about-service-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: auto;
    padding-top: 18px;
    border-top: 1px solid #edf0f4;
    color: var(--color-primary);
    font-family: var(--font-cta);
    font-size: 0.85rem;
    font-weight: 800;
    line-height: 1.5;
    text-decoration: none;
}

.milan-about-service-link::after {
    content: "→";
    transition: transform var(--transition-timing) ease;
}

.milan-about-service-link:hover {
    color: var(--color-tertiary);
}

.milan-about-service-link:hover::after {
    transform: translateX(4px);
}


/* =========================================================
   10. PRINCIPAL AUCTIONEER AND TEAM
   ========================================================= */

.milan-about-team {
    background: var(--color-secondary);;
}

.milan-about-team__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
    gap: 30px;
}

.milan-about-principal,
.milan-about-marketing-team {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #e8ebf1;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 12px 35px rgba(0, 34, 92, 0.06);
}

.milan-about-person-image-placeholder,
.milan-about-team-image-placeholder {
    min-height: 280px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 25px;
    background: linear-gradient(
        135deg,
        rgba(5, 32, 82, 0.94),
        rgba(0, 53, 150, 0.8)
    );
    color: #ffffff;
    font-family: var(--font-body);
    font-size: 0.95rem;
    font-weight: 600;
    text-align: center;
}

.milan-about-principal__content,
.milan-about-marketing-team__content {
    padding: 30px;
}

.milan-about-person-label {
    margin: 0 0 10px;
    color: var(--color-tertiary) !important;
    font-size: 0.72rem !important;
    font-weight: 800;
    letter-spacing: 1.5px;
    line-height: 1.5 !important;
}

.milan-about-principal h3,
.milan-about-marketing-team h3 {
    margin: 0 0 9px;
    font-size: 1.45rem;
}

.milan-about-person-role {
    margin: 0 0 16px;
    color: var(--color-tertiary) !important;
    font-size: 0.92rem !important;
    font-weight: 700;
}

.milan-about-principal__content > p:not(.milan-about-person-label, .milan-about-person-role),
.milan-about-marketing-team__content > p:not(.milan-about-person-label) {
    margin: 0 0 20px;
    text-align: left;
}

.milan-about-principal h4 {
    margin: 25px 0 16px;
    color: var(--primary-font-color);
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 800;
}

.milan-about-team-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 20px 0 0;
    padding: 0;
    list-style: none;
}

.milan-about-team-list li {
    padding: 13px 12px;
    
    border-radius: 3px;
    background: #f6f8fc;
    color: var(--primary-font-color);
    font-size: 0.88rem;
    font-weight: 700;
}



/* =========================================================
   13. OUR COMMITMENT
   ========================================================= */

.milan-about-commitment {
    background: var(--color-secondary);
}

.milan-about-commitment__content {
    width: min(850px, 100%);
    margin: 0 auto;
    padding: 35px 42px;
    
    border-radius: 4px;
    background: #ffffff;
    
}

.milan-about-commitment__content p {
    margin: 0 0 18px;
    text-align: left;
}

.milan-about-commitment__content p:last-child {
    margin-bottom: 0;
}


/* =========================================================
   14. CONTACT CTA
   ========================================================= */

.milan-about-contact-cta {
    padding: 90px 0;
    overflow: hidden;
    background: var(--primary-bg-color);
    isolation: isolate;
}

.milan-about-contact-cta::before,
.milan-about-contact-cta::after {
    position: absolute;
    z-index: -1;
    width: 350px;
    height: 350px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.milan-about-contact-cta::before {
    top: -190px;
    left: -100px;
}

.milan-about-contact-cta::after {
    right: -120px;
    bottom: -220px;
    width: 450px;
    height: 450px;
}

.milan-about-contact-cta__content {
    max-width: 850px;
    margin: 0 auto;
    text-align: center;
}

.milan-about-contact-cta .milan-about-eyebrow {
    color: rgba(255, 255, 255, 0.85);
}

.milan-about-contact-cta h2 {
    margin: 0 auto 20px;
    color: #ffffff;
    font-family: var(--font-heading);
    font-size: clamp(2rem, 4vw, 3.1rem);
    font-weight: 800;
    line-height: 1.2;
}

.milan-about-contact-cta__content > p:not(.milan-about-eyebrow) {
    max-width: 730px;
    margin: 0 auto;
    color: rgba(255, 255, 255, 0.9);
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.8;
    text-align: center;
}

.milan-about-contact-cta__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 15px;
    margin-top: 30px;
}

.milan-about-contact-cta__details {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px 30px;
    margin-top: 30px;
}

.milan-about-contact-cta__details a {
    color: #ffffff;
    font-family: var(--font-body);
    font-size: 0.94rem;
    font-weight: 600;
    text-decoration: none;
    transition: opacity var(--transition-timing) ease;
}

.milan-about-contact-cta__details a:hover {
    opacity: 0.75;
}


/* =========================================================
   15. RESPONSIVE DESIGN
   ========================================================= */


/* Large laptops and smaller desktops */

@media (max-width: 1200px) {

    .milan-about-services__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .milan-about-timeline {
        gap: 15px;
    }

    .milan-about-timeline__item {
        padding-inline: 10px;
    }

}


/* Tablets */

@media (max-width: 1024px) {

    .milan-about-section {
        padding: 80px 0;
    }

    .milan-about-overview__grid,
    .milan-about-why__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 35px;
    }

    .milan-about-timeline {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        row-gap: 35px;
    }

    .milan-about-timeline::before {
        display: none;
    }

    .milan-about-timeline__item {
        padding: 20px;
        border-left: 2px solid var(--color-primary);
        background: #ffffff;
        border-radius: 0 6px 6px 0;
    }

    .milan-about-timeline__year {
        margin-bottom: 17px;
        border-color: #ffffff;
    }

    .milan-about-sticky-image-placeholder {
        position: relative;
        top: auto;
        min-height: 500px;
        max-height: none;
    }

    .milan-about-values__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}


/* Small tablets and large phones */

@media (max-width: 768px) {

    .milan-about-section {
        padding: 70px 0;
    }

    .milan-about-section-header {
        margin-bottom: 42px;
    }

    .milan-about-hero {
        min-height: auto;
        padding: 100px 0;
    }

    .milan-about-hero h1 {
        font-size: clamp(2.15rem, 7vw, 3.3rem);
        letter-spacing: -0.8px;
    }

    .milan-about-overview__grid,
    .milan-about-why__grid,
    .milan-about-licensing__grid,
    .milan-about-jurisdiction__grid,
    .milan-about-team__grid {
        grid-template-columns: 1fr;
    }

    .milan-about-overview__grid {
        gap: 30px;
    }

    .milan-about-purpose__grid {
        grid-template-columns: 1fr;
    }

    .milan-about-timeline {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .milan-about-services__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .milan-about-why__visual {
        align-self: auto;
    }

    .milan-about-sticky-image-placeholder {
        position: relative;
        top: auto;
        min-height: 380px;
        max-height: none;
    }

    .milan-about-contact-cta {
        padding: 75px 0;
    }

}


/* Mobile phones */

@media (max-width: 560px) {

    .milan-about-container {
        width: min(100% - 36px, 1200px);
    }

    .milan-about-section {
        padding: 60px 0;
    }

    .milan-about-section-header {
        margin-bottom: 35px;
    }

    .milan-about-section-header h2 {
        font-size: 1.8rem;
        line-height: 1.25;
    }

    .milan-about-section-intro {
        font-size: 0.94rem;
        line-height: 1.75;
    }

    .milan-about-hero {
        padding: 80px 0;
    }

    .milan-about-hero h1 {
        font-size: 2.15rem;
    }

    .milan-about-hero__description {
        font-size: 0.94rem;
    }

    .milan-about-hero__actions {
        flex-direction: column;
        align-items: stretch;
    }

    .milan-about-button {
        width: 100%;
        min-height: 50px;
    }

    .milan-about-image-placeholder {
        min-height: 230px;
    }

    .milan-about-company-details {
        padding: 21px 17px;
    }

    .milan-about-company-details dl > div,
    .milan-about-details-list > div {
        flex-direction: column;
        gap: 5px;
    }

    .milan-about-company-details dd,
    .milan-about-details-list dd {
        max-width: 100%;
        text-align: left;
    }

    .milan-about-purpose-card,
    .milan-about-licensing__details,
    .milan-about-licensing__activities,
    .milan-about-jurisdiction-card {
        padding: 25px 21px;
    }

    .milan-about-services__grid {
        grid-template-columns: 1fr;
    }

    .milan-about-service-card {
        padding: 26px 22px;
    }

    .milan-about-values__grid {
        grid-template-columns: 1fr;
    }

    .milan-about-value-card {
        min-height: auto;
        padding: 25px;
    }

    .milan-about-commitment__content {
        padding: 25px 22px;
    }

    .milan-about-person-image-placeholder,
    .milan-about-team-image-placeholder {
        min-height: 230px;
    }

    .milan-about-principal__content,
    .milan-about-marketing-team__content {
        padding: 24px 21px;
    }

    .milan-about-team-list {
        grid-template-columns: 1fr;
    }

    .milan-about-county-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .milan-about-contact-cta {
        padding: 65px 0;
    }

    .milan-about-contact-cta h2 {
        font-size: 1.9rem;
    }

    .milan-about-contact-cta__actions {
        flex-direction: column;
        align-items: stretch;
    }

    .milan-about-contact-cta__details {
        flex-direction: column;
        gap: 15px;
    }

}


/* =========================================================
   16. ACCESSIBILITY AND REDUCED MOTION
   ========================================================= */

.milan-about-hero a:focus-visible,
.milan-about-section a:focus-visible,
.milan-about-contact-cta a:focus-visible {
    outline: 3px solid var(--color-tertiary);
    outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {

    .milan-about-hero *,
    .milan-about-section *,
    .milan-about-contact-cta * {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

}


/* =========================================================
   17. LAYOUT SAFETY
   ========================================================= */

.milan-about-hero,
.milan-about-section,
.milan-about-contact-cta {
    max-width: 100%;
}

.milan-about-overview__grid > *,
.milan-about-why__grid > *,
.milan-about-services__grid > *,
.milan-about-team__grid > *,
.milan-about-licensing__grid > *,
.milan-about-jurisdiction__grid > * {
    min-width: 0;
}

.milan-about-section img {
    display: block;
    max-width: 100%;
    height: auto;
}

@media (max-width: 768px) {

    .milan-about-sticky-image-placeholder {
        position: relative;
        top: auto;
        max-height: none;
    }

}






























/* =========================================================
   MILAN AUCTIONEERS
   SERVICE PAGE: REPOSSESSION OF MOVABLE ASSETS
   Complete responsive stylesheet
   ========================================================= */


/* =========================================================
   01. DESIGN TOKENS AND BASE
========================================================= */

.milan-service-page {
    --milan-blue: var(--color-primary, rgb(0, 53, 150));
    --milan-white: var(--color-secondary, rgb(255, 255, 255));
    --milan-burgundy: var(--color-tertiary, rgb(158, 31, 46));

    --milan-heading-font:
        var(--font-heading, "Montserrat", Georgia, "Times New Roman", serif);

    --milan-body-font:
        var(--font-body, "Google Sans", "Open Sans", Arial, Helvetica, sans-serif);

    --milan-cta-font:
        var(--font-cta, "Roboto", Arial, Helvetica, sans-serif);

    --milan-text: #252a32;
    --milan-muted: #626b78;
    --milan-border: #e3e7ed;
    --milan-soft: #f7f8fa;
    --milan-blue-dark: #002b76;

    --milan-container: 1200px;
    --milan-section-space: clamp(68px, 8vw, 108px);
    --milan-card-radius: 12px;

    width: 100%;
    overflow: clip;
    background: var(--milan-white);
    color: var(--milan-text);
    font-family: var(--milan-body-font);
    font-size: 16px;
    line-height: 1.75;
}

.milan-service-page *,
.milan-service-page *::before,
.milan-service-page *::after {
    box-sizing: border-box;
}

.milan-service-page img {
    max-width: 100%;
}

.milan-service-page a {
    color: inherit;
    text-decoration: none;
}

.milan-service-page button {
    font: inherit;
}

.milan-service-container {
    width: min(var(--milan-container), calc(100% - 48px));
    margin-inline: auto;
}

.milan-service-page p {
    margin: 0 0 18px;
    color: var(--milan-muted);
    text-align: left;
}

.milan-service-page h1,
.milan-service-page h2,
.milan-service-page h3 {
    margin-top: 0;
    color: var(--milan-blue);
    font-family: var(--milan-heading-font);
    font-weight: 800;
    line-height: 1.2;
}

.milan-service-page h1 {
    font-size: clamp(2.3rem, 5.2vw, 4.5rem);
}

.milan-service-page h2 {
    font-size: clamp(1.85rem, 3.5vw, 3rem);
}

.milan-service-page h3 {
    font-size: 1.15rem;
}

.milan-service-page ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.milan-service-page a:focus-visible,
.milan-service-page button:focus-visible {
    outline: 3px solid var(--milan-burgundy);
    outline-offset: 4px;
}


/* =========================================================
   02. BREADCRUMB
========================================================= */

.milan-service-breadcrumb {
    position: relative;
    z-index: 2;
    padding: 14px 0;
    background: var(--milan-white);
    border-bottom: 1px solid var(--milan-border);
}

.milan-service-breadcrumb ol {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.milan-service-breadcrumb li {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--milan-muted);
    font-size: 0.82rem;
    font-weight: 500;
}

.milan-service-breadcrumb li + li::before {
    content: "/";
    color: #a5abb4;
}

.milan-service-breadcrumb a {
    color: var(--milan-blue);
    transition: color 180ms ease;
}

.milan-service-breadcrumb a:hover {
    color: var(--milan-burgundy);
}

.milan-service-breadcrumb [aria-current="page"] {
    color: var(--milan-burgundy);
    font-weight: 700;
}


/* =========================================================
   03. EYEBROWS AND SECTION HEADERS
   All section eyebrow + heading groups are centered.
========================================================= */

.milan-service-eyebrow {
    margin: 0 0 14px !important;
    color: var(--milan-burgundy) !important;
    font-family: var(--milan-cta-font);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.15em;
    line-height: 1.5;
    text-align: center !important;
    text-transform: uppercase;
}

.milan-service-section {
    width: 100%;
    padding-block: var(--milan-section-space);
    background: var(--milan-white);
}

.milan-service-section__header {
    width: min(850px, 100%);
    margin: 0 auto 48px;
    text-align: center;
}

.milan-service-section__header .milan-service-eyebrow {
    margin-bottom: 13px !important;
}

.milan-service-section__header h2 {
    max-width: 820px;
    margin: 0 auto;
    text-align: center;
}

.milan-service-section-note {
    max-width: 920px;
    margin: 30px auto 0 !important;
    padding: 17px 20px;
    border-left: 3px solid var(--milan-burgundy);
    background: var(--milan-soft);
    color: var(--milan-muted);
    font-size: 0.9rem;
}


/* =========================================================
   04. BUTTONS
========================================================= */

.milan-service-button {
    display: inline-flex;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    padding: 13px 24px;
    border: 1px solid transparent;
    border-radius: 5px;
    font-family: var(--milan-cta-font);
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1.35;
    text-align: center;
    transition:
        background 180ms ease,
        color 180ms ease,
        border-color 180ms ease,
        transform 180ms ease;
}

.milan-service-button:hover {
    transform: translateY(-2px);
}

.milan-service-button--primary {
    background: var(--milan-burgundy);
    color: var(--milan-white) !important;
}

.milan-service-button--primary:hover {
    background: var(--milan-blue);
}

.milan-service-button--outline {
    border-color: rgba(255, 255, 255, 0.8);
    background: transparent;
    color: var(--milan-white) !important;
}

.milan-service-button--outline:hover {
    border-color: var(--milan-white);
    background: var(--milan-white);
    color: var(--milan-blue) !important;
}

.milan-service-button--light {
    background: var(--milan-white);
    color: var(--milan-blue) !important;
}

.milan-service-button--light:hover {
    background: #edf1f8;
}

.milan-service-button--outline-light {
    border-color: rgba(255, 255, 255, 0.8);
    background: transparent;
    color: var(--milan-white) !important;
}

.milan-service-button--outline-light:hover {
    background: var(--milan-white);
    color: var(--milan-blue) !important;
}


/* =========================================================
   05. HERO
   Only image-bearing section on this page.
========================================================= */

.milan-service-hero {
    position: relative;
    display: flex;
    min-height: clamp(570px, 68vw, 760px);
    align-items: center;
    justify-content: center;
    isolation: isolate;
    overflow: hidden;
    padding: 100px 0;
    background-color: var(--milan-blue-dark);
    background-image: var(--milan-service-hero-image);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.milan-service-hero__overlay {
    position: absolute;
    z-index: -1;
    inset: 0;
    background:
        linear-gradient(
            110deg,
            rgba(0, 28, 78, 0.94) 0%,
            rgba(0, 42, 112, 0.84) 50%,
            rgba(0, 31, 85, 0.88) 100%
        );
}

.milan-service-hero__inner {
    position: relative;
    z-index: 1;
    display: flex;
    max-width: 1050px;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.milan-service-hero__eyebrow {
    color: #ffffff !important;
}

.milan-service-hero h1 {
    max-width: 1000px;
    margin: 0 auto 24px;
    color: var(--milan-white);
    text-align: center;
    text-wrap: balance;
}

.milan-service-hero__description {
    max-width: 790px;
    margin: 0 auto 32px !important;
    color: rgba(255, 255, 255, 0.9) !important;
    font-size: clamp(1rem, 1.5vw, 1.13rem);
    line-height: 1.85;
    text-align: center !important;
}

.milan-service-hero__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 14px;
}

.milan-service-hero__trust-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px 30px;
    margin-top: 42px !important;
}

.milan-service-hero__trust-list li {
    position: relative;
    padding-left: 20px;
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.84rem;
    font-weight: 600;
}

.milan-service-hero__trust-list li::before {
    position: absolute;
    top: 0.58em;
    left: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--milan-burgundy);
    content: "";
}


/* =========================================================
   06. SERVICE OVERVIEW
========================================================= */

.milan-service-overview__layout {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.85fr);
    align-items: start;
    gap: clamp(32px, 5vw, 70px);
}

.milan-service-overview__content {
    min-width: 0;
}

.milan-service-overview__content p:last-child {
    margin-bottom: 0;
}

.milan-service-info-panel {
    padding: 32px;
    
    border-radius: var(--milan-card-radius);
    background: var(--color-secondary);
}

.milan-service-info-panel h3,
.milan-service-check-panel h3,
.milan-service-legal-panel h3 {
    margin-bottom: 22px;
    color: var(--color-primary);
}

.milan-service-check-list {
    display: grid;
    gap: 15px;
}

.milan-service-check-list li {
    position: relative;
    padding-left: 29px;
    color: var(--milan-muted);
    font-size: 0.94rem;
    line-height: 1.6;
    text-align: left;
}

.milan-service-check-list li::before {
    position: absolute;
    top: 0.18em;
    left: 0;
    display: grid;
    width: 18px;
    height: 18px;
    place-items: center;
    border-radius: 50%;
    background: none;
    color: var(--milan-blue);
    content: "✓";
    font-size: 0.72rem;
    font-weight: 900;
}

.milan-service-text-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 26px;
    color: var(--milan-burgundy) !important;
    font-size: 0.9rem;
    font-weight: 800;
}

.milan-service-text-link span {
    transition: transform 180ms ease;
}

.milan-service-text-link:hover span {
    transform: translateX(5px);
}


/* =========================================================
   07. SHARED CARD GRID
========================================================= */

.milan-service-card-grid {
    display: grid;
    gap: 22px;
}

.milan-service-card-grid--three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.milan-service-card {
    position: relative;
    min-width: 0;
    padding: 30px;
    
    background: var(--milan-white);
    transition:
        border-color 200ms ease,
        box-shadow 200ms ease,
        transform 200ms ease;
}



.milan-service-card__number {
    display: inline-flex;
    width: 43px;
    height: 43px;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
    border-radius: 6px;
    background: var(--color-tertiary);
    color: var(--color-secondary);
    font-family: var(--milan-cta-font);
    font-size: 0.8rem;
    font-weight: 900;
}

.milan-service-card h3 {
    margin-bottom: 12px;
    font-size: 1.12rem;
}

.milan-service-card p {
    margin-bottom: 0;
    font-size: 0.94rem;
}


/* =========================================================
   08. ASSET CATEGORIES
========================================================= */

.milan-service-category-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}

.milan-service-category {
    padding: clamp(25px, 3vw, 36px);
    border: 1px solid var(--milan-border);
    border-radius: 4px;
    background: var(--milan-white);
    transition:
        border-color 180ms ease,
        box-shadow 180ms ease;
}

.milan-service-category:hover {
    border-color: rgba(0, 53, 150, 0.35);
    box-shadow: 0 12px 30px rgba(0, 31, 85, 0.06);
}

.milan-service-category__heading {
    display: flex;
    align-items: center;
    gap: 17px;
    margin-bottom: 17px;
}

.milan-service-category__index {
    display: grid;
    width: 45px;
    height: 45px;
    flex: 0 0 45px;
    place-items: center;
    border-radius: 6px;
    background: var(--milan-blue);
    color: var(--milan-white);
    font-size: 0.82rem;
    font-weight: 800;
}

.milan-service-category__heading h3 {
    margin: 0;
}

.milan-service-category p {
    margin-bottom: 20px;
}

.milan-service-category ul {
    display: grid;
    gap: 10px;
    padding-top: 17px;
    border-top: 1px solid var(--milan-border);
}

.milan-service-category ul li {
    position: relative;
    padding-left: 20px;
    color: var(--milan-muted);
    font-size: 0.9rem;
    text-align: left;
}

.milan-service-category ul li::before {
    position: absolute;
    top: 0.65em;
    left: 0;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--milan-burgundy);
    content: "";
}


.milan-service-section-note{

  background: none;
  border:none;


}

/* =========================================================
   09. PROCESS
========================================================= */

.milan-service-process__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 45px;
}

.milan-service-process-step {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    align-items: start;
    gap: 20px;
    padding: 28px 0;
    border-bottom: 1px solid var(--milan-border);
}

.milan-service-process-step__number {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid var(--color-tertiary);
    border-radius: 50%;
    background: none;
    color: var(--milan-blue);
    font-size: 0.85rem;
    font-weight: 900;
}

.milan-service-process-step h3 {
    margin-bottom: 10px;
}

.milan-service-process-step p {
    margin-bottom: 0;
    font-size: 0.93rem;
}


/* =========================================================
   10. CONSIDERATIONS
========================================================= */

.milan-service-considerations__layout {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(290px, 0.8fr);
    align-items: start;
    gap: clamp(30px, 5vw, 65px);
}

.milan-service-considerations__content p:last-child {
    margin-bottom: 0;
}

.milan-service-check-panel {
    padding: 32px;
    border: none;
    background: none;
}


/* =========================================================
   11. COVERAGE
========================================================= */

.milan-service-coverage__content {
    max-width: 950px;
    margin-inline: auto;
}

.milan-service-coverage__callout {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    margin-top: 36px;
    padding: 30px;
    border: none;
    
    
    background: none;
}

.milan-service-coverage__callout h3 {
    margin-bottom: 8px;
}

.milan-service-coverage__callout p {
    margin-bottom: 0;
}


/* =========================================================
   12. BENEFITS
========================================================= */

.milan-service-benefit-card {
    padding: 30px;
}

.milan-service-benefit-card__symbol {
    display: inline-flex;
    min-width: 42px;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    
    color: var(--milan-blue);
    font-family: var(--milan-heading-font);
    font-size: 1.2rem;
    font-weight: 900;
}


/* =========================================================
   13. LEGAL SECTION
========================================================= */

.milan-service-legal__layout {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(290px, 0.7fr);
    align-items: start;
    gap: clamp(32px, 5vw, 65px);
}

.milan-service-legal__content p:last-child {
    margin-bottom: 0;
}

.milan-service-legal-panel {
    padding: 32px;
    border: none;
    background: none;
}

.milan-service-legal-panel__note {
    margin: 25px 0 0 !important;
    padding-top: 18px;
    border-top: 1px solid var(--milan-border);
    font-size: 0.86rem;
}


/* =========================================================
   14. RELATED SERVICES
========================================================= */

.milan-service-related__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.milan-service-related-card {
    display: flex;
    min-width: 0;
    flex-direction: column;
    padding: 30px;
    border: 1px solid var(--milan-border);
    border-radius: var(--milan-card-radius);
    background: var(--milan-white);
    transition:
        transform 180ms ease,
        border-color 180ms ease,
        box-shadow 180ms ease;
}

.milan-service-related-card:hover {
    transform: translateY(-4px);
    border-color: rgba(0, 53, 150, 0.4);
    box-shadow: 0 12px 30px rgba(0, 31, 85, 0.07);
}

.milan-service-related-card__number {
    margin-bottom: 15px;
    color: var(--milan-burgundy);
    font-family: var(--milan-cta-font);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.1em;
}

.milan-service-related-card h3 {
    margin-bottom: 12px;
}

.milan-service-related-card p {
    margin-bottom: 22px;
    font-size: 0.93rem;
}

.milan-service-related-card__link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: auto;
    color: var(--milan-blue);
    font-size: 0.88rem;
    font-weight: 800;
}

.milan-service-related-card__link span {
    color: var(--milan-burgundy);
    transition: transform 180ms ease;
}

.milan-service-related-card:hover
.milan-service-related-card__link span {
    transform: translateX(5px);
}


/* =========================================================
   15. FAQ
========================================================= */

.milan-service-faq__list {
    max-width: 950px;
    margin-inline: auto;
    border-top: 1px solid var(--milan-border);
}

.milan-service-faq-item {
    border-bottom: 1px solid var(--milan-border);
}

.milan-service-faq-item h3 {
    margin: 0;
}

.milan-service-faq-question {
    display: flex;
    width: 100%;
    min-height: 75px;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 20px 5px;
    border: 0;
    background: transparent;
    color: var(--milan-blue);
    cursor: pointer;
    font-family: var(--font-body);
    font-size: 1rem;
    font-weight: 750;
    line-height: 1.5;
    text-align: left;
    transition: color 180ms ease;
}

.milan-service-faq-question:hover {
    color: var(--milan-burgundy);
}

.milan-service-faq-icon {
    position: relative;
    display: block;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    border: none;
}

.milan-service-faq-icon::before,
.milan-service-faq-icon::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 2px;
    background: var(--milan-blue);
    content: "";
    transform: translate(-50%, -50%);
    transition: transform 180ms ease;
}

.milan-service-faq-icon::after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.milan-service-faq-question[aria-expanded="true"]
.milan-service-faq-icon::after {
    transform: translate(-50%, -50%) rotate(0);
}

.milan-service-faq-answer {
    padding: 0 48px 22px 5px;
}

.milan-service-faq-answer p {
    max-width: 850px;
    margin: 0;
    font-size: 0.95rem;
    text-align: left;
}


/* =========================================================
   16. CONTACT CTA
========================================================= */

.milan-service-contact {
    padding: clamp(65px, 8vw, 95px) 0;
    background: var(--milan-blue);
}

.milan-service-contact__inner {
    display: flex;
    max-width: 900px;
    flex-direction: column;
    align-items: center;
    margin-inline: auto;
    text-align: center;
}

.milan-service-contact .milan-service-eyebrow {
    color: var(--milan-white) !important;
}

.milan-service-contact h2 {
    margin: 0 auto 20px;
    color: var(--milan-white);
    text-align: center;
    text-wrap: balance;
}

.milan-service-contact__inner > p:not(.milan-service-eyebrow) {
    max-width: 720px;
    margin: 0 auto 30px;
    color: rgba(255, 255, 255, 0.86);
    text-align: center;
}

.milan-service-contact__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 14px;
}

.milan-service-contact__email {
    display: inline-block;
    margin-top: 25px;
    color: var(--milan-white) !important;
    font-size: 0.93rem;
    font-weight: 700;
    text-decoration: underline !important;
    text-underline-offset: 4px;
}


/* =========================================================
   17. RESPONSIVE: TABLETS
========================================================= */

@media (max-width: 1024px) {

    .milan-service-card-grid--three {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .milan-service-overview__layout,
    .milan-service-considerations__layout,
    .milan-service-legal__layout {
        grid-template-columns: minmax(0, 1fr) minmax(260px, 0.85fr);
        gap: 30px;
    }

    .milan-service-hero {
        min-height: 650px;
    }

    .milan-service-process__grid {
        gap: 0 28px;
    }
}


/* =========================================================
   18. RESPONSIVE: MOBILE
========================================================= */

@media (max-width: 767px) {

    .milan-service-container {
        width: min(100% - 36px, var(--milan-container));
    }

    .milan-service-section {
        padding-block: 68px;
    }

    .milan-service-section__header {
        margin-bottom: 34px;
    }

    .milan-service-section__header h2 {
        font-size: clamp(1.7rem, 7vw, 2.3rem);
    }

    .milan-service-hero {
        min-height: 620px;
        padding: 85px 0;
        background-position: center;
    }

    .milan-service-hero h1 {
        font-size: clamp(2.15rem, 9vw, 3.2rem);
    }

    .milan-service-hero__description {
        font-size: 0.98rem;
    }

    .milan-service-hero__trust-list {
        flex-direction: column;
        align-items: center;
        gap: 11px;
        margin-top: 32px !important;
    }

    .milan-service-hero__actions {
        width: 100%;
        flex-direction: column;
    }

    .milan-service-hero__actions .milan-service-button {
        width: min(100%, 340px);
    }

    .milan-service-overview__layout,
    .milan-service-considerations__layout,
    .milan-service-legal__layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 30px;
    }

    .milan-service-card-grid--three,
    .milan-service-category-grid,
    .milan-service-process__grid,
    .milan-service-related__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .milan-service-card,
    .milan-service-category,
    .milan-service-info-panel,
    .milan-service-check-panel,
    .milan-service-legal-panel,
    .milan-service-related-card {
        padding: 25px;
    }

    .milan-service-process-step {
        grid-template-columns: 46px minmax(0, 1fr);
        gap: 15px;
        padding: 23px 0;
    }

    .milan-service-process-step__number {
        width: 42px;
        height: 42px;
    }

    .milan-service-coverage__callout {
        align-items: flex-start;
        flex-direction: column;
        padding: 25px;
    }

    .milan-service-coverage__callout .milan-service-button {
        width: 100%;
    }

    .milan-service-faq-question {
        min-height: 70px;
        gap: 15px;
        padding: 18px 2px;
        font-size: 0.94rem;
    }

    .milan-service-faq-answer {
        padding: 0 5px 20px;
    }

    .milan-service-contact {
        padding-block: 68px;
    }

    .milan-service-contact__actions {
        width: 100%;
        flex-direction: column;
        align-items: center;
    }

    .milan-service-contact__actions .milan-service-button {
        width: min(100%, 340px);
    }
}


/* =========================================================
   19. RESPONSIVE: SMALL MOBILE
========================================================= */

@media (max-width: 420px) {

    .milan-service-container {
        width: calc(100% - 30px);
    }

    .milan-service-breadcrumb li {
        font-size: 0.75rem;
    }

    .milan-service-hero {
        min-height: 600px;
    }

    .milan-service-hero h1 {
        font-size: 2rem;
    }

    .milan-service-eyebrow {
        font-size: 0.69rem;
        letter-spacing: 0.12em;
    }

    .milan-service-card,
    .milan-service-category,
    .milan-service-info-panel,
    .milan-service-check-panel,
    .milan-service-legal-panel,
    .milan-service-related-card {
        padding: 22px;
    }

    .milan-service-category__heading {
        align-items: flex-start;
        gap: 13px;
    }

    .milan-service-category__heading h3 {
        font-size: 1.03rem;
    }
}


/* =========================================================
   20. REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .milan-service-page *,
    .milan-service-page *::before,
    .milan-service-page *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}































/* =========================================================
   MILAN AUCTIONEERS
   FREQUENTLY ASKED QUESTIONS PAGE
   Brand colours and typography from root.css
========================================================= */


/* =========================================================
   01. BASE STYLES
========================================================= */

.milan-faq-page {
    width: 100%;
    overflow-x: clip;
    background: var(--secondary-bg-color);
    color: var(--color-primary);
    font-family: var(--font-body);
}

.milan-faq-page *,
.milan-faq-page *::before,
.milan-faq-page *::after {
    box-sizing: border-box;
}

.milan-faq-container {
    width: min(1180px, 90%);
    margin-inline: auto;
}

.milan-faq-page h1,
.milan-faq-page h2,
.milan-faq-page h3 {
    margin-top: 0;
    font-family: var(--font-heading);
    text-align: center;
    line-height: 1.2;
}

.milan-faq-page p {
    font-family: var(--font-body);
    line-height: 1.85;
}

.milan-faq-eyebrow {
    display: block;
    margin-bottom: 15px;
    color: var(--color-tertiary);
    font-family: var(--font-cta);
    font-size: var(--font-size-small);
    font-weight: 800;
    letter-spacing: 0.14em;
    text-align: center;
    text-transform: uppercase;
}


/* =========================================================
   02. BUTTONS
========================================================= */

.milan-faq-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: var(--cta-padding-y) var(--cta-padding-x);
    border: 1px solid transparent;
    border-radius: 4px;
    font-family: var(--font-cta);
    font-size: var(--font-size-small);
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    transition:
        background var(--transition-timing) ease,
        color var(--transition-timing) ease,
        border-color var(--transition-timing) ease,
        transform var(--transition-timing) ease;
}

.milan-faq-button:hover {
    transform: translateY(-2px);
}

.milan-faq-button-light {
    background: var(--cta-secondary-bg-color);
    border-color: var(--color-secondary);
    color: var(--cta-primary-font-color);
}

.milan-faq-button-light:hover {
    background: transparent;
    color: var(--secondary-font-color);
}

.milan-faq-button-outline {
    background: transparent;
    border-color: rgba(255, 255, 255, 0.75);
    color: var(--secondary-font-color);
}

.milan-faq-button-outline:hover {
    background: var(--secondary-bg-color);
    border-color: var(--secondary-bg-color);
    color: var(--color-primary);
}


/* =========================================================
   03. HERO SECTION
========================================================= */

.milan-faq-hero {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 480px;
    padding: 100px 0;
    background: var(--primary-bg-color);
    color: var(--secondary-font-color);
}

.milan-faq-hero-content {
    max-width: 900px;
    margin-inline: auto;
    text-align: center;
}

.milan-faq-hero .milan-faq-eyebrow {
    color: var(--secondary-font-color);
    opacity: 0.85;
}

.milan-faq-hero h1 {
    max-width: 850px;
    margin: 0 auto 25px;
    color: var(--secondary-font-color);
    font-size: clamp(2.6rem, 6vw, 4.6rem);
    font-weight: 800;
    letter-spacing: -0.045em;
}

.milan-faq-hero p {
    max-width: 780px;
    margin: 0 auto;
    color: rgba(255, 255, 255, 0.88);
    font-size: var(--font-size-large);
}

.milan-faq-hero-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 35px;
}


/* =========================================================
   04. INTRODUCTION
========================================================= */

.milan-faq-intro {
    padding: 90px 0 75px;
    background: var(--secondary-bg-color);
    text-align: center;
}

.milan-faq-intro h2 {
    max-width: 850px;
    margin: 0 auto 25px;
    color: var(--color-primary);
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
    letter-spacing: -0.035em;
}

.milan-faq-intro p {
    max-width: 850px;
    margin: 0 auto 16px;
    color: #666666;
    font-size: var(--font-size-medium);
}

.milan-faq-intro p:last-child {
    margin-bottom: 0;
}


/* =========================================================
   05. CATEGORY NAVIGATION
========================================================= */

.milan-faq-navigation {
    padding: 65px 0;
    background: #f5f7fb;
    text-align: center;
}

.milan-faq-navigation h2 {
    margin: 0 auto 30px;
    color: var(--color-primary);
    font-size: clamp(1.9rem, 3.5vw, 2.6rem);
    font-weight: 800;
}

.milan-faq-category-links {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    max-width: 1000px;
    margin-inline: auto;
}

.milan-faq-category-links a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 11px 18px;
    background: var(--secondary-bg-color);
    border: 1px solid rgba(0, 53, 150, 0.15);
    border-radius: 4px;
    color: var(--color-primary);
    font-family: var(--font-cta);
    font-size: var(--font-size-small);
    font-weight: 700;
    text-decoration: none;
    transition:
        background var(--transition-timing) ease,
        color var(--transition-timing) ease,
        border-color var(--transition-timing) ease;
}

.milan-faq-category-links a:hover {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--secondary-font-color);
}


/* =========================================================
   06. FAQ CONTENT WRAPPER
========================================================= */

.milan-faq-content {
    padding: 45px 0 100px;
    background: var(--secondary-bg-color);
}

.milan-faq-category {
    padding: 80px 0;
    border-bottom: 1px solid rgba(0, 53, 150, 0.13);
    scroll-margin-top: 40px;
}

.milan-faq-category:last-child {
    border-bottom: none;
}


/* =========================================================
   07. CATEGORY HEADINGS
========================================================= */

.milan-faq-category-heading {
    max-width: 850px;
    margin: 0 auto 45px;
    text-align: center;
}

.milan-faq-category-number {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 55px;
    height: 55px;
    margin: 0 auto 22px;
    background: var(--primary-bg-color);
    border-radius: 4px;
    color: var(--secondary-font-color);
    font-family: var(--font-cta);
    font-size: var(--font-size-medium);
    font-weight: 800;
}

.milan-faq-category-heading h2 {
    margin: 0 auto 18px;
    color: var(--color-primary);
    font-size: clamp(2rem, 4vw, 2.8rem);
    font-weight: 800;
    letter-spacing: -0.035em;
}

.milan-faq-category-heading p {
    max-width: 700px;
    margin: 0 auto;
    color: #707070;
    font-size: var(--font-size-medium);
}


/* =========================================================
   08. FAQ LIST
========================================================= */

.milan-faq-list {
    display: flex;
    flex-direction: column;
    gap: 13px;
    max-width: 1000px;
    margin-inline: auto;
}


/* =========================================================
   09. FAQ ACCORDION
========================================================= */

.milan-faq-item {
    width: 100%;
    background: var(--secondary-bg-color);
    border: 1px solid rgba(0, 53, 150, 0.15);
   border-radius: 8px;
    transition:
        border-color var(--transition-timing) ease,
        box-shadow var(--transition-timing) ease;
}

.milan-faq-item:hover {
    border-color: var(--color-primary);
}

.milan-faq-item[open] {
    border-color: var(--color-primary);
    box-shadow: 0 8px 28px rgba(0, 53, 150, 0.07);
}


/* QUESTION */

.milan-faq-item summary {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    padding: 23px 26px;
    color: var(--color-primary);
    font-family: var(--font-body);
    font-size: var(--font-size-medium);
    font-weight: 750;
    line-height: 1.55;
    list-style: none;
    cursor: pointer;
}

.milan-faq-item summary::-webkit-details-marker {
    display: none;
}

.milan-faq-item summary::after {
    content: "+";
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    background: rgba(0, 53, 150, 0.06);
    border-radius: 4px;
    border: 1px solid rgba(0, 53, 150, 0.16);
    color: var(--color-primary);
    font-family: var(--font-body);
    font-size: 1.35rem;
    font-weight: 400;
    line-height: 1;
    transition:
        background var(--transition-timing) ease,
        color var(--transition-timing) ease,
        transform var(--transition-timing) ease;
}

.milan-faq-item[open] summary::after {
    content: "−";
    background: var(--color-tertiary);
    border-color: var(--color-tertiary);
    color: var(--secondary-font-color);
}

.milan-faq-item summary:focus-visible {
    outline: 3px solid var(--color-tertiary);
    outline-offset: 4px;
}


/* ANSWER */

.milan-faq-answer {
    padding: 0 26px 25px;
    animation: milan-faq-reveal 0.25s ease;
}

.milan-faq-answer p {
    margin: 0 0 13px;
    color: #626262;
    font-size: var(--font-size-medium);
    line-height: 1.85;
    text-align: left;
}

.milan-faq-answer p:last-child {
    margin-bottom: 0;
}

.milan-faq-answer a {
    color: var(--color-primary);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.milan-faq-answer a:hover {
    color: var(--color-tertiary);
}


/* ACCORDION ANIMATION */

@keyframes milan-faq-reveal {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* =========================================================
   10. CONTACT CTA
========================================================= */

.milan-faq-cta {
    padding: 95px 0;
    background: var(--tertiary-bg-color);
    color: var(--secondary-font-color);
    text-align: center;
}

.milan-faq-cta-content {
    max-width: 850px;
    margin-inline: auto;
}

.milan-faq-cta .milan-faq-eyebrow {
    color: var(--secondary-font-color);
    opacity: 0.85;
}

.milan-faq-cta h2 {
    max-width: 800px;
    margin: 0 auto 22px;
    color: var(--secondary-font-color);
    font-size: clamp(2rem, 4.5vw, 3.3rem);
    font-weight: 800;
    letter-spacing: -0.035em;
}

.milan-faq-cta p {
    max-width: 720px;
    margin: 0 auto;
    color: rgba(255, 255, 255, 0.87);
    font-size: var(--font-size-medium);
}

.milan-faq-cta-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 32px;
}


/* =========================================================
   11. CONTACT DETAILS
========================================================= */

.milan-faq-contact {
    padding: 90px 0;
    background: #f5f7fb;
    text-align: center;
}

.milan-faq-contact h2 {
    max-width: 800px;
    margin: 0 auto 20px;
    color: var(--color-primary);
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
    letter-spacing: -0.035em;
}

.milan-faq-contact-intro {
    max-width: 700px;
    margin: 0 auto 45px;
    color: #666666;
    font-size: var(--font-size-medium);
}

.milan-faq-contact-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    text-align: left;
}

.milan-faq-contact-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 12px;
    min-height: 175px;
    padding: 30px;
    background: var(--secondary-bg-color);
    border: 1px solid rgba(0, 53, 150, 0.12);
    border-top: 4px solid var(--color-primary);
}

.milan-faq-contact-label {
    display: block;
    margin-bottom: 5px;
    color: var(--color-tertiary);
    font-family: var(--font-cta);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.12em;
}

.milan-faq-contact-card a {
    color: var(--color-primary);
    font-family: var(--font-body);
    font-size: var(--font-size-medium);
    font-weight: 700;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.milan-faq-contact-card a:hover {
    color: var(--color-tertiary);
    text-decoration: underline;
    text-underline-offset: 4px;
}

.milan-faq-contact-card p {
    margin: 0;
    color: #626262;
    font-size: var(--font-size-medium);
    line-height: 1.75;
}


/* =========================================================
   12. TABLET RESPONSIVENESS
========================================================= */

@media (max-width: 900px) {

    .milan-faq-hero {
        min-height: auto;
        padding: 90px 0;
    }

    .milan-faq-category {
        padding: 65px 0;
    }

    .milan-faq-contact-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}


/* =========================================================
   13. MOBILE RESPONSIVENESS
========================================================= */

@media (max-width: 600px) {

    .milan-faq-container {
        width: min(100% - 36px, 1180px);
    }

    .milan-faq-hero {
        padding: 75px 0;
    }

    .milan-faq-hero h1 {
        font-size: clamp(2.3rem, 10vw, 3rem);
    }

    .milan-faq-hero p {
        font-size: var(--font-size-medium);
    }

    .milan-faq-hero-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .milan-faq-hero-actions .milan-faq-button {
        width: 100%;
    }

    .milan-faq-intro {
        padding: 65px 0;
    }

    .milan-faq-intro h2 {
        font-size: 2rem;
    }

    .milan-faq-navigation {
        padding: 55px 0;
    }

    .milan-faq-category-links {
        display: grid;
        grid-template-columns: 1fr;
    }

    .milan-faq-category-links a {
        width: 100%;
    }

    .milan-faq-content {
        padding: 20px 0 65px;
    }

    .milan-faq-category {
        padding: 55px 0;
    }

    .milan-faq-category-number {
        width: 48px;
        height: 48px;
        margin-bottom: 18px;
    }

    .milan-faq-category-heading h2 {
        font-size: 1.9rem;
    }

    .milan-faq-category-heading p {
        font-size: 0.94rem;
    }

    .milan-faq-item summary {
        gap: 14px;
        padding: 19px 16px;
        font-size: 0.94rem;
    }

    .milan-faq-item summary::after {
        flex-basis: 28px;
        width: 28px;
        height: 28px;
        font-size: 1.2rem;
    }

    .milan-faq-answer {
        padding: 0 16px 20px;
    }

    .milan-faq-answer p {
        font-size: 0.94rem;
    }

    .milan-faq-cta {
        padding: 70px 0;
    }

    .milan-faq-cta h2 {
        font-size: 2rem;
    }

    .milan-faq-cta-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .milan-faq-cta-actions .milan-faq-button {
        width: 100%;
    }

    .milan-faq-contact {
        padding: 70px 0;
    }

    .milan-faq-contact h2 {
        font-size: 2rem;
    }

    .milan-faq-contact-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .milan-faq-contact-card {
        min-height: auto;
        padding: 25px;
    }

}


/* =========================================================
   14. REDUCED MOTION ACCESSIBILITY
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .milan-faq-page *,
    .milan-faq-page *::before,
    .milan-faq-page *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

}













































/* =========================================================
   MILAN AUCTIONEERS — SHARED SERVICE AREA PAGE
   Applies to all individual county / area pages.
   Uses existing global root variables. Do not redefine roots.
========================================================= */


/* ==================== BASE ==================== */

.milan-service-area,
.milan-service-area * {
  box-sizing: border-box;
}

.milan-service-area {
  width: 100%;
  overflow: clip;
  background: var(--secondary-bg-color);
  color: var(--primary-font-color);
  font-family: var(--font-body);
  font-size: var(--font-size-medium);
  line-height: 1.75;
}

.milan-service-area a {
  color: inherit;
  text-decoration: none;
}

.milan-service-area button,
.milan-service-area a {
  -webkit-tap-highlight-color: transparent;
}

.milan-service-area button {
  font: inherit;
}

.milan-service-area p {
  margin: 0 0 1.15rem;
}

.milan-service-area p:last-child {
  margin-bottom: 0;
}

.milan-service-area h1,
.milan-service-area h2,
.milan-service-area h3 {
  margin-top: 0;
  color: var(--primary-font-color);
  font-family: var(--font-heading);
  line-height: 1.2;
}

.milan-service-area h1,
.milan-service-area h2 {
  text-align: center;
}

.milan-service-area__container {
  width: min(1180px, calc(100% - 48px));
  margin-inline: auto;
}


/* ==================== BREADCRUMB ==================== */

.milan-service-area__breadcrumb {
  padding: 18px 0;
  background: var(--secondary-bg-color);
  border-bottom: 1px solid rgba(0, 53, 150, 0.09);
}

.milan-service-area__breadcrumb-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
  color: rgba(0, 53, 150, 0.65);
  font-size: var(--font-size-small);
}

.milan-service-area__breadcrumb-item {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.milan-service-area__breadcrumb-item + .milan-service-area__breadcrumb-item::before {
  content: "/";
  color: var(--color-tertiary);
}

.milan-service-area__breadcrumb-link {
  transition: color var(--transition-timing) ease;
}

.milan-service-area__breadcrumb-link:hover {
  color: var(--color-tertiary);
}


/* ==================== SHARED SECTION HEADING ==================== */

.milan-service-area__section {
  padding: 92px 0;
  background: var(--secondary-bg-color);
}

.milan-service-area__section-heading {
  width: min(850px, 100%);
  margin: 0 auto 48px;
  text-align: center;
}

.milan-service-area__eyebrow {
  display: block;
  margin-bottom: 15px;
  color: var(--color-tertiary);
  font-family: var(--font-cta);
  font-size: var(--font-size-small);
  font-weight: 700;
  letter-spacing: 0.13em;
  line-height: 1.5;
  text-align: center;
  text-transform: uppercase;
}

.milan-service-area__section-title {
  max-width: 820px;
  margin: 0 auto 18px;
  font-size: clamp(1.8rem, 3.5vw, 2.65rem);
  font-weight: 750;
  text-align: center;
}

.milan-service-area__section-description {
  max-width: 760px;
  margin: 0 auto;
  color: rgba(0, 53, 150, 0.76);
  font-size: var(--font-size-medium);
  line-height: 1.85;
  text-align: center;
}


/* ==================== HERO ==================== */

.milan-service-area__hero {
  position: relative;
  padding: 105px 0 100px;
  background: var(--secondary-bg-color);
}

.milan-service-area__hero-content {
  max-width: 920px;
  margin: 0 auto;
  text-align: center;
}

.milan-service-area__hero-title {
  max-width: 850px;
  margin: 0 auto 25px;
  color: var(--primary-font-color);
  font-size: clamp(2.5rem, 6vw, 4.5rem);
  font-weight: 800;
  letter-spacing: -0.045em;
  line-height: 1.08;
  text-align: center;
}

.milan-service-area__hero-description {
  max-width: 790px;
  margin: 0 auto;
  color: rgba(0, 53, 150, 0.78);
  font-size: clamp(1rem, 1.5vw, 1.15rem);
  line-height: 1.9;
  text-align: center;
}

.milan-service-area__hero-actions,
.milan-service-area__cta-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 15px;
  margin-top: 34px;
}


/* ==================== BUTTONS ==================== */

.milan-service-area__button {
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  padding: var(--cta-padding-y) var(--cta-padding-x);
  border: 1px solid transparent;
  border-radius: 4px;
  cursor: pointer;
  font-family: var(--font-cta);
  font-size: var(--font-size-small);
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  transition:
    background var(--transition-timing) ease,
    color var(--transition-timing) ease,
    border-color var(--transition-timing) ease,
    transform var(--transition-timing) ease;
}

.milan-service-area__button:hover {
  transform: translateY(-2px);
}

.milan-service-area__button:focus-visible,
.milan-service-area__breadcrumb-link:focus-visible,
.milan-service-area__faq-trigger:focus-visible {
  outline: 3px solid var(--color-tertiary);
  outline-offset: 4px;
}

.milan-service-area__button--primary {
  background: var(--cta-primary-bg-color);
  color: var(--cta-secondary-font-color)!important;
}

.milan-service-area__button--primary:hover {
  background: var(--tertiary-bg-color);
  color: var(--cta-secondary-font-color);
}

.milan-service-area__button--outline {
  border-color: var(--border-primary-color);
  background: transparent;
  color: var(--cta-primary-font-color);
}

.milan-service-area__button--outline:hover {
  background: var(--primary-bg-color);
  color: var(--cta-secondary-font-color);
}

.milan-service-area__button--light {
  background: var(--secondary-bg-color);
  color: var(--color-primary);
}

.milan-service-area__button--light:hover {
  background: var(--tertiary-bg-color);
  color: var(--secondary-font-color);
}

.milan-service-area__button--cta-outline {
  border-color: rgba(255, 255, 255, 0.8);
  background: transparent;
  color: var(--secondary-font-color);
}

.milan-service-area__button--cta-outline:hover {
  background: var(--secondary-bg-color);
  color: var(--primary-font-color);
}


/* ==================== INTRODUCTION ==================== */

.milan-service-area__introduction {
  padding-top: 75px;
  padding-bottom: 85px;
}

.milan-service-area__prose {
  max-width: 900px;
  margin: 0 auto;
  color: rgba(0, 53, 150, 0.82);
  line-height: 1.95;
  text-align: left;
}

.milan-service-area__prose p {
  margin-bottom: 20px;
}


/* ==================== LOCAL COVERAGE ==================== */

.milan-service-area__coverage {
  border-top: 1px solid rgba(0, 53, 150, 0.08);
  border-bottom: 1px solid rgba(0, 53, 150, 0.08);
}

.milan-service-area__coverage-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

.milan-service-area__coverage-item {
  min-width: 0;
  padding: 28px 30px;
  
  
  background: var(--secondary-bg-color);
}

.milan-service-area__coverage-title {
  margin-bottom: 12px;
  font-size: 1.12rem;
  font-weight: 750;
}

.milan-service-area__coverage-description {
  color: rgba(0, 53, 150, 0.76);
  line-height: 1.8;
}

.milan-service-area__coverage-note {
  max-width: 900px;
  margin: 28px auto 0;
  color: rgba(0, 53, 150, 0.65);
  font-size: var(--font-size-small);
  line-height: 1.8;
  text-align: center;
}


/* ==================== SERVICES ==================== */

.milan-service-area__service-list {
  max-width: 980px;
  margin: 0 auto;
  border-top: 1px solid rgba(0, 53, 150, 0.15);
}

.milan-service-area__service-item {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 25px;
  padding: 30px 5px;
  border-bottom: 1px solid rgba(0, 53, 150, 0.15);
}

.milan-service-area__service-number {
  color: var(--color-tertiary);
  font-family: var(--font-heading);
  font-size: 1.65rem;
  font-weight: 800;
  line-height: 1.3;
}

.milan-service-area__service-title {
  margin-bottom: 10px;
  font-size: 1.25rem;
  font-weight: 750;
}

.milan-service-area__service-description {
  max-width: 820px;
  color: rgba(0, 53, 150, 0.78);
  line-height: 1.85;
}


/* ==================== ASSET CATEGORIES ==================== */

.milan-service-area__assets {
  border-top: 1px solid rgba(0, 53, 150, 0.08);
}

.milan-service-area__asset-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.milan-service-area__asset-item {
  padding: 27px 28px;
  border: 1px solid rgba(0, 53, 150, 0.13);
  background: var(--secondary-bg-color);
}

.milan-service-area__asset-title {
  margin-bottom: 10px;
  font-size: 1.12rem;
  font-weight: 750;
}

.milan-service-area__asset-description {
  color: rgba(0, 53, 150, 0.76);
  line-height: 1.8;
}


/* ==================== JURISDICTION ==================== */

.milan-service-area__jurisdiction {
  border-top: 1px solid rgba(0, 53, 150, 0.08);
  border-bottom: 1px solid rgba(0, 53, 150, 0.08);
}

.milan-service-area__jurisdiction-panel {
  max-width: 900px;
  margin: 35px auto 0;
  padding: 30px;
  
  
  background: none;
}

.milan-service-area__jurisdiction-title {
  margin-bottom: 15px;
  font-size: 1.15rem;
}

.milan-service-area__jurisdiction-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding-left: 22px;
  color: rgba(0, 53, 150, 0.8);
}

.milan-service-area__jurisdiction-list li::marker {
  color: var(--color-tertiary);
}


/* ==================== CLIENT SECTORS ==================== */

.milan-service-area__sector-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.milan-service-area__sector-item {
  padding: 28px;
  border: none;
  background: var(--secondary-bg-color);
}

.milan-service-area__sector-title {
  margin-bottom: 10px;
  font-size: 1.12rem;
  font-weight: 750;
}

.milan-service-area__sector-description {
  color: rgba(0, 53, 150, 0.76);
  line-height: 1.8;
}


/* ==================== ENGAGEMENT PROCESS ==================== */

.milan-service-area__process-list {
  max-width: 950px;
  margin: 0 auto;
  border-top: 1px solid rgba(0, 53, 150, 0.14);
}

.milan-service-area__process-item {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr);
  gap: 24px;
  padding: 26px 5px;
  border-bottom: 1px solid rgba(0, 53, 150, 0.14);
}

.milan-service-area__process-number {
  display: flex;
  width: 48px;
  height: 48px;
  align-items: center;
  justify-content: center;
  border: none;
  color: var(--color-tertiary);
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 800;
}

.milan-service-area__process-title {
  margin-bottom: 9px;
  font-size: 1.15rem;
  font-weight: 750;
}

.milan-service-area__process-description {
  color: rgba(0, 53, 150, 0.76);
  line-height: 1.8;
}


/* ==================== COMPANY CREDENTIALS ==================== */

.milan-service-area__credentials {
  border-top: 1px solid rgba(0, 53, 150, 0.08);
  border-bottom: 1px solid rgba(0, 53, 150, 0.08);
}


/* ==================== FAQ ==================== */

.milan-service-area__faq-list {
  max-width: 920px;
  margin: 0 auto;
  border-top: 1px solid rgba(0, 53, 150, 0.16);
}

.milan-service-area__faq-item {
  border-bottom: 1px solid rgba(0, 53, 150, 0.16);
}

.milan-service-area__faq-question {
  margin: 0;
}

.milan-service-area__faq-trigger {
  display: flex;
  width: 100%;
  min-height: 76px;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 20px 4px;
  border: 0;
  background: transparent;
  color: var(--primary-font-color);
  cursor: pointer;
  font-family: var(--font-body);
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: left;
}

.milan-service-area__faq-icon {
  position: relative;
  display: block;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
}

.milan-service-area__faq-icon::before,
.milan-service-area__faq-icon::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 15px;
  height: 2px;
  background: var(--color-tertiary);
  content: "";
  transform: translate(-50%, -50%);
  transition: transform var(--transition-timing) ease;
}

.milan-service-area__faq-icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

.milan-service-area__faq-trigger[aria-expanded="true"] .milan-service-area__faq-icon::after {
  transform: translate(-50%, -50%) rotate(0deg);
}

.milan-service-area__faq-panel {
  padding: 0 42px 24px 4px;
  color: rgba(0, 53, 150, 0.78);
  line-height: 1.85;
}

.milan-service-area__faq-panel[hidden] {
  display: none;
}


/* ==================== FINAL CTA ==================== */

.milan-service-area__cta {
  padding: 85px 0;
  background: var(--primary-bg-color);
  color: var(--secondary-font-color);
}

.milan-service-area__cta-content {
  max-width: 850px;
  margin: 0 auto;
  text-align: center;
}

.milan-service-area__cta .milan-service-area__eyebrow {
  color: var(--secondary-font-color);
}

.milan-service-area__cta-title {
  max-width: 780px;
  margin: 0 auto 20px;
  color: var(--secondary-font-color)!important;
  font-size: clamp(1.9rem, 4vw, 2.8rem);
  font-weight: 800;
  text-align: center;
}

.milan-service-area__cta-description {
  max-width: 720px;
  margin: 0 auto;
  color: rgba(255, 255, 255, 0.88);
  line-height: 1.85;
  text-align: center;
}

.milan-service-area__button--light{
  color: var(--tertiary-font-color)!important;


}


/* ==================== RESPONSIVE: TABLET ==================== */

@media (max-width: 900px) {
  .milan-service-area__section {
    padding: 75px 0;
  }

  .milan-service-area__hero {
    padding: 85px 0;
  }

  .milan-service-area__coverage-grid,
  .milan-service-area__asset-grid,
  .milan-service-area__sector-grid {
    gap: 15px;
  }
}


/* ==================== RESPONSIVE: MOBILE ==================== */

@media (max-width: 640px) {
  .milan-service-area__container {
    width: min(100% - 36px, 1180px);
  }

  .milan-service-area__section {
    padding: 62px 0;
  }

  .milan-service-area__section-heading {
    margin-bottom: 34px;
  }

  .milan-service-area__eyebrow {
    margin-bottom: 12px;
    font-size: 0.78rem;
    letter-spacing: 0.1em;
  }

  .milan-service-area__section-title {
    font-size: clamp(1.65rem, 7vw, 2.15rem);
  }

  .milan-service-area__section-description {
    font-size: 0.95rem;
  }

  .milan-service-area__hero {
    padding: 72px 0 68px;
  }

  .milan-service-area__hero-title {
    margin-bottom: 20px;
    font-size: clamp(2.25rem, 10vw, 3.2rem);
  }

  .milan-service-area__hero-description {
    font-size: 0.98rem;
    line-height: 1.8;
  }

  .milan-service-area__hero-actions,
  .milan-service-area__cta-actions {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }

  .milan-service-area__button {
    width: 100%;
  }

  .milan-service-area__coverage-grid,
  .milan-service-area__asset-grid,
  .milan-service-area__sector-grid {
    grid-template-columns: 1fr;
  }

  .milan-service-area__coverage-item,
  .milan-service-area__asset-item,
  .milan-service-area__sector-item {
    padding: 23px;
  }

  .milan-service-area__service-item {
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 14px;
    padding: 25px 0;
  }

  .milan-service-area__service-number {
    font-size: 1.3rem;
  }

  .milan-service-area__service-title {
    font-size: 1.1rem;
  }

  .milan-service-area__process-item {
    grid-template-columns: 45px minmax(0, 1fr);
    gap: 14px;
    padding: 23px 0;
  }

  .milan-service-area__process-number {
    width: 38px;
    height: 38px;
    font-size: 0.9rem;
  }

  .milan-service-area__jurisdiction-panel {
    padding: 23px;
  }

  .milan-service-area__faq-trigger {
    min-height: 70px;
    gap: 15px;
    padding: 18px 0;
    font-size: 0.98rem;
  }

  .milan-service-area__faq-panel {
    padding: 0 30px 20px 0;
    font-size: 0.95rem;
  }

  .milan-service-area__cta {
    padding: 65px 0;
  }
}


/* ==================== REDUCED MOTION ==================== */

@media (prefers-reduced-motion: reduce) {
  .milan-service-area *,
  .milan-service-area *::before,
  .milan-service-area *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

































/* ============================================================
   PAGE HEADING — centered eyebrow + centered title
   ============================================================ */

.tos-hero {
  background: var(--secondary-bg-color);
  padding: 88px 24px 40px;
  text-align: center;
}

.tos-hero::after {
  content: "";
  display: block;
  width: 72px;
  height: 3px;
  margin: 48px auto 0;
  border-radius: 999px;
  background: var(--tertiary-bg-color);
}

.tos-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 18px;
  font-family: var(--font-cta);
  font-size: var(--font-size-small);
  font-weight: 700;
  letter-spacing: 0.18em;
  line-height: 1;
  text-transform: uppercase;
  color: var(--tertiary-font-color);
}

.tos-eyebrow::before,
.tos-eyebrow::after {
  content: "";
  width: 30px;
  height: 2px;
  border-radius: 999px;
  background: var(--tertiary-bg-color);
}

.tos-title {
  max-width: 22ch;
  margin: 0 auto 18px;
  font-family: var(--font-heading);
  font-size: var(--font-size-special);
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.015em;
  color: var(--primary-font-color);
}

.tos-lead {
  max-width: 62ch;
  margin: 0 auto;
  font-size: var(--font-size-large);
  line-height: 1.65;
  color: var(--primary-font-color);
}

.tos-meta {
  margin: 24px 0 0;
  font-family: var(--font-cta);
  font-size: var(--font-size-small);
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--tertiary-font-color);
}


/* ============================================================
   MAIN CONTENT
   ============================================================ */

.tos-main {
  max-width: 920px;
  margin: 0 auto;
  padding: 48px 24px 88px;
}

.tos-intro {
  max-width: 72ch;
  margin: 0 auto 40px;
  text-align: center;
  font-size: var(--font-size-medium);
  line-height: 1.8;
  color: var(--primary-font-color);
}


/* ============================================================
   TERMS LIST
   ============================================================ */

.tos-list {
  list-style: none;
  counter-reset: terms;
  padding: 0;
  margin: 0;
}

.tos-item {
  counter-increment: terms;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 24px;
  align-items: start;
  padding: 24px;
  margin-bottom: 16px;
  background: var(--secondary-bg-color);
  border: 1px solid rgba(0, 53, 150, 0.12);
  border-radius: 12px;
  transition:
    border-color var(--transition-timing) ease,
    box-shadow var(--transition-timing) ease,
    transform var(--transition-timing) ease;
}

.tos-item:hover {
  border-color: rgba(0, 53, 150, 0.34);
  box-shadow: 0 18px 34px -24px rgba(0, 53, 150, 0.6);
  transform: translateY(-2px);
}

.tos-item::before {
  content: counter(terms, decimal-leading-zero);
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border: 1px solid var(--border-tertiary-color);
  border-radius: 50%;
  font-family: var(--font-heading);
  font-size: var(--font-size-small);
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.02em;
  color: var(--tertiary-font-color);
}

.tos-item__body {
  min-width: 0;
}

.tos-item__title {
  margin: 0 0 8px;
  font-family: var(--font-heading);
  font-size: var(--font-size-large);
  font-weight: 700;
  line-height: 1.35;
  color: var(--primary-font-color);
}

.tos-item__text {
  max-width: 68ch;
  font-size: var(--font-size-medium);
  line-height: 1.75;
  color: var(--primary-font-color);
}

.tos-item__text strong {
  font-weight: 600;
}


/* ============================================================
   CLOSING CTA
   ============================================================ */

.tos-cta {
  margin-top: 56px;
  padding: 40px 24px;
  text-align: center;
  border: 1px solid rgba(0, 53, 150, 0.12);
  border-radius: 12px;
}

.tos-cta__title {
  margin: 0 0 8px;
  font-family: var(--font-heading);
  font-size: var(--font-size-xlarge);
  font-weight: 700;
  line-height: 1.3;
  color: var(--primary-font-color);
}

.tos-cta__text {
  max-width: 56ch;
  margin: 0 auto 24px;
  font-size: var(--font-size-medium);
  color: var(--primary-font-color);
}

.tos-cta__btn {
  display: inline-block;
  padding: var(--cta-padding-y) var(--cta-padding-x);
  font-family: var(--font-cta);
  font-size: var(--font-size-medium);
  font-weight: 700;
  letter-spacing: 0.02em;
  text-decoration: none;
  color: var(--cta-secondary-font-color);
  background: var(--cta-primary-bg-color);
  border: 1px solid transparent;
  border-radius: 999px;
  transition:
    background var(--transition-timing) ease,
    transform var(--transition-timing) ease,
    box-shadow var(--transition-timing) ease;
}

.tos-cta__btn:hover,
.tos-cta__btn:focus-visible {
  color: var(--cta-secondary-font-color);
  background: var(--cta-tertiary-bg-color);
  transform: translateY(-2px);
  box-shadow: 0 18px 34px -24px rgba(0, 53, 150, 0.6);
}


/* ============================================================
   FOOTER
   ============================================================ */

.tos-footer {
  padding: 32px 24px;
  text-align: center;
  border-top: 1px solid rgba(0, 53, 150, 0.12);
  font-family: var(--font-cta);
  font-size: var(--font-size-small);
  color: var(--primary-font-color);
}

.tos-footer p {
  margin: 0;
}

.tos-footer p + p {
  margin-top: 8px;
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 768px) {

  .tos-hero {
    padding: 64px 20px 32px;
  }

  .tos-title {
    font-size: var(--font-size-xxlarge);
  }

  .tos-lead {
    font-size: var(--font-size-medium);
  }

  .tos-hero::after {
    margin-top: 32px;
  }

  .tos-main {
    padding: 32px 20px 64px;
  }

  .tos-item {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 20px;
  }

  .tos-item::before {
    width: 40px;
    height: 40px;
  }

  .tos-item__title {
    font-size: var(--font-size-medium);
  }

  .tos-eyebrow::before,
  .tos-eyebrow::after {
    width: 18px;
  }

  .tos-cta {
    padding: 32px 20px;
  }
}


/* ============================================================
   MOTION PREFERENCE / PRINT
   ============================================================ */

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
}

@media print {
  .tos-cta,
  .tos-footer {
    display: none;
  }

  .tos-item {
    break-inside: avoid;
    box-shadow: none;
    transform: none;
  }
}