/*
 * KurdVisa v12.61 incremental Bento Layout Pass (layout release v1262)
 * Scope: homepage hero, featured destination/service grids, customer dashboard.
 * Progressive enhancement: no route, form, data, or authorization behavior depends on this file.
 */
:root{
  --bento-gap:clamp(.85rem,1.35vw,1.35rem);
  --bento-radius:clamp(20px,2vw,30px);
  --bento-border:color-mix(in srgb,var(--ui-ink,var(--kv-ink)) 12%,transparent);
  --bento-surface:color-mix(in srgb,var(--ui-surface,var(--kv-surface)) 78%,transparent);
  --bento-surface-strong:color-mix(in srgb,var(--ui-surface,var(--kv-surface)) 90%,transparent);
  --bento-highlight:color-mix(in srgb,#fff 44%,transparent);
  --bento-shadow:0 20px 55px rgba(15,23,42,.10),0 4px 14px rgba(15,23,42,.045);
  --bento-shadow-active:0 28px 72px rgba(15,23,42,.14),0 6px 18px rgba(15,23,42,.065);
}
html[data-theme="dark"]{
  --bento-border:color-mix(in srgb,#fff 14%,transparent);
  --bento-surface:color-mix(in srgb,var(--ui-surface,var(--kv-surface)) 68%,transparent);
  --bento-surface-strong:color-mix(in srgb,var(--ui-surface,var(--kv-surface)) 82%,transparent);
  --bento-highlight:color-mix(in srgb,#fff 11%,transparent);
  --bento-shadow:0 22px 62px rgba(0,0,0,.28),0 5px 16px rgba(0,0,0,.18);
  --bento-shadow-active:0 30px 82px rgba(0,0,0,.36),0 7px 22px rgba(0,0,0,.22);
}

/* Shared Glass 2.0 tile contract. The pointer hotspot is cosmetic only. */
html[data-layout-release="v1262"] :where(.bento-tile,.bento-pane,.bento-hero-search){
  --bento-pointer-x:50%;
  --bento-pointer-y:18%;
  position:relative;
  isolation:isolate;
  border-color:var(--bento-border);
}
html[data-layout-release="v1262"] :where(.bento-tile,.bento-pane,.bento-hero-search)::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  opacity:.72;
  background:
    radial-gradient(circle at var(--bento-pointer-x) var(--bento-pointer-y),color-mix(in srgb,var(--ui-accent,var(--kv-accent)) 14%,transparent),transparent 31%),
    linear-gradient(145deg,var(--bento-highlight),transparent 38%);
  transition:opacity 180ms ease;
}
html[data-layout-release="v1262"] :where(.bento-tile,.bento-pane,.bento-hero-search)>*{position:relative;z-index:1}
html[data-layout-release="v1262"] :where(.bento-tile,.bento-pane,.bento-hero-search)[data-bento-active]::before{opacity:1}

/* 1. Homepage hero: editorial 12-column Bento, with an overlapping search card. */
html[data-layout-release="v1262"] .bento-hero-section{position:relative;overflow:clip;isolation:isolate}
html[data-layout-release="v1262"] .bento-hero-grid{position:relative}
html[data-layout-release="v1262"] .bento-hero-grid::before{
  content:"";
  position:absolute;
  z-index:-1;
  width:clamp(180px,23vw,360px);
  aspect-ratio:1;
  inset-inline-start:42%;
  inset-block-start:8%;
  border:1px solid color-mix(in srgb,var(--ui-accent,var(--kv-accent)) 22%,transparent);
  border-radius:44% 56% 63% 37% / 48% 39% 61% 52%;
  rotate:-8deg;
  opacity:.48;
}
html[data-layout-release="v1262"] .bento-hero-copy{position:relative;z-index:2}
html[data-layout-release="v1262"] .bento-hero-copy h1{max-width:12ch;text-wrap:balance}
html[data-layout-release="v1262"] .bento-hero-experience{position:relative;z-index:1;min-width:0}
html[data-layout-release="v1262"] .bento-hero-media{
  box-shadow:0 34px 90px rgba(0,0,0,.25);
  transform-origin:58% 68%;
}
html[data-layout-release="v1262"] .bento-hero-search{
  background:linear-gradient(145deg,var(--bento-highlight),transparent 40%),var(--bento-surface-strong);
  border:1px solid var(--bento-border);
  box-shadow:var(--bento-shadow-active);
  backdrop-filter:blur(var(--human-glass-blur,22px)) saturate(var(--human-glass-saturate,1.18));
  -webkit-backdrop-filter:blur(var(--human-glass-blur,22px)) saturate(var(--human-glass-saturate,1.18));
}
html[data-layout-release="v1262"] .bento-proof-grid>div{
  background:linear-gradient(145deg,color-mix(in srgb,#fff 9%,transparent),transparent 55%),rgba(255,255,255,.045);
  box-shadow:0 12px 34px rgba(0,0,0,.10);
}

@media (min-width:1100px){
  html[data-layout-release="v1262"][data-composition="human"] .bento-hero-grid{
    display:grid;
    grid-template-columns:repeat(12,minmax(0,1fr));
    gap:clamp(1.25rem,2.4vw,2.6rem);
    align-items:start;
  }
  html[data-layout-release="v1262"][data-composition="human"] .bento-hero-copy{
    grid-column:1/span 7;
    padding-block-start:clamp(1.6rem,4.4vw,4.8rem);
    margin-inline-start:clamp(0px,1.6vw,24px);
  }
  html[data-layout-release="v1262"][data-composition="human"] .bento-hero-experience{
    grid-column:8/-1;
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:0 var(--bento-gap);
    padding:0;
    min-height:0;
    margin-inline-end:clamp(0px,1.5vw,22px);
  }
  html[data-layout-release="v1262"][data-composition="human"] .bento-hero-experience::before{
    inset:1.1rem -.6rem 4.5rem .7rem;
    border-radius:34px;
    rotate:2.1deg;
  }
  html[data-layout-release="v1262"][data-composition="human"] .bento-hero-media{
    position:relative!important;
    inset:auto!important;
    grid-column:1/-1;
    min-height:clamp(390px,36vw,470px);
    margin:0;
    border-radius:clamp(24px,2.4vw,34px);
    rotate:.45deg;
  }
  html[data-layout-release="v1262"][data-composition="human"] .bento-hero-search{
    position:relative!important;
    inset:auto!important;
    bottom:auto!important;
    grid-column:2/-1;
    width:auto;
    margin-top:clamp(-82px,-5.7vw,-58px);
    margin-inline-end:clamp(-10px,-.7vw,-2px);
    border-radius:24px;
  }
  html[data-layout-release="v1262"][data-composition="human"] .bento-proof-grid{
    grid-template-columns:repeat(6,minmax(0,1fr));
    max-width:720px;
  }
  html[data-layout-release="v1262"][data-composition="human"] .bento-proof-grid>div:nth-child(1),
  html[data-layout-release="v1262"][data-composition="human"] .bento-proof-grid>div:nth-child(2){grid-column:span 3}
  html[data-layout-release="v1262"][data-composition="human"] .bento-proof-grid>div:nth-child(3){grid-column:2/span 4}
}

/* 2. Featured destination + service grids: explicit source-order Bento roles. */
html[data-layout-release="v1262"] :where(.bento-destination-grid,.bento-service-grid){align-items:stretch}
html[data-layout-release="v1262"] :where(.bento-destination-card,.bento-service-card){
  background:
    radial-gradient(circle at var(--bento-pointer-x) var(--bento-pointer-y),color-mix(in srgb,var(--ui-primary,var(--kv-brand)) 9%,transparent),transparent 34%),
    linear-gradient(145deg,var(--bento-highlight),transparent 42%),
    var(--bento-surface);
  border:1px solid var(--bento-border);
  box-shadow:var(--bento-shadow);
  backdrop-filter:blur(var(--human-glass-blur,22px)) saturate(var(--human-glass-saturate,1.18));
  -webkit-backdrop-filter:blur(var(--human-glass-blur,22px)) saturate(var(--human-glass-saturate,1.18));
}
html[data-layout-release="v1262"] :where(.bento-destination-card,.bento-service-card):hover{box-shadow:var(--bento-shadow-active)}
html[data-layout-release="v1262"] .bento-destination-card .destination-watermark{opacity:.09;font-size:clamp(3.3rem,6vw,6.5rem)}
html[data-layout-release="v1262"] .bento-service-card .service-number{font-variant-numeric:tabular-nums}
html[data-layout-release="v1262"] .bento-role-feature{--bento-role-accent:color-mix(in srgb,var(--ui-accent,var(--kv-accent)) 22%,transparent)}
html[data-layout-release="v1262"] .bento-role-wide{--bento-role-accent:color-mix(in srgb,var(--ui-primary,var(--kv-brand)) 16%,transparent)}
html[data-layout-release="v1262"] :where(.bento-role-feature,.bento-role-wide)::after{filter:saturate(1.06)}

@media (min-width:960px){
  html[data-layout-release="v1262"][data-composition="human"] .bento-destination-grid,
  html[data-layout-release="v1262"][data-composition="human"] .bento-service-grid{
    display:grid;
    grid-template-columns:repeat(12,minmax(0,1fr));
    grid-auto-flow:row;
    gap:var(--bento-gap);
  }
  html[data-layout-release="v1262"][data-composition="human"] .bento-destination-card[data-bento-role="feature"]{grid-column:span 5;min-height:270px}
  html[data-layout-release="v1262"][data-composition="human"] .bento-destination-card[data-bento-role="compact"]{grid-column:span 3;min-height:210px}
  html[data-layout-release="v1262"][data-composition="human"] .bento-destination-card[data-bento-role="medium"]{grid-column:span 4;min-height:232px}
  html[data-layout-release="v1262"][data-composition="human"] .bento-destination-card[data-bento-role="wide"]{grid-column:span 5;min-height:238px}
  html[data-layout-release="v1262"][data-composition="human"] .bento-destination-card[data-bento-role="panorama"]{grid-column:span 7;min-height:238px}

  html[data-layout-release="v1262"][data-composition="human"] .bento-service-card[data-bento-role="feature"]{grid-column:span 5;min-height:286px}
  html[data-layout-release="v1262"][data-composition="human"] .bento-service-card[data-bento-role="compact"]{grid-column:span 3;min-height:238px}
  html[data-layout-release="v1262"][data-composition="human"] .bento-service-card[data-bento-role="medium"]{grid-column:span 4;min-height:258px}
  html[data-layout-release="v1262"][data-composition="human"] .bento-service-card[data-bento-role="wide"]{grid-column:span 5;min-height:278px}
}

/* 3. Customer dashboard: functional Bento hierarchy, not decorative reordering. */
html[data-layout-release="v1262"] .account-main-bento{container-type:inline-size;container-name:customer-dashboard}
html[data-layout-release="v1262"] .bento-command-center{gap:var(--bento-gap)}
html[data-layout-release="v1262"] .bento-command-main,
html[data-layout-release="v1262"] .bento-command-score,
html[data-layout-release="v1262"] .bento-command-context>div{
  border:1px solid rgba(255,255,255,.11);
  box-shadow:0 20px 54px rgba(3,20,17,.18);
  backdrop-filter:blur(var(--human-glass-blur,22px));
  -webkit-backdrop-filter:blur(var(--human-glass-blur,22px));
}
html[data-layout-release="v1262"] .bento-command-main{
  overflow:hidden;
  border-radius:var(--bento-radius);
  background:
    radial-gradient(circle at 82% 20%,rgba(226,201,135,.16),transparent 31%),
    linear-gradient(135deg,#092b24,#0b503f);
}
html[data-layout-release="v1262"] .bento-command-score{
  border-radius:var(--bento-radius);
  background:linear-gradient(145deg,rgba(255,255,255,.10),rgba(255,255,255,.055));
}
html[data-layout-release="v1262"] .bento-command-context>div{border-radius:18px;background:rgba(255,255,255,.07)}
html[data-layout-release="v1262"] .bento-overview-grid{gap:var(--bento-gap)}
html[data-layout-release="v1262"] .bento-overview-card{
  min-height:164px;
  border-radius:22px;
  background:linear-gradient(145deg,var(--bento-highlight),transparent 44%),var(--bento-surface-strong);
  border:1px solid var(--bento-border);
  box-shadow:var(--bento-shadow);
  backdrop-filter:blur(var(--human-glass-blur,22px));
  -webkit-backdrop-filter:blur(var(--human-glass-blur,22px));
}
html[data-layout-release="v1262"] .bento-overview-card.overview-card-primary{
  background:radial-gradient(circle at 85% 16%,rgba(255,255,255,.14),transparent 30%),linear-gradient(140deg,var(--ui-primary,var(--kv-brand)),var(--ui-secondary,var(--kv-brand-2)));
  border-color:color-mix(in srgb,#fff 17%,transparent);
}
html[data-layout-release="v1262"] .bento-overview-card>strong{font-size:clamp(2.25rem,4vw,3.25rem)}
html[data-layout-release="v1262"] .bento-resume-card{
  border-radius:24px;
  background:linear-gradient(145deg,var(--bento-highlight),transparent 42%),var(--bento-surface-strong);
  border-color:var(--bento-border);
  box-shadow:var(--bento-shadow);
  backdrop-filter:blur(var(--human-glass-blur,22px));
  -webkit-backdrop-filter:blur(var(--human-glass-blur,22px));
}

@container customer-dashboard (min-width:850px){
  html[data-layout-release="v1262"] .bento-command-center{
    display:grid;
    grid-template-columns:repeat(12,minmax(0,1fr));
    grid-template-rows:auto auto;
    padding:0;
    border:0;
    background:transparent;
    box-shadow:none;
    overflow:visible;
  }
  html[data-layout-release="v1262"] .bento-command-center::after{display:none}
  html[data-layout-release="v1262"] .bento-command-main{grid-column:1/span 7;grid-row:1/span 2;padding:clamp(24px,3vw,36px);min-height:300px}
  html[data-layout-release="v1262"] .bento-command-score{grid-column:8/-1;grid-row:1;display:flex;flex-direction:row;justify-content:flex-start;align-items:center;gap:1rem;text-align:start;padding:18px 22px;border:1px solid rgba(255,255,255,.11)}
  html[data-layout-release="v1262"] .bento-command-score small{max-width:24ch;margin:0}
  html[data-layout-release="v1262"] .bento-command-context{grid-column:8/-1;grid-row:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;align-content:stretch}
  html[data-layout-release="v1262"] .bento-command-context>div{grid-template-columns:32px minmax(0,1fr);padding:12px;min-width:0}
  html[data-layout-release="v1262"] .bento-command-context>div>span{width:32px;height:32px}

  html[data-layout-release="v1262"] .bento-overview-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr))}
  html[data-layout-release="v1262"] .bento-overview-lead{grid-column:span 5;min-height:198px}
  html[data-layout-release="v1262"] .bento-overview-docs{grid-column:span 3}
  html[data-layout-release="v1262"] .bento-overview-messages{grid-column:span 2}
  html[data-layout-release="v1262"] .bento-overview-appointments{grid-column:span 2}
  html[data-layout-release="v1262"] .bento-overview-messages:last-child{grid-column:span 4}

  html[data-layout-release="v1262"] .bento-resume-card{display:grid;grid-template-columns:minmax(0,7fr) minmax(260px,5fr);gap:clamp(1.25rem,2.4vw,2.6rem);padding:clamp(22px,2.4vw,30px)}
}

/* Intermediate tablet layout keeps hierarchy but avoids cramped 12-column cards. */
@media (min-width:700px) and (max-width:1099px){
  html[data-layout-release="v1262"] .bento-hero-experience{max-width:720px;margin-inline:auto}
  html[data-layout-release="v1262"] .bento-destination-grid,
  html[data-layout-release="v1262"] .bento-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  html[data-layout-release="v1262"] :where(.bento-destination-card,.bento-service-card){grid-column:auto!important;min-height:220px!important}
}

/* Mobile: Bento becomes a clear single-column information hierarchy. */
@media (max-width:699px){
  html[data-layout-release="v1262"] .bento-hero-grid::before{display:none}
  html[data-layout-release="v1262"] .bento-hero-copy h1{max-width:none}
  html[data-layout-release="v1262"] .bento-proof-grid{grid-template-columns:1fr}
  html[data-layout-release="v1262"] .bento-proof-grid>div{grid-column:auto!important}
  html[data-layout-release="v1262"] .bento-hero-experience{display:grid;gap:.8rem;padding:0}
  html[data-layout-release="v1262"] .bento-hero-media{position:relative!important;inset:auto!important;min-height:330px}
  html[data-layout-release="v1262"] .bento-hero-search{position:relative!important;inset:auto!important;margin:-38px 12px 0;border-radius:20px}
  html[data-layout-release="v1262"] :where(.bento-destination-grid,.bento-service-grid,.bento-overview-grid){grid-template-columns:1fr!important}
  html[data-layout-release="v1262"] :where(.bento-destination-card,.bento-service-card,.bento-overview-card){grid-column:auto!important;min-height:auto!important}
  html[data-layout-release="v1262"] .bento-command-center{padding:0;background:transparent;box-shadow:none;border:0;overflow:visible}
  html[data-layout-release="v1262"] .bento-command-center::after{display:none}
  html[data-layout-release="v1262"] .bento-command-main{padding:22px;border-radius:22px}
  html[data-layout-release="v1262"] .bento-command-score{padding:18px;border-radius:20px;background:linear-gradient(135deg,#0a332a,#0b493b);border:1px solid rgba(255,255,255,.11)}
  html[data-layout-release="v1262"] .bento-command-context{grid-template-columns:1fr}
  html[data-layout-release="v1262"] .bento-resume-card{grid-template-columns:1fr}
}

/* Accessibility/sustainability overrides always win over glass or tactile novelty. */
@media (prefers-reduced-transparency:reduce){
  html[data-layout-release="v1262"] :where(.bento-tile,.bento-pane,.bento-hero-search){backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  html[data-layout-release="v1262"] :where(.bento-destination-card,.bento-service-card,.bento-overview-card,.bento-resume-card,.bento-hero-search){background:var(--ui-surface,var(--kv-surface))}
}
@media (prefers-reduced-motion:reduce){
  html[data-layout-release="v1262"] :where(.bento-tile,.bento-pane,.bento-hero-media){rotate:0deg!important;translate:none!important;scale:1!important;transition:none!important}
}
@media (forced-colors:active){
  html[data-layout-release="v1262"] :where(.bento-tile,.bento-pane,.bento-hero-search){background:Canvas!important;border:1px solid CanvasText!important;box-shadow:none!important;backdrop-filter:none!important}
  html[data-layout-release="v1262"] :where(.bento-tile,.bento-pane,.bento-hero-search)::before{display:none!important}
}
html[data-contrast="high"] :where(.bento-tile,.bento-pane,.bento-hero-search){backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;border:2px solid currentColor}