/* =========================================================
   Seabird Law — desktop.css (≥1024px)
   Enhancements ONLY; mobile lives in core.css
   ========================================================= */

@media (min-width: 1024px) {

  /* -------- Layout & Typography scale -------- */
  .container { max-width: 1200px; padding-inline: 24px; }
  section { padding: 72px 0; }

  .section-head h2 {
    font-size: clamp(1.7rem, 2.2vw, 2.2rem);
    letter-spacing: .2px;
  }

  /* -------- Hide mobile-only UI -------- */
  .actionbar { display: none !important; }
  .mobile-panel, .overlay { display: none !important; }
  .hide-on-mobile { display: inline-flex !important; }

  /* -------- Header / Navigation -------- */
  .nav {
    gap: 1rem;
    padding: .75rem 0;      /* slimmer desktop header */
    flex-wrap: nowrap;      /* keep on one line */
  }

  /* Sticky header elevated state (added by JS) */
  .site-header.is-scrolled {
    box-shadow: 0 10px 28px rgba(0,0,0,.18);
    backdrop-filter: saturate(160%) blur(8px);
  }

  /* Larger SVG logo on desktop */
  .brand__logo-img {
    inline-size: auto;
    block-size: 40px;
    margin-right: .6rem;
    filter: drop-shadow(0 4px 12px rgba(0,0,0,.22));
  }
  .brand--footer .brand__logo-img {
    block-size: 32px;
    margin-right: .5rem;
  }

  /* show primary links */
  .nav__links {
    display: flex;
    align-items: center;
    gap: .6rem;
    margin-left: 12px;
    flex-wrap: nowrap;
    min-width: 0;           /* allows flex shrink properly */
  }
  .nav__links .navlink {
    color: var(--tint);
    font-weight: 700;
    font-size: .98rem;
    opacity: .92;
    padding: .55rem .75rem;
    border-radius: 10px;
    position: relative;
    text-decoration: none;
    transition: opacity .2s ease;
    white-space: nowrap;    /* stop 'Why Us' from breaking */
  }
  .nav__links .navlink:hover { opacity: 1; }

  /* underline on hover/active */
  .nav__links .navlink::after {
    content:""; position:absolute; left:.6rem; right:.6rem; bottom:.2rem;
    height: 0; background:rgba(201,162,75,.8); border-radius:2px; transition:height .2s ease;
  }
  .nav__links .navlink:hover::after,
  .nav__links .navlink.active::after,
  .nav__links .navlink[aria-current="page"]::after { height: 2px; }

  /* caret button styling (Practice Areas) */
  .nav__links .navlink.has-caret {
    display: inline-flex; align-items: center; gap: .5rem;
  }
  .nav__links .navlink .caret {
    inline-size: 9px; block-size: 9px; border: 2px solid currentColor;
    border-left: 2px solid transparent; border-top: 2px solid transparent;
    transform: rotate(45deg) translateY(-1px); transform-origin: 50% 50%;
    opacity: .9; transition: transform .2s ease, opacity .2s ease;
  }
  .nav__item--drop.open .navlink .caret,
  .nav__item--drop:hover .navlink .caret {
    transform: rotate(225deg) translateY(1px);
    opacity: 1;
  }

  /* menu button hidden on desktop */
  .menu-btn { display: none; }

  /* -------- Mega menu (Practice Areas) — improved -------- */
  .nav__item--drop { position: relative; }
  .nav__item--drop::after{
    content:"";
    position:absolute; left:0; right:0; top:100%;
    height:14px; /* hover buffer */
  }

  .drop-panel {
    position: absolute;
    left: 0;
    top: 100%;
    width: min(820px, 92vw);
    background: linear-gradient(180deg, rgba(10,26,27,.96), rgba(14,63,51,.9));
    color: var(--tint);
    border: 1px solid rgba(236,245,241,.16);
    border-radius: 14px;
    box-shadow: 0 24px 48px rgba(0,0,0,.32);
    padding: 14px;
    display: grid;
    grid-template-columns: repeat(3, minmax(240px, 1fr));
    gap: 12px 14px;
    opacity: 0; transform: translateY(8px);
    pointer-events: none;
    transition: opacity .18s ease, transform .18s ease;
    z-index: 60;
  }
  .nav__item--drop:hover .drop-panel,
  .nav__item--drop.open .drop-panel {
    opacity: 1; transform: translateY(0); pointer-events: auto;
  }

  .drop-item {
    display: block;
    padding: 12px 12px;
    border-radius: 12px;
    color: var(--tint);
    text-decoration: none;
    line-height: 1.35;
    background: transparent;
    transition: background .18s ease, transform .18s ease;
  }
  .drop-item:hover { background: rgba(236,245,241,.08); transform: translateY(-1px); }
  .drop-item b{ display:block; font-weight:800; letter-spacing:.2px; margin-bottom:2px; }
  .drop-item small{ display:block; color:#cfddd5; opacity:.9; }
  .drop-item:focus-visible { outline: 2px solid rgba(201,162,75,.85); outline-offset: 2px; }

  /* -------- HEADER CTA NORMALIZATION -------- */
  .nav__cta { display:flex; align-items:center; gap:10px; margin-left:auto; flex-wrap: nowrap; }
  .nav__cta .btn{
    height: 42px;
    padding: 0 16px;
    white-space: nowrap;
  }
  .nav__cta .btn.btn--ghost {
    background: #e6f1ec; color: #0b4f3f; border-color: #c8ded3;
  }
  .nav__cta .btn.btn--ghost:hover { background: #dbe8e1; }
  .nav__cta .btn--ghost.hide-on-mobile{ display: none !important; }

  /* Optional: tiny styled dot separators */
  .nav__links .dot{
    display:inline-block; width:4px; height:4px; border-radius:999px;
    background:rgba(201,162,75,.45); transform:translateY(2px); margin:0 6px;
  }

  /* -------- Hero (two-column, premium) -------- */
  .hero { padding-top: 96px; padding-bottom: 110px; }
  .hero__bg { height: 480px; opacity: .32; }

  .hero__grid {
    display: grid;
    grid-template-columns: 1.25fr .75fr;
    gap: 40px;
    align-items: center;
  }

  .hero__content h1 {
    font-size: clamp(2.6rem, 4.2vw, 3.4rem);
    line-height: 1.18;
    max-width: 18ch;
  }
  .hero .lead { font-size: 1.125rem; max-width: 60ch; }
  .actions .btn { flex: 0 0 auto; }
  .actions .btn + .btn { margin-left: .4rem; }

  /* Keep SVG logos crisp and a touch larger on desktop */
  .logo-row { gap: 22px; }
  .logo-row img { height: auto; }
  .logo--sm { inline-size: 40px; block-size: 40px; }
  .logo--md { inline-size: 48px; block-size: 48px; }

  /* glass contact card refinement */
  .card--glass { padding: 18px; }
  .contact-lines { gap: .7rem; }
  .hero-media img { aspect-ratio: 4/3; }
  .hero-media:hover img { transform: scale(1.03); transition: transform .6s cubic-bezier(.2,.8,.4,1); }

  /* -------- Cards & Grids -------- */
  .cards        { grid-template-columns: repeat(3, minmax(280px, 1fr)); gap: 20px; }
  .results      { grid-template-columns: repeat(3, minmax(280px, 1fr)); gap: 20px; }
  .why          { grid-template-columns: repeat(3, minmax(280px, 1fr)); gap: 18px; }
  .team         { grid-template-columns: repeat(3, minmax(280px, 1fr)); gap: 18px; }
  .testis       { grid-template-columns: repeat(3, minmax(280px, 1fr)); gap: 18px; }

  /* elevate on hover */
  .card, .why__item, .quote {
    transition: transform .3s cubic-bezier(.2,.8,.4,1), box-shadow .3s cubic-bezier(.2,.8,.4,1);
  }
  .card:hover, .why__item:hover, .quote:hover {
    transform: translateY(-6px);
    box-shadow: 0 15px 35px rgba(11,79,63,.14);
  }

  /* -------- Horizontal media scroller → desktop gallery grid -------- */
  #gallery .scroll-x {
    overflow: visible; padding-bottom: 0;
    display: grid; grid-template-columns: repeat(4, minmax(240px, 1fr)); gap: 18px;
  }
  #gallery .card--media { min-width: 0; }

  /* -------- FAQ refinement -------- */
  .faq-list details { padding: 16px 18px; }
  .faq-list summary { font-size: 1rem; }

  /* -------- Contact / booking -------- */
  .contact-grid {
    grid-template-columns: 1.1fr .9fr;
    align-items: start; gap: 20px;
  }

  /* -------- Footer layout -------- */
  .footgrid {
    grid-template-columns: repeat(4, minmax(220px, 1fr));
    gap: 24px;
  }

  /* -------- Subtle scroll-in timing (stagger) -------- */
  .cards.is-visible .card:nth-child(1),
  .why.is-visible   .why__item:nth-child(1),
  .testis.is-visible .quote:nth-child(1) { transition-delay: .05s; }
  .cards.is-visible .card:nth-child(2),
  .why.is-visible   .why__item:nth-child(2),
  .testis.is-visible .quote:nth-child(2) { transition-delay: .12s; }
  .cards.is-visible .card:nth-child(3),
  .why.is-visible   .why__item:nth-child(3),
  .testis.is-visible .quote:nth-child(3) { transition-delay: .18s; }

  /* -------- Nice details -------- */
  .btn--primary:hover { transform: translateY(-2px); }
  .btn--ghost:hover   { transform: translateY(-2px); }

  /* ===== MICRO-CTAs (used below sections) ===== */
  .section-cta{
    margin-top: 12px; color:#cfded6; font-weight:700;
  }
  .section-cta.right{ text-align:right; }
  .section-cta .sep{ margin: 0 .5rem; opacity:.6; }
  .link-cta{
    color:var(--tint); text-decoration:none;
    border-bottom: 1px solid rgba(201,162,75,.6); padding-bottom: 2px;
  }
  .link-cta:hover{ border-color:rgba(201,162,75,.85); }

  /* ===== Desktop slim sticky CTA bar ===== */
  .cta-bar-desktop{
    position: fixed; left:0; right:0; bottom:18px; z-index:70;
    pointer-events:none; /* only children clickable */
  }
  .cta-bar__row{
    display:flex; align-items:center; justify-content:space-between;
    gap: 12px; padding: 10px 14px;
    background: linear-gradient(135deg,#0b4f3f,#0e3f33);
    color:var(--tint); border:1px solid rgba(236,245,241,.2);
    border-radius: 14px; box-shadow: 0 18px 42px rgba(11,79,63,.32);
    pointer-events:auto;
  }
  .cta-bar__line{ font-weight:800; letter-spacing:.2px; }
  .cta-bar-desktop[hidden]{ display:none !important; }

  /* ===== EXTRA POLISH ===== */
  .nav__cta .btn { height: 40px; line-height: 40px; padding: 0 14px; }
  .nav__links .dot{ width:3.5px; height:3.5px; background:rgba(201,162,75,.45); transform:translateY(1.5px); }
  .nav__links .navlink:hover{ text-decoration: underline; text-underline-offset:6px; }
  .nav__links .navlink[aria-current="page"]::after{ height:2px; background:var(--accent); }
}

/* ------------------------------
   VISIBILITY FIX — strong links on light sections (desktop too)
------------------------------ */
@media (min-width: 1024px) {
  .section-cta { color: #2f4c41 !important; }
  .section-cta a,
  .section-foot a {
    color: #0b4f3f !important;
    font-weight: 800;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
    opacity: 1 !important;
  }
  .section-cta .sep { color: rgba(201,162,75,.8) !important; opacity: 1; }
  .section-cta .link-cta { border-bottom-color: rgba(201,162,75,.8) !important; }

  /* Ensure generic inline links stay dark on light rows */
  .section-head p a,
  .card p a,
  .quote a { color: #0b4f3f !important; opacity: 1 !important; }
}

/* ===== Desktop overrides that neutralize mobile-only styles ===== */
@media (min-width:1024px){
  /* remove mobile actionbar spacing on desktop */
  body { padding-bottom: 0 !important; }

  /* footer bottom padding returns to normal (no actionbar on desktop) */
  .site-footer { padding-bottom: 32px !important; }

  /* hide mobile-only UI hard */
  .actionbar { display: none !important; }
  .mobile-panel, .overlay { display: none !important; }

  /* show header CTAs that are hidden on mobile */
  .hide-on-mobile { display: inline-flex !important; }
}

/* =========================================================
   Custom desktop enhancements
   - Dismiss button for sticky CTA bar
   - Improved contrast for glass card links
   ========================================================= */

@media (min-width: 1024px) {
  /* style for the close/dismiss button in sticky CTA bar */
  .cta-bar__close {
    background: transparent;
    border: none;
    color: var(--tint);
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
    padding: 0 .5rem;
  }
  .cta-bar__close:hover {
    color: #ffffff;
  }

  /* improve contrast for links inside glass cards */
  .card--glass .contact-lines a {
    color: #ffffff;
    text-decoration: underline;
  }
}
