/* FINAL DESKTOP QA — one shared desktop system. Mobile is untouched. */
@media (min-width:901px){
  :root{
    --qa-line:#27282c;
    --qa-bronze:#b8a792;
    --qa-light:#f4f1eb;
    --qa-body:#c8c4be;
    --qa-pad:clamp(22px,3.2vw,58px);
    --qa-card-gap:18px;
    --qa-row-pad:48px;
    --qa-no-system-gap:72px;
  }

  /* ---------- EXPLORE MORE PROJECTS: identical everywhere ---------- */
  .final-explore{
    width:calc(100% - (2 * var(--qa-pad)))!important;
    margin-left:auto!important;
    margin-right:auto!important;
    margin-bottom:clamp(110px,8vw,150px)!important;
    position:relative!important;
    border:0!important;
  }
  .final-explore::before{
    content:""!important;
    position:absolute!important;
    left:0!important;right:0!important;top:0!important;
    height:1px!important;background:var(--qa-line)!important;
    display:block!important;
  }
  .final-explore::after{display:none!important;content:none!important}
  .final-explore .cp-more__title{
    margin:0 0 28px!important;
    font-family:Inter,Arial,sans-serif!important;
    font-size:9px!important;font-weight:400!important;line-height:1.4!important;
    letter-spacing:.20em!important;text-transform:uppercase!important;
    color:var(--qa-bronze)!important;
  }
  .final-explore .cp-more__grid{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:var(--qa-card-gap)!important;
  }
  .final-explore .cp-more__card{display:block!important;text-decoration:none!important;color:var(--qa-light)!important;min-width:0!important}
  .final-explore .cp-more__image{
    position:relative!important;display:block!important;overflow:hidden!important;
    width:100%!important;aspect-ratio:4/3!important;border-radius:14px!important;background:#17181b!important;
  }
  .final-explore .cp-more__image>img{
    display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;
    transition:transform .42s ease,filter .42s ease!important;
  }
  .final-explore .cp-more__image::after{
    content:""!important;position:absolute!important;inset:0!important;background:rgba(15,16,18,.38)!important;
    opacity:0!important;transition:opacity .26s ease!important;
  }
  .final-explore .cp-more__hover{
    position:absolute!important;z-index:2!important;inset:0!important;display:grid!important;place-items:center!important;
    opacity:0!important;color:var(--qa-light)!important;background:transparent!important;
    font-family:Inter,Arial,sans-serif!important;font-size:9px!important;font-weight:400!important;line-height:1.4!important;
    letter-spacing:.20em!important;transition:opacity .26s ease!important;transform:none!important;
  }
  .final-explore .cp-more__card:hover .cp-more__image>img{transform:scale(1.025)!important;filter:brightness(.72)!important}
  .final-explore .cp-more__card:hover .cp-more__image::after,
  .final-explore .cp-more__card:hover .cp-more__hover{opacity:1!important}
  .final-explore .cp-more__meta{
    display:flex!important;flex-direction:column!important;align-items:flex-start!important;
    gap:7px!important;padding-top:14px!important;
  }
  .final-explore .cp-more__meta small{
    order:0!important;margin:0!important;
    font-family:Inter,Arial,sans-serif!important;font-size:9px!important;font-weight:400!important;line-height:1.4!important;
    letter-spacing:.20em!important;text-transform:uppercase!important;color:rgba(244,241,235,.68)!important;
  }
  .final-explore .cp-more__meta strong{
    order:1!important;margin:0!important;
    font-family:"Playfair Display",serif!important;font-size:22px!important;font-weight:400!important;line-height:1!important;
    letter-spacing:-.02em!important;color:var(--qa-light)!important;
  }

  /* ---------- VISUAL SYSTEM: Red Access is the reference ---------- */
  .ra-gallery,.sky-gallery,.df-gallery,.ix-gallery,.cm-gallery{
    padding-bottom:clamp(105px,9vw,155px)!important;
    margin-bottom:0!important;
  }
  .ra-system,.sky-system,.cm-system{
    margin-top:clamp(20px,2vw,36px)!important;
    margin-bottom:0!important;
    padding-top:0!important;padding-bottom:0!important;
    border-top:0!important;border-bottom:0!important;
  }
  .ra-system::before,.sky-system::before,.cm-system::before{display:none!important;content:none!important}

  .ra-system__head,.sky-system__head,.cm-system__head{
    text-align:center!important;
    margin-bottom:clamp(65px,6vw,100px)!important;
    border:0!important;
  }
  .ra-system__head>span,.sky-system__head>span,.cm-system__head>span{
    display:inline-block!important;
    font-family:Inter,Arial,sans-serif!important;font-size:9px!important;font-weight:400!important;line-height:1.4!important;
    letter-spacing:.22em!important;text-transform:uppercase!important;color:var(--qa-bronze)!important;
  }
  .ra-system__head>span::before,.ra-system__head>span::after,
  .sky-system__head>span::before,.sky-system__head>span::after,
  .cm-system__head>span::before,.cm-system__head>span::after{display:none!important;content:none!important}
  .ra-system__head h2,.sky-system__head h2,.cm-system__head h2{
    margin:14px 0 0!important;
    font-family:"Playfair Display",serif!important;font-size:clamp(42px,4.2vw,68px)!important;
    font-weight:400!important;line-height:1!important;letter-spacing:-.035em!important;color:var(--qa-light)!important;
  }

  .ra-system__row,.sky-system__row,.cm-system__row{
    display:grid!important;grid-template-columns:minmax(150px,22%) 1fr!important;
    gap:clamp(30px,5vw,90px)!important;align-items:center!important;
    min-height:250px!important;padding:var(--qa-row-pad) 0!important;
    border:0!important;border-bottom:1px solid var(--qa-line)!important;
    box-sizing:border-box!important;
  }
  .ra-system__row:first-of-type,.sky-system__row:first-of-type,.cm-system__row:first-of-type{
    border-top:1px solid var(--qa-line)!important;
  }
  .ra-system__row:last-child,.sky-system__row:last-child,.cm-system__row:last-child{
    border-bottom:0!important;
  }
  .ra-system__label,.sky-system__label,.cm-system__label,
  .ra-system__label strong,.sky-system__label strong{
    font-family:Inter,Arial,sans-serif!important;font-size:10px!important;font-weight:400!important;line-height:1.4!important;
    letter-spacing:.18em!important;text-transform:uppercase!important;color:#bdb9b4!important;
  }

  /* same color-block proportions as Red Access */
  .ra-colors,.sky-colors,.cm-colors{max-width:780px!important;gap:16px!important}
  .ra-colors i,.sky-colors i,.cm-colors i{
    display:block!important;aspect-ratio:1.5!important;height:auto!important;border-radius:10px!important;
  }
  .ra-colors small,.sky-colors small,.cm-colors small{
    display:block!important;margin-top:12px!important;font:400 9px/1.2 Inter,Arial,sans-serif!important;
    letter-spacing:.08em!important;color:#777!important;
  }

  /* icon systems: one clean row / no cards or borders */
  .ra-icons span,.df-icons-v8 span,.cm-icons span,.ix-icons .ix-icon,
  .sky-icons-art--desktop,.sky-icons-art--desktop img{
    border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;
  }
  .ra-icons{max-width:790px!important;grid-template-columns:repeat(5,minmax(72px,1fr))!important;gap:14px!important}
  .ra-icons img{width:68%!important;height:68%!important;object-fit:contain!important}
  .df-icons-v8{width:min(100%,780px)!important;max-width:780px!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:clamp(22px,2.2vw,34px)!important}
  .cm-icons{max-width:780px!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:14px!important}
  .cm-icons span{aspect-ratio:auto!important;height:auto!important}
  .cm-icons img{display:block!important;width:100%!important;height:auto!important;object-fit:contain!important}
  .sky-icons-art--desktop{width:min(100%,790px)!important;max-width:790px!important;margin:0!important;overflow:visible!important}
  .sky-icons-art--desktop img{display:block!important;width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important}

  /* IXDen: ONE set of six icons, one row, cropped from the supplied strip */
  .ix-icons{
    display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;
    width:min(100%,780px)!important;max-width:780px!important;gap:18px!important;
    transform:none!important;overflow:visible!important;border:0!important;background:transparent!important;
  }
  .ix-icons::before,.ix-icons::after{display:none!important;content:none!important}
  .ix-icons .ix-icon{
    display:block!important;width:100%!important;aspect-ratio:1/1!important;
    overflow:hidden!important;border:0!important;border-radius:0!important;
    background-image:url("ixden-icons.png")!important;background-repeat:no-repeat!important;background-size:600% 100%!important;
  }
  .ix-icons .ix-icon img{display:none!important}
  .ix-icon--1{background-position:0% 0!important}.ix-icon--2{background-position:20% 0!important}
  .ix-icon--3{background-position:40% 0!important}.ix-icon--4{background-position:60% 0!important}
  .ix-icon--5{background-position:80% 0!important}.ix-icon--6{background-position:100% 0!important}

  /* subtle light edge only on the dark Skyhawk / IXDen swatches */
  .sky-colors>span:first-child>i,
  .ix-colors>span:nth-child(2)>i{box-shadow:inset 0 0 0 1px rgba(244,241,235,.22)!important}

  /* divider after a Visual System occupies the same rhythm as internal row dividers */
  .ra-system + .final-explore,.sky-system + .final-explore,.cm-system + .final-explore{
    margin-top:0!important;
    padding-top:var(--qa-row-pad)!important;
  }

  /* ---------- PROJECT-SPECIFIC ARTWORK, NO CROPPING ---------- */
  /* Red Access: full grid, centered wide art, pair widths derived from source ratios so bottoms align */
  .ra-gallery{display:flex!important;flex-direction:column!important;gap:clamp(16px,1.35vw,22px)!important}
  .ra-gallery>*{margin:0!important;flex:none!important}
  .ra-frame,.ra-frame>.ra-picture{height:auto!important;min-height:0!important;max-height:none!important;overflow:hidden!important;border-radius:14px!important}
  .ra-frame>.ra-picture{display:block!important;width:100%!important}
  .ra-frame>.ra-picture>img{
    display:block!important;position:static!important;width:100%!important;height:auto!important;max-height:none!important;
    margin:0 auto!important;transform:none!important;object-fit:contain!important;object-position:center center!important;border-radius:14px!important;
  }
  .ra-frame--wide{width:100%!important;aspect-ratio:auto!important;margin-inline:auto!important}
  .ra-pair{
    display:grid!important;grid-template-columns:1.5fr 1.333333fr!important;
    gap:var(--gap,20px)!important;align-items:start!important;width:100%!important;
  }
  .ra-pair .ra-frame{height:auto!important;align-self:start!important}
  .ra-pair .ra-frame img{height:auto!important;object-fit:contain!important}

  /* Skyhawk: natural source ratios create one aligned row with no beige empty tail */
  .sky-pair{
    display:grid!important;grid-template-columns:.75fr 1.250305fr!important;
    gap:var(--cp-gap,16px)!important;align-items:start!important;
  }
  .sky-pair .cp-frame{aspect-ratio:auto!important;height:auto!important;align-self:start!important;overflow:hidden!important;border-radius:14px!important}
  .sky-pair .cp-frame img{display:block!important;width:100%!important;height:auto!important;object-fit:contain!important;object-position:center!important}

  /* Harmony: natural source ratios align both images on the same bottom line */
  .gallery.grid .pair{
    display:grid!important;grid-template-columns:1.500366fr .833333fr!important;
    gap:18px!important;align-items:start!important;
  }
  .gallery.grid .pair figure{height:auto!important;min-height:0!important;align-self:start!important;overflow:hidden!important;border-radius:14px!important}
  .gallery.grid .pair img{display:block!important;width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important;border-radius:14px!important}

  /* Tami4 Everyday Moments: source-width ratio makes both images exactly equal-height */
  .t4-row--split{
    display:grid!important;grid-template-columns:1400fr 980fr!important;
    gap:18px!important;align-items:start!important;
  }
  .t4-row--split .t4-mobile-screens,.t4-row--split .t4-phone{
    grid-column:auto!important;width:100%!important;height:auto!important;min-height:0!important;
    align-self:start!important;overflow:hidden!important;border-radius:14px!important;
  }
  .t4-row--split .t4-mobile-screens img,.t4-row--split .t4-phone img{
    display:block!important;width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important;border-radius:14px!important;
  }

  /* ---------- Pages without Visual System: one centered divider only ---------- */
  .cp-gallery.grid-width:not(.sky-gallery):not(.df-gallery):not(.ix-gallery),.gallery.grid,.t4-case{
    padding-bottom:0!important;margin-bottom:0!important;border-bottom:0!important;
  }
  .t4-case::after{display:none!important;content:none!important}
  .cp-gallery.grid-width:not(.sky-gallery):not(.df-gallery):not(.ix-gallery) + .final-explore,
  .gallery.grid + .final-explore,
  .t4-case + .final-explore{
    margin-top:var(--qa-no-system-gap)!important;
    padding-top:var(--qa-no-system-gap)!important;
  }
}


