/* DDChallenge R7 PREVIEW — 2026-10-16. Desktop composition review only.
   Original SVG, favicon assets and product code preserved. */
@media (min-width:701px) {
  .tabs-container {
    grid-template-rows:clamp(64px,11vh,110px) minmax(0,1fr) clamp(68px,10.5vh,84px);
    gap:clamp(5px,.75vh,9px);
  }
  /* Full-viewport ambience, with drillship intentionally shifted right. */
  .site-background {
    background:#edf3f7;
    overflow:hidden;
  }
  .site-background::before {
    content:""; position:absolute; inset:0 0 0 auto; width:68%;
    background:url('drillship.jpg') center center / cover no-repeat;
    -webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.2) 10%,#000 50%);
    mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.2) 10%,#000 50%);
  }
  .site-background::after {
    content:""; position:absolute; inset:0;
    background:linear-gradient(90deg,rgba(249,251,253,.94) 0%,rgba(249,251,253,.78) 43%,rgba(249,251,253,.40) 75%,rgba(249,251,253,.22) 100%);
  }
  #about.tab-content.active {
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:minmax(0,1fr) auto;
    gap:clamp(7px,1vh,12px);
    align-items:stretch;
  }
  #about .about-introduction {
    width:100%; min-width:0; min-height:0; align-self:stretch;
    background:transparent;
    padding:clamp(5px,1vh,12px) clamp(12px,2vw,36px);
    align-items:center; text-align:center;
  }
  #about .about-introduction h1 {
    max-width:100%; text-align:center;
    font-size:clamp(1.55rem,min(3vw,4.25vh),2.65rem);
    margin-bottom:clamp(5px,1.1vh,13px);
  }
  #about .about-tagline {
    max-width:100%; text-align:center;
    font-size:clamp(.84rem,min(1.4vw,2.2vh),1.17rem);
    margin-bottom:clamp(6px,1.35vh,15px);
  }
  #about #article-about {
    max-width:min(100%,1050px); width:100%; text-align:center;
    font-size:clamp(.78rem,min(1.2vw,2vh),1.07rem);
    line-height:1.45;
  }
  #about .cards-container {
    flex:none; width:100%; height:auto; min-height:0;
    padding:0 clamp(8px,2vw,32px) clamp(5px,1.4vh,12px);
    justify-content:center; align-items:center; gap:clamp(14px,2vw,30px);
  }
  #about .flip-card {
    flex:none; height:auto; width:min(31vw,420px,calc((100dvh - 188px)*.55*1.586));
    aspect-ratio:1.586 / 1; max-width:calc((100% - 22px)/2);
  }
  #about .flip-card-front,#about .flip-card-back {padding:clamp(9px,1.25vw,18px);}
  #about .flip-card-front {gap:clamp(8px,1.25vw,17px);}
  #about .flip-card-front img {width:26%;max-width:26%;height:78%;max-height:78%;}
  #about .flip-card-front h4 {font-size:clamp(.79rem,min(1.27vw,2vh),1.21rem);}
  #about .card-summary {font-size:clamp(.7rem,min(.9vw,1.65vh),.91rem);line-height:1.4;}
  #about .card-role {font-size:clamp(.7rem,.85vw,.87rem);}
  #about .card-action {font-size:clamp(.68rem,.8vw,.84rem);}
  #about .flip-card-back h4 {font-size:clamp(.8rem,1.15vw,1.12rem);}
  #about .flip-card-back p {font-size:clamp(.64rem,min(.87vw,1.55vh),.84rem);line-height:1.35;}
  .about-footer {
    display:flex; flex-direction:column; justify-content:center; align-items:center;
    gap:clamp(1px,.6vh,5px); padding:clamp(5px,.6vh,8px) 12px;
  }
  .about-footer .social-icons {justify-content:center;}
  .about-footer .copyright {width:100%; text-align:center; line-height:1.15; white-space:nowrap; font-size:clamp(9px,min(.89vw,1.65vh),12px);}
}
@media (min-width:701px) and (max-height:650px) {
 .tabs-container {grid-template-rows:clamp(52px,10vh,64px) minmax(0,1fr) 58px;gap:5px;}
 #about .flip-card {width:min(29vw,355px,calc((100dvh - 135px)*.51*1.586));}
 #about .about-introduction h1 {font-size:clamp(1.25rem,2.4vw,1.85rem);}
 #about .about-tagline {font-size:clamp(.73rem,1.1vw,.95rem);}
 #about #article-about {font-size:clamp(.71rem,1.05vw,.91rem);}
 .about-footer .social {width:24px;height:24px;}
}
/* Mobile remains the established R6 portrait-card theme. */