/* ===========================================================================
   DMOS — rounded corners
   ---------------------------------------------------------------------------
   Softens content imagery and description containers while leaving full-bleed
   artwork square-edged: the homepage hero carousel, the page-header banners
   and the CTA band all run edge to edge, so a radius there would show as a
   notch against the viewport.

   Applied as an override so it can be lifted out in one piece. The proper
   home for this is the Tailwind classes in source — see README.
   =========================================================================== */

:root {
  --dm-radius: 14px;        /* cards and image wrappers */
  --dm-radius-inner: 12px;  /* the image inside a wrapper */
  --dm-radius-sm: 10px;     /* small inline elements */
}

/* ---------------------------------------------------------------------------
   1. Images stay rectangular
   Photography keeps hard 90-degree corners throughout. Only the containers
   around it are softened.
   --------------------------------------------------------------------------- */
img {
  border-radius: 0;
}

/* ---------------------------------------------------------------------------
   2. Image wrappers carry the curve
   The img element itself never gets a radius — the wrapper clips it instead,
   which rounds the photo without touching the image. These wrappers already
   have overflow-hidden for the hover zoom, so the clip costs nothing.

   Cards override this below to round only their top edge.
   --------------------------------------------------------------------------- */
[class*="overflow-hidden"][class*="aspect-"],
[class*="overflow-hidden"][class*="relative"]:has(> img[class*="object-cover"]:not([class*="absolute"])) {
  border-radius: var(--dm-radius);
}

/* ---------------------------------------------------------------------------
   3. Description containers / cards
   --------------------------------------------------------------------------- */
/* `border border-ice-200` (with the space) matches only full-bordered boxes,
   so partial rules — the sticky admin toolbar's `border-b`, a panel's
   `border-t` — are left alone. `:not([class*="rounded-"])` keeps any element
   that already declares its own radius, chiefly admin form controls. */
[class*="shadow-card"]:not([class*="rounded-"]),
[class*="border border-ice-200"][class*="bg-white"]:not([class*="rounded-"]):not([class*="sticky"]),
[class*="border border-ice-200"][class*="bg-gradient-to-br"]:not([class*="rounded-"]),
[class*="shadow-lift"][class*="bg-white"]:not([class*="rounded-"]) {
  border-radius: var(--dm-radius);
}

/* Image-topped cards.
   The site ships five variants of this card and they do NOT share a class:

     homepage services     bg-white shadow-card          aspect-[4/3]
     homepage news         bg-white shadow-card          aspect-[16/10]
     services page         bg-white (no border/shadow)   aspect-[16/10]
     projects page         border border-ice-200 bg-white aspect-[16/10]
     news page             border border-ice-200 bg-white aspect-[16/9]

   Targeting `shadow-card` only reached the first two. What they all have in
   common is a bg-white container whose first child is an aspect-ratio box with
   overflow-hidden, so that is what these rules key on.

   The media curves at the top and stays square where it meets the body. The
   card carries the matching curve on all four corners, so the top follows the
   photo and the bottom closes off the body. */
[class*="bg-white"]:has(> [class*="aspect-"][class*="overflow-hidden"]:first-child),
[class*="border border-ice-200"]:has(> img[class*="aspect-"]:first-child) {
  border-radius: var(--dm-radius);
}

/* Media: curved at the top, square at the bottom, and a shallower crop.
   The build ships these at 4:3 (homepage services), 16:10 (homepage news,
   services page, projects page) and 16:9 (news page). Setting them all to 16:9
   trims the height and makes the grids consistent — 16:9 is already used on
   the site, so this is not a new proportion.

   Height against the shipped build, at the same card width:
     4:3   -> 16:9   25% shorter
     16:10 -> 16:9   10% shorter
     16:9  -> 16:9   unchanged

   The `:not([class*="aspect-auto"])` guard leaves the news page's featured
   article alone — it drops its ratio at lg to sit beside its text. */
[class*="bg-white"] > [class*="aspect-"][class*="overflow-hidden"]:first-child:not([class*="aspect-auto"]) {
  border-radius: var(--dm-radius) var(--dm-radius) 0 0;
  aspect-ratio: 16 / 9;
}

/* The homepage featured-projects card has no body — the media fills it, with
   the caption overlaid. Square media therefore means a square card. */
[class*="bg-navy-950"]:has(> img[class*="aspect-"]:first-child) {
  border-radius: var(--dm-radius) var(--dm-radius) 0 0;
}
[class*="bg-navy-950"] > img[class*="aspect-"]:first-child {
  border-radius: 0;
  aspect-ratio: 16 / 9;
}

/* ---------------------------------------------------------------------------
   4. Hairline grids
   Several sections are a grid of cells separated by 1px gaps showing the
   parent background. Rounding each cell would break the ruled-table effect,
   so the grid itself is rounded and clips its cells.
   --------------------------------------------------------------------------- */
[class*="grid"][class*="gap-px"][class*="border-ice-200"],
[class*="grid"][class*="gap-px"][class*="bg-ice-200"] {
  border-radius: var(--dm-radius);
  overflow: hidden;
}

/* ---------------------------------------------------------------------------
   5. Full-bleed artwork stays square
   Last so it wins on specificity ties.
   --------------------------------------------------------------------------- */
#top,
#top img,
#top [class*="overflow-hidden"],
#contact,
#contact > img,
section[class*="isolate"],
section[class*="isolate"] > img,
[class*="h-[100svh]"] {
  border-radius: 0;
}

/* Client logo strip — logos sit on white with no frame; a radius here reads as
   a mistake rather than a style. */
.logo-marquee-item img {
  border-radius: 0;
}