/* =========================================================
   FINAL MOBILE QA — shared system
   Applies only <= 900px. Desktop remains unchanged.
   ========================================================= */
@media (max-width:900px){

  :root{
    --mobile-bronze:#b8a792;
    --mobile-light:#f4f1eb;
    --mobile-body:#c8c4be;
    --mobile-line:#27282c;
    --mobile-contact-bg:#f4f0eb;
    --mobile-contact-ink:#171719;
    --mobile-section-gap:72px;
  }

  /* ---------- MICRO TITLES ---------- */
  .cp-more__title,
  .ra-system__head > span,
  .sky-system__head > span,
  .cm-system__head > span,
  .t4-index{
    color:var(--mobile-bronze)!important;
    font-family:Inter,Arial,sans-serif!important;
    font-size:9px!important;
    font-weight:400!important;
    line-height:1.4!important;
    letter-spacing:.20em!important;
    text-transform:uppercase!important;
  }

  /* ---------- BRAND IDENTITY ---------- */
  .ra-system__head,
  .sky-system__head,
  .cm-system__head{
    text-align:left!important;
    justify-items:start!important;
    margin-bottom:44px!important;
  }

  .ra-system__head > span,
  .sky-system__head > span,
  .cm-system__head > span{
    display:block!important;
    width:100%!important;
    text-align:left!important;
    justify-content:flex-start!important;
  }

  .ra-system__head > span::before,
  .ra-system__head > span::after,
  .sky-system__head > span::before,
  .sky-system__head > span::after,
  .cm-system__head > span::before,
  .cm-system__head > span::after{
    display:none!important;
    content:none!important;
  }

  .ra-system__head h2,
  .sky-system__head h2,
  .cm-system__head h2{
    text-align:left!important;
  }

  /* Visual System always starts cleanly — no divider above it */
  .ra-system,
  .sky-system,
  .cm-system{
    border-top:0!important;
  }

  .ra-system::before,
  .sky-system::before,
  .cm-system::before{
    display:none!important;
    content:none!important;
  }

  /* Keep a clean mobile gap from project imagery to Visual System */
  .ra-gallery + .ra-system,
  .sky-gallery + .sky-system,
  .df-gallery + .sky-system,
  .ix-mobile-gallery + .sky-system,
  .cm-mobile-gallery + .cm-system,
  .cm-gallery + .cm-system{
    margin-top:var(--mobile-section-gap)!important;
    padding-top:0!important;
  }

  /* ---------- EXPLORE MORE PROJECTS ---------- */
  .final-explore{
    width:calc(100% - (2 * var(--pad,22px)))!important;
    margin-left:auto!important;
    margin-right:auto!important;
    position:relative!important;
    border:0!important;
    padding-left:0!important;
    padding-right:0!important;
  }

  .final-explore::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:0!important;
    height:1px!important;
    background:var(--mobile-line)!important;
  }

  .final-explore::after{
    display:none!important;
    content:none!important;
  }

  /* same distance before and after the divider */
  .ra-system + .final-explore,
  .sky-system + .final-explore,
  .cm-system + .final-explore,
  .cp-gallery + .final-explore,
  .gallery.grid + .final-explore,
  .t4-case + .final-explore{
    margin-top:var(--mobile-section-gap)!important;
    padding-top:var(--mobile-section-gap)!important;
  }

  /* remove inherited extra bottom lines that can create a double divider */
  .ra-system__row:last-child,
  .sky-system__row:last-child,
  .cm-system__row:last-child,
  .gallery.grid,
  .cp-gallery,
  .t4-case{
    border-bottom:0!important;
  }

  .final-explore .cp-more__title{
    margin:0 0 24px!important;
    color:var(--mobile-bronze)!important;
  }

  /* Harmony + every other page: one consistent mobile Explore stack */
  .final-explore .cp-more__grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:34px!important;
    width:100%!important;
  }

  .final-explore .cp-more__card{
    display:block!important;
    width:100%!important;
    min-width:0!important;
  }

  .final-explore .cp-more__image{
    display:block!important;
    width:100%!important;
    aspect-ratio:4/3!important;
    overflow:hidden!important;
    border-radius:14px!important;
  }

  .final-explore .cp-more__image > img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }

  .final-explore .cp-more__meta{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:7px!important;
    padding-top:14px!important;
  }

  .final-explore .cp-more__meta small{
    margin:0!important;
    font-family:Inter,Arial,sans-serif!important;
    font-size:9px!important;
    font-weight:400!important;
    line-height:1.4!important;
    letter-spacing:.20em!important;
    text-transform:uppercase!important;
    color:rgba(244,241,235,.68)!important;
  }

  .final-explore .cp-more__meta strong{
    margin:0!important;
    font-family:"Playfair Display",serif!important;
    font-size:22px!important;
    font-weight:400!important;
    line-height:1!important;
    letter-spacing:-.02em!important;
    color:var(--mobile-light)!important;
  }

  /* ---------- IXDEN ICON SET ---------- */
  /* The final IXDen HTML contains one original icon strip only.
     Keep it in normal document flow so the Explore divider can never overlap it. */
  .ix-icons.ix-icons--single{
    display:block!important;
    position:static!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:auto!important;
    margin:0!important;
    overflow:visible!important;
    transform:none!important;
    border:0!important;
    background:transparent!important;
  }

  .ix-icons.ix-icons--single::before,
  .ix-icons.ix-icons--single::after{
    display:none!important;
    content:none!important;
  }

  .ix-icons.ix-icons--single img{
    display:block!important;
    position:static!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    object-fit:contain!important;
    transform:none!important;
  }

  .sky-system__row--icons{
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    padding-bottom:34px!important;
  }

  /* IXDen: guarantee clean space below icon artwork before the divider */
  .ix-icons.ix-icons--single{
    margin-bottom:0!important;
  }

  /* ---------- CONTACT — IDENTICAL ON EVERY INTERNAL PAGE ---------- */
  .contact-v22{
    background:var(--mobile-contact-bg)!important;
    color:var(--mobile-contact-ink)!important;
    min-height:0!important;
  }

  .contact-v22__inner{
    width:100%!important;
    min-height:0!important;
    padding:68px 24px 62px!important;
    display:flex!important;
    justify-content:center!important;
    align-items:flex-start!important;
  }

  .contact-final{
    position:static!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    justify-items:center!important;
    align-items:start!important;
    gap:30px!important;
    width:min(100%,430px)!important;
    height:auto!important;
    margin:0 auto!important;
    padding:0!important;
    transform:none!important;
    text-align:center!important;
    opacity:1!important;
    visibility:visible!important;
  }

  .contact-final__left,
  .contact-final__right{
    position:static!important;
    width:100%!important;
    height:auto!important;
    display:grid!important;
    justify-items:center!important;
    align-items:start!important;
    text-align:center!important;
  }

  .contact-final__left{
    grid-template-rows:auto!important;
    gap:14px!important;
  }

  .contact-final__label{
    position:static!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    font-family:Inter,Arial,sans-serif!important;
    font-size:8px!important;
    font-weight:500!important;
    line-height:18px!important;
    letter-spacing:.25em!important;
    text-transform:uppercase!important;
    color:#7a766f!important;
    text-align:center!important;
  }

  .contact-final__word{
    position:static!important;
    display:block!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    font-family:"Playfair Display",serif!important;
    font-size:clamp(58px,15vw,72px)!important;
    font-weight:400!important;
    line-height:.86!important;
    letter-spacing:-.046em!important;
    color:var(--mobile-contact-ink)!important;
    white-space:nowrap!important;
    text-align:center!important;
  }

  .contact-final__word--lets,
  .contact-final__word--talk{
    grid-row:auto!important;
  }

  .contact-final__separator{
    display:block!important;
    width:86px!important;
    height:1px!important;
    margin:2px auto 0!important;
    background:var(--mobile-contact-ink)!important;
    opacity:.5!important;
  }

  .contact-final__right{
    grid-template-rows:auto!important;
    gap:13px!important;
  }

  .contact-final__email-label,
  .contact-final__email,
  .contact-final__phone-label,
  .contact-final__phone,
  .contact-final__small-divider{
    position:static!important;
    grid-row:auto!important;
    left:auto!important;
    top:auto!important;
    align-self:auto!important;
    justify-self:center!important;
    margin-left:auto!important;
    margin-right:auto!important;
    text-align:center!important;
  }

  .contact-final__right a{
    display:inline-block!important;
    max-width:100%!important;
    margin:0!important;
    font-family:Inter,Arial,sans-serif!important;
    font-size:15px!important;
    font-weight:400!important;
    line-height:1.2!important;
    letter-spacing:-.015em!important;
    color:var(--mobile-contact-ink)!important;
    overflow-wrap:anywhere!important;
    text-align:center!important;
  }

  .contact-final__small-divider{
    display:block!important;
    width:38px!important;
    height:1px!important;
    margin-top:8px!important;
    margin-bottom:8px!important;
    background:var(--mobile-bronze)!important;
    opacity:.68!important;
  }

  .contact-v22__footer{
    width:100%!important;
    padding:22px 24px 30px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:28px!important;
    text-align:center!important;
    font-family:Inter,Arial,sans-serif!important;
    font-size:8px!important;
    letter-spacing:.14em!important;
    color:var(--mobile-contact-ink)!important;
  }

  .contact-v22__footer > *{
    margin:0 auto!important;
    text-align:center!important;
    color:var(--mobile-contact-ink)!important;
  }
}


