/* Site-wide corner softening and form dropdown styling.
   Loaded after every page stylesheet; !important only overrides older 0–4px radius rules. */
:root{--ipg-radius-control:8px;--ipg-radius-card:12px;--ipg-radius-media:10px}

/* Buttons, button-like links and form fields */
main :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),textarea,select,button),
main :is(.home-button,.atelier-button,.about-button,.services-button,.fab-button,.button-small),
body>header a[href*="contact"].bg-primary,
body>header .mobile-menu-toggle,
body>footer a.w-10.h-10,
#ipg-consent button{border-radius:var(--ipg-radius-control)!important}
.ipg-honeypot input{border-radius:0!important}

/* Cards and panels */
main :is(.home-service-guide,.home-booking__form,.ipg-package,.fab-category,.bg-titanium-charcoal.p-space-xl,.contact-garages__garage,.ipg-testimonial){border-radius:var(--ipg-radius-card)!important}
main .fab-category{overflow:hidden}
main .fab-category img{border-radius:0!important}

/* Photos, maps and media (full-bleed heroes and brand logos stay square-edged) */
main img:not(.home-hero__visual img,.services-hero img,.about-interior img,.fab-hero__scene img,.home-brand-list img,.fab-category img,[src$=".svg"]),
main iframe,
main .gallery-image-button{border-radius:var(--ipg-radius-media)!important}
main .gallery-image-button{overflow:hidden}
main figure:not(.home-hero__visual,.about-interior,.fab-hero__scene,.services-hero figure,.home-brand-list figure){border-radius:var(--ipg-radius-media)}

/* Dropdowns: custom chevron, hover and focus states, comfortable size */
main select{
  -webkit-appearance:none;appearance:none;
  min-height:48px;padding-right:46px!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%235E93B5' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;background-position:right 16px center!important;background-size:14px!important;
  text-overflow:ellipsis;cursor:pointer;
  transition:border-color .2s,box-shadow .2s,background-color .2s
}
main :is(select,input:not([type=checkbox]):not([type=radio]):not([type=hidden]),textarea){transition:border-color .2s,box-shadow .2s}
main select:hover{border-color:#8CC7E8!important}
main :is(select,input:not([type=checkbox]):not([type=radio]):not([type=hidden]),textarea):focus-visible{border-color:#8CC7E8!important;box-shadow:0 0 0 3px rgba(140,199,232,.22);outline-offset:2px}

/* Browsers with customizable <select> (Chromium 135+) get a fully styled, animated picker.
   Others keep the native list with the chevron above. */
@supports (appearance:base-select){
  main select,main select::picker(select){appearance:base-select}
  main select{background-image:none!important;display:flex!important;align-items:center!important;gap:10px}
  main select::picker-icon{content:"";width:8px;height:8px;margin:-4px 4px 0 auto;border:solid #5E93B5;border-width:0 2.5px 2.5px 0;transform:rotate(45deg);transition:transform .25s cubic-bezier(.22,1,.36,1),margin .25s}
  main select:open::picker-icon{transform:rotate(225deg);margin-top:4px}
  main select::picker(select){
    margin-block:6px;padding:6px;max-height:min(360px,55vh);overflow-y:auto;
    border:1px solid #343B44;border-radius:12px;background:#171B20;color:#F3F6F8;
    box-shadow:0 20px 50px rgba(0,0,0,.45);
    scrollbar-width:thin;scrollbar-color:#343B44 transparent;
    opacity:0;translate:0 -6px;
    transition:opacity .18s,translate .22s cubic-bezier(.22,1,.36,1),overlay .22s allow-discrete,display .22s allow-discrete
  }
  main select:open::picker(select){opacity:1;translate:0 0}
  @starting-style{main select:open::picker(select){opacity:0;translate:0 -6px}}
  main select option{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:8px;font-size:15px;line-height:1.35;color:#D4DCE2;cursor:pointer;transition:background-color .15s,color .15s}
  main select option:hover,main select option:focus-visible{background:#222830;color:#fff;outline:none}
  main select option:checked{color:#8CC7E8;font-weight:600}
  main select option::checkmark{order:1;margin-left:auto;color:#8CC7E8}
}
@media(prefers-reduced-motion:reduce){main select::picker(select),main select::picker-icon{transition:none}}

/* Card hover lift on the inner pages (mouse only), matching the homepage */
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  /* Lift + shadow only for real boxed cards (own background/border). */
  main :is(.ipg-package,.fab-category,.gallery-card,.journal-article){transition:transform .45s cubic-bezier(.22,1,.36,1),border-color .25s,box-shadow .45s}
  main :is(.ipg-package,.fab-category,.gallery-card):hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(0,0,0,.28)}
  /* Services catalogue rows are open, line-divided listings: an accent line draws across the
     divider, the title takes the accent and the photo brightens. No box, no shadow, no jump. */
  .ipg-services .service-card{position:relative}
  .ipg-services .service-card::before{content:"";position:absolute;top:-1px;left:0;right:0;height:2px;background:#5E93B5;transform:scaleX(0);transform-origin:0 50%;transition:transform .55s cubic-bezier(.22,1,.36,1);pointer-events:none}
  .ipg-services .service-card:hover::before{transform:scaleX(1)}
  .ipg-services .service-card h3{transition:color .3s}
  .ipg-services .service-card:hover h3{color:#254E66}
  .ipg-services .service-card__photo{transition:filter .45s,box-shadow .45s}
  .ipg-services .service-card:hover .service-card__photo{filter:brightness(1.08) saturate(1.05);box-shadow:0 12px 28px rgba(11,13,16,.18)}
  main .journal-article:hover{transform:translateY(-4px)}
  main :is(.fab-category,.journal-article) img{transition:transform .65s cubic-bezier(.22,1,.36,1)}
  main :is(.fab-category,.journal-article):hover img{transform:scale(1.03)}
}