/* =========================================================
   MOBILE FINAL LAST PATCH
   Harmony underline/contact gap + IXDen 3x2 icons + Tami4 divider/gap
   ========================================================= */
@media (max-width:900px){

  /* HARMONY / EXPLORE: never inherit browser link underline/visited purple */
  .final-explore .cp-more__card,
  .final-explore .cp-more__card:link,
  .final-explore .cp-more__card:visited,
  .final-explore .cp-more__card:hover,
  .final-explore .cp-more__card:active,
  .final-explore .cp-more__meta,
  .final-explore .cp-more__meta strong,
  .final-explore .cp-more__meta small{
    text-decoration:none!important;
    border-bottom:0!important;
    box-shadow:none!important;
    background-image:none!important;
  }

  .final-explore .cp-more__card,
  .final-explore .cp-more__card:visited{
    color:var(--mobile-light)!important;
  }

  /* Keep a real, consistent gap between last Explore card and Contact */
  .final-explore{
    margin-bottom:72px!important;
  }

  /* IXDEN: use a dedicated 3x2 crop of the SAME approved icon artwork on mobile */
  .ix-icons.ix-icons--single{
    width:100%!important;
    max-width:520px!important;
    margin:0!important;
  }

  .ix-icons.ix-icons--single img{
    content:url("ixden-icons-mobile.png")!important;
    display:block!important;
    width:100%!important;
    height:auto!important;
    max-width:520px!important;
    margin:0!important;
    object-fit:contain!important;
  }

  .sky-system__row--icons{
    padding-bottom:38px!important;
    overflow:visible!important;
  }

  /* TAMI4: remove its old built-in divider and all accumulated bottom spacing.
     The shared Explore divider is the ONLY divider. */
  .t4-case{
    padding-bottom:0!important;
    margin-bottom:0!important;
    border-bottom:0!important;
  }

  .t4-case::after,
  .t4-case::before{
    display:none!important;
    content:none!important;
  }

  .t4-case + .final-explore{
    margin-top:72px!important;
    padding-top:72px!important;
  }
}


/* =========================================================
   MOBILE FINAL — BRAND IDENTITY GAP
   Carmel Metal is the spacing reference on every Visual System page.
   ========================================================= */
@media (max-width:900px){
  .ra-gallery + .ra-system,
  .sky-gallery + .sky-system,
  .df-gallery + .sky-system,
  .ix-mobile-gallery + .sky-system,
  .cm-mobile-gallery + .cm-system,
  .cm-gallery + .cm-system{
    margin-top:72px!important;
    padding-top:0!important;
  }
}


/* =========================================================
   MOBILE FINAL SPACING SYSTEM
   One spacing source only. Carmel Metal rhythm is the reference.
   ========================================================= */
@media (max-width:900px){

  :root{
    --mobile-gap-to-brand:72px;
    --mobile-gap-to-explore:72px;
  }

  /* ---------- 1) END OF PROJECT IMAGERY -> BRAND IDENTITY ---------- */
  /* Remove old accumulated spacing from image galleries */
  .ra-gallery,
  .sky-gallery,
  .df-gallery,
  .ix-gallery,
  .ix-mobile-gallery,
  .cm-gallery,
  .cm-mobile-gallery{
    padding-bottom:0!important;
    margin-bottom:0!important;
  }

  /* One and only one gap before Brand Identity */
  .ra-gallery + .ra-system,
  .sky-gallery + .sky-system,
  .df-gallery + .sky-system,
  .ix-gallery + .sky-system,
  .ix-mobile-gallery + .sky-system,
  .cm-gallery + .cm-system,
  .cm-mobile-gallery + .cm-system{
    margin-top:var(--mobile-gap-to-brand)!important;
    padding-top:0!important;
  }

  /* ---------- 2) BRAND IDENTITY -> EXPLORE MORE ---------- */
  /* Remove accumulated bottom spacing on visual-system sections */
  .ra-system,
  .sky-system,
  .cm-system{
    margin-bottom:0!important;
    padding-bottom:0!important;
    border-bottom:0!important;
  }

  /* One and only one divider + one consistent rhythm before Explore */
  .ra-system + .final-explore,
  .sky-system + .final-explore,
  .cm-system + .final-explore{
    margin-top:var(--mobile-gap-to-explore)!important;
    padding-top:var(--mobile-gap-to-explore)!important;
  }

  /* ---------- 3) PAGES WITHOUT BRAND IDENTITY ---------- */
  .cp-gallery.grid-width:not(.sky-gallery):not(.df-gallery):not(.ix-gallery),
  .gallery.grid,
  .t4-case{
    padding-bottom:0!important;
    margin-bottom:0!important;
    border-bottom:0!important;
  }

  .cp-gallery.grid-width:not(.sky-gallery):not(.df-gallery):not(.ix-gallery) + .final-explore,
  .gallery.grid + .final-explore,
  .t4-case + .final-explore{
    margin-top:var(--mobile-gap-to-explore)!important;
    padding-top:var(--mobile-gap-to-explore)!important;
  }

  /* ---------- 4) TAMI4: exactly one divider before Explore ---------- */
  .t4-case::before,
  .t4-case::after{
    display:none!important;
    content:none!important;
  }

  /* Explore owns the divider everywhere */
  .final-explore{
    position:relative!important;
    border:0!important;
  }

  .final-explore::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:0!important;
    height:1px!important;
    background:var(--mobile-line,#27282c)!important;
  }

  .final-explore::after{
    display:none!important;
    content:none!important;
  }
}


/* =========================================================
   MOBILE FINAL HARD RESET — SKYHAWK / D-FEND
   Force identical section spacing on the two structurally-matched pages.
   Mobile only.
   ========================================================= */
@media (max-width:900px){

  /* Last project image must end at the section edge — no hidden spacing */
  .sky-gallery,
  .df-gallery{
    padding-bottom:0!important;
    margin-bottom:0!important;
  }

  .sky-gallery > :last-child,
  .df-gallery > :last-child{
    margin-bottom:0!important;
    padding-bottom:0!important;
  }

  /* Exact same image -> Brand Identity distance */
  .sky-gallery + .sky-system,
  .df-gallery + .sky-system{
    margin-top:72px!important;
    margin-bottom:0!important;
    padding-top:0!important;
  }

  /* Exact same final Visual System row ending */
  .sky-gallery + .sky-system .sky-system__row:last-child,
  .df-gallery + .sky-system .sky-system__row:last-child{
    margin-bottom:0!important;
    padding-bottom:38px!important;
    border-bottom:0!important;
  }

  /* Exact same Brand Identity -> Explore distance */
  .sky-gallery + .sky-system + .final-explore,
  .df-gallery + .sky-system + .final-explore{
    margin-top:72px!important;
    padding-top:72px!important;
  }
}

@media (min-width:901px){
  :root{--qa-line:#27282c;--qa-bronze:#b8a792;--qa-gap:72px}

  /* BRAND IDENTITY — one consistent treatment everywhere */
  .sky-system__head>span,.ra-system__head>span,.cm-system__head>span{
    color:var(--qa-bronze)!important;
    font-family:Inter,Arial,sans-serif!important;
    font-size:9px!important;font-weight:400!important;line-height:1.4!important;
    letter-spacing:.20em!important;text-transform:uppercase!important;
  }
  .sky-system__head>span::before,.sky-system__head>span::after,
  .ra-system__head>span::before,.ra-system__head>span::after,
  .cm-system__head>span::before,.cm-system__head>span::after{display:none!important;content:none!important}

  /* No divider between project imagery and Visual System */
  .sky-system,.ra-system,.cm-system{border-top:0!important}
  .sky-system::before,.ra-system::before,.cm-system::before{display:none!important;content:none!important}

  /* One divider only before Explore. Equal 72px on both sides. */
  .final-explore{
    position:relative!important;
    border-top:0!important;
    margin-top:var(--qa-gap)!important;
    padding-top:var(--qa-gap)!important;
  }
  .final-explore::before{
    content:""!important;display:block!important;position:absolute!important;
    left:0!important;right:0!important;top:0!important;height:1px!important;
    background:var(--qa-line)!important;
  }
  .final-explore::after{display:none!important;content:none!important}
  .final-explore .cp-more__title{margin-top:0!important}

  /* Remove the old last-row divider so there can never be a double line */
  .sky-system__row:last-child,.ra-system__row:last-child,.cm-system__row:last-child{
    border-bottom:0!important;
  }

  /* Icon artwork itself has no decorative card/frame */
  .ra-icons span,.df-icons-v8 span,.cm-icons span,.ix-icons .ix-icon,
  .sky-icons-art,.sky-icons-art img{
    border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;
  }

  /* RED ACCESS — intrinsic image heights, no stretched empty black area */
  .ra-gallery{width:calc(100% - (2 * clamp(22px,3.2vw,58px)))!important;margin-inline:auto!important}
  .ra-gallery>.ra-frame--wide{width:100%!important;margin-inline:auto!important}
  .ra-frame,.ra-frame>.ra-picture,.ra-frame>.ra-picture>img{
    height:auto!important;min-height:0!important;max-height:none!important;
  }
  .ra-frame>.ra-picture>img{
    display:block!important;width:100%!important;object-fit:contain!important;
    object-position:center!important;position:static!important;transform:none!important;margin:0 auto!important;
  }
  .ra-pair{align-items:start!important}
  .ra-pair>.ra-frame{align-self:start!important;height:auto!important}
  .ra-pair>.ra-frame>.ra-picture{display:block!important;height:auto!important}
  .ra-pair>.ra-frame>.ra-picture>img{height:auto!important;max-height:none!important}
  .ra-frame,.ra-frame>.ra-picture,.ra-frame>.ra-picture>img{border-radius:14px!important}

  /* Red Access icons: remove only the tiles; keep supplied icon scale */
  .ra-icons span{background:transparent!important;border:0!important}
  .ra-icons img{object-fit:contain!important}

  /* SKYHAWK */
  .sky-icons-art--desktop{border:0!important;outline:0!important;box-shadow:none!important;overflow:visible!important}
  .sky-icons-art--desktop img{display:block!important;width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important}
  .sky-colors>span:first-child>i{box-shadow:inset 0 0 0 1px rgba(244,241,235,.20)!important}

  /* D-FEND: supplied icons without card borders */
  .df-icons-v8 span{border:0!important;background:transparent!important;box-shadow:none!important}
  .df-icons-v8 img{object-fit:contain!important}
  /* actual project typeface in the specimen */
  .sky-system .df-type,.sky-system .df-type *,
  body[data-project="dfend"] .sky-type,body[data-project="dfend"] .sky-type *{font-family:"KoHo",sans-serif!important}

  /* IXDEN: six crop windows = one single horizontal row, no surrounding frames */
  .ix-icons{
    display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:18px!important;width:100%!important;overflow:visible!important;
    border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;
  }
  .ix-icons::before,.ix-icons::after{display:none!important;content:none!important}
  .ix-icons .ix-icon{
    display:block!important;position:relative!important;overflow:hidden!important;
    width:100%!important;aspect-ratio:1/1!important;border:0!important;background:transparent!important;
  }

  /* CARMEL METAL icons */
  .cm-icons span{border:0!important;background:transparent!important;box-shadow:none!important}

  /* TAMI4 Everyday Moments: both images show fully, all four corners */
  .t4-row--split{align-items:start!important}
  .t4-row--split .t4-mobile-screens,.t4-row--split .t4-phone{
    height:auto!important;min-height:0!important;overflow:hidden!important;border-radius:14px!important;
  }
  .t4-row--split .t4-mobile-screens img,.t4-row--split .t4-phone img{
    display:block!important;width:100%!important;height:auto!important;max-height:none!important;
    object-fit:contain!important;border-radius:14px!important;
  }

  /* All project artwork corners; no crop */
  .cp-frame,.ra-frame,.t4-frame{border-radius:14px!important;overflow:hidden!important}
  .cp-frame img,.ra-frame img,.t4-frame img{max-height:none!important}
}

@media (min-width:901px){
  .harmony-case,.case.grid{border-bottom:0!important}
  .harmony-case figure,.case.grid figure,.case.grid .pair figure{
    height:auto!important;min-height:0!important;overflow:hidden!important;border-radius:14px!important;align-self:start!important;
  }
  .harmony-case img,.case.grid img,.case.grid .pair img{
    display:block!important;width:100%!important;height:auto!important;max-height:none!important;
    object-fit:contain!important;object-position:center!important;border-radius:14px!important;
  }
  .case.grid .pair{align-items:start!important}
}


/* FINAL DESKTOP ONLY — Skyhawk equal grid gaps */
@media (min-width:901px){
  .sky-gallery{--sky-grid-gap:clamp(22px,2.2vw,36px)!important;}
  .sky-gallery .sky-pair{gap:var(--sky-grid-gap)!important;}
  .sky-gallery > .cp-frame + .sky-pair{margin-top:var(--sky-grid-gap)!important;}
}

/* ===== FINAL MOBILE HOTFIX — menu + Tami4 contact links only ===== */
@media (max-width:900px){
  .mobile-menu{
    position:fixed!important;inset:0!important;z-index:999!important;
    display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
    gap:28px!important;background:#0f1012!important;
    opacity:0!important;visibility:hidden!important;pointer-events:none!important;
    transition:opacity .22s ease,visibility .22s ease!important;
  }
  .mobile-menu.open{opacity:1!important;visibility:visible!important;pointer-events:auto!important}
  .mobile-menu a{
    color:#f4f1eb!important;text-decoration:none!important;
    font-family:Inter,Arial,sans-serif!important;font-size:13px!important;font-weight:400!important;
    line-height:1!important;letter-spacing:.26em!important;text-transform:uppercase!important;
  }
  .site-header{z-index:1000!important}
  .site-header .menu-button{position:relative!important;z-index:1001!important}
  .contact-final__email,.contact-final__phone{text-decoration:none!important;border-bottom:0!important;box-shadow:none!important}
}


/* ===== FINAL QA HOTFIX — scoped + minimal — 2026-09-13 ===== */
@media (min-width:901px){
  /* Harmony only: keep the existing custom cursor above Explore More Projects. */
  .page-harmony .custom-cursor{z-index:99999!important;pointer-events:none!important;}
  .page-harmony .custom-cursor__ring,
  .page-harmony .custom-cursor__dot{z-index:99999!important;pointer-events:none!important;}

  /* Check Point only: equal vertical/horizontal gaps inside its gallery. */
  .cp-gallery.grid-width:not(.sky-gallery):not(.df-gallery):not(.ix-gallery){
    --final-project-gap:18px!important;
    gap:var(--final-project-gap)!important;
    row-gap:var(--final-project-gap)!important;
    column-gap:var(--final-project-gap)!important;
  }
  .cp-gallery.grid-width:not(.sky-gallery):not(.df-gallery):not(.ix-gallery) .cp-pair{
    gap:var(--final-project-gap)!important;
    margin-top:0!important;
    margin-bottom:0!important;
  }
  .cp-gallery.grid-width:not(.sky-gallery):not(.df-gallery):not(.ix-gallery) > *{
    margin-top:0!important;
    margin-bottom:0!important;
  }

  /* Skyhawk only: use one identical gap everywhere in the artwork grid. */
  .sky-gallery{
    --sky-grid-gap:18px!important;
    gap:var(--sky-grid-gap)!important;
    row-gap:var(--sky-grid-gap)!important;
    column-gap:var(--sky-grid-gap)!important;
  }
  .sky-gallery .sky-pair{gap:var(--sky-grid-gap)!important;margin-top:0!important;margin-bottom:0!important;}
  .sky-gallery > .cp-frame + .sky-pair{margin-top:var(--sky-grid-gap)!important;}
}


/* ===== FINAL QA HOTFIX V2 — gallery order/gaps + unified color swatches — 2026-09-13 ===== */
@media (min-width:901px){

  /* CHECK POINT — force the opening video to stay first and use one gap everywhere. */
  .cp-gallery.grid-width:not(.sky-gallery):not(.df-gallery):not(.ix-gallery){
    display:flex!important;
    flex-direction:column!important;
    gap:18px!important;
    row-gap:18px!important;
    column-gap:18px!important;
  }
  .cp-gallery.grid-width:not(.sky-gallery):not(.df-gallery):not(.ix-gallery) > *{
    width:100%!important;
    margin:0!important;
  }
  .cp-gallery.grid-width:not(.sky-gallery):not(.df-gallery):not(.ix-gallery) > .cp-video--opening{
    order:-1!important;
  }
  .cp-gallery.grid-width:not(.sky-gallery):not(.df-gallery):not(.ix-gallery) .cp-pair{
    width:100%!important;
    gap:18px!important;
    margin:0!important;
  }

  /* SKYHAWK — same vertical gap as the pair gap; no doubled margin before the pair. */
  .sky-gallery{
    display:flex!important;
    flex-direction:column!important;
    gap:18px!important;
    row-gap:18px!important;
    column-gap:18px!important;
  }
  .sky-gallery > *{
    width:100%!important;
    margin:0!important;
  }
  .sky-gallery > .cp-video--opening{
    order:-1!important;
  }
  .sky-gallery .sky-pair{
    width:100%!important;
    gap:18px!important;
    margin:0!important;
  }
  .sky-gallery > .cp-frame + .sky-pair{
    margin-top:0!important;
  }

  /* VISUAL SYSTEM — one consistent swatch size across Red Access, Skyhawk, IXDen and Carmel Metal. */
  .ra-colors,
  .sky-colors,
  .cm-colors{
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
    width:auto!important;
    max-width:none!important;
    gap:16px!important;
  }
  .ra-colors > span,
  .sky-colors > span,
  .cm-colors > span{
    flex:0 0 clamp(135px,11.5vw,183px)!important;
    width:clamp(135px,11.5vw,183px)!important;
    min-width:0!important;
  }
  .ra-colors > span > i,
  .sky-colors > span > i,
  .cm-colors > span > i{
    display:block!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:1.5!important;
    border-radius:10px!important;
  }
}

/* ===== MOBILE IXDEN ICON SIZE — mobile only ===== */
@media (max-width:900px){
  .ix-icons--single{
    display:flex!important;
    justify-content:center!important;
    align-items:center!important;
    width:100%!important;
  }
  .ix-icons--single > img{
    display:block!important;
    width:88%!important;
    max-width:88%!important;
    height:auto!important;
    margin:0 auto!important;
  }
}