/* NNB GIDA V307 — ULTRA LUXE BLACK & WHITE PRO
   No added overview block. Full-home polish with monochrome luxury language. */
:root{
  --v307-ink:#0a0a0b;
  --v307-deep:#111214;
  --v307-paper:#ffffff;
  --v307-soft:#f4f4f5;
  --v307-line:rgba(14,16,18,.07);
  --v307-line-strong:rgba(14,16,18,.12);
  --v307-muted:#74767b;
}
html,body{max-width:100%;overflow-x:hidden!important}
body{
  background:
    radial-gradient(circle at 50% -15%,rgba(255,255,255,.92),transparent 34%),
    linear-gradient(180deg,#f2f2f4 0%,#f5f5f6 32%,#f7f7f8 100%)!important;
  color:var(--v307-ink)!important;
}

/* Top bar */
body .apple-topbar{
  position:sticky!important;top:0!important;z-index:16!important;
  height:60px!important;margin:0 -2px 14px!important;padding:0 4px!important;
  grid-template-columns:52px 1fr 52px!important;
  background:rgba(244,244,246,.74)!important;
  border-bottom:1px solid rgba(255,255,255,.56)!important;
  box-shadow:0 10px 24px rgba(18,20,22,.04)!important;
  backdrop-filter:blur(18px) saturate(1.08)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.08)!important;
}
body .iconbtn{
  width:44px!important;height:44px!important;border-radius:999px!important;
  background:linear-gradient(180deg,#ffffff,#f5f5f6)!important;
  border:1px solid rgba(255,255,255,.74)!important;
  box-shadow:0 10px 22px rgba(17,20,22,.06),inset 0 1px 0 rgba(255,255,255,.98)!important;
  color:#141618!important;
}
body .center-mark{
  width:50px!important;height:50px!important;border-radius:50%!important;
  background:linear-gradient(180deg,#ffffff,#f5f5f6)!important;
  border:1px solid rgba(255,255,255,.76)!important;
  box-shadow:0 12px 26px rgba(18,20,22,.07),inset 0 1px 0 rgba(255,255,255,.98)!important;
}
body .center-mark img{width:39px!important;height:39px!important}
body .topbar-label{opacity:0!important;pointer-events:none!important}

/* Banner stage */
body .apple-hero-banner{
  display:block!important;
  margin:0 0 18px!important;
  padding:10px!important;
  border-radius:34px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.84),rgba(248,248,249,.96))!important;
  border:1px solid rgba(255,255,255,.76)!important;
  box-shadow:0 24px 52px rgba(16,19,22,.06),inset 0 1px 0 rgba(255,255,255,.98)!important;
}
body .apple-hero-banner .apple-hero-visual{
  position:relative!important;
  min-height:220px!important;
  border-radius:26px!important;
  background:#f2f2f4!important;
  overflow:hidden!important;
}
body .apple-hero-banner .apple-hero-visual:before{
  content:""!important;position:absolute!important;inset:0!important;pointer-events:none!important;
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,0))!important;z-index:1!important;
}
body .apple-hero-banner .apple-hero-visual:after{
  content:""!important;position:absolute!important;left:18px!important;right:18px!important;bottom:14px!important;height:18px!important;
  border-radius:999px!important;background:linear-gradient(180deg,rgba(24,27,30,.2),rgba(24,27,30,0))!important;filter:blur(10px)!important;opacity:.24!important;pointer-events:none!important;
}
body .apple-hero-banner .apple-hero-visual img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important}

/* Tools dock */
body .apple-tools{
  margin:0 0 18px!important;padding:10px!important;border-radius:30px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(249,249,250,.96))!important;
  border:1px solid rgba(255,255,255,.74)!important;
  box-shadow:0 22px 46px rgba(16,19,22,.06),inset 0 1px 0 rgba(255,255,255,.98)!important;
  backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important;
}
body .search,body .apple-search{
  height:58px!important;border-radius:20px!important;
  background:linear-gradient(180deg,#ffffff,#fbfbfc)!important;
  border:1px solid rgba(14,16,18,.055)!important;
  box-shadow:0 10px 24px rgba(14,16,18,.03),inset 0 1px 0 rgba(255,255,255,.98)!important;
}
body .search svg,body .apple-search svg{stroke:#7b7e84!important}
body .search input::placeholder,body .apple-search input::placeholder{color:#a5a8ad!important;font-weight:700!important}
body .chips{
  min-height:62px!important;margin-top:10px!important;padding:7px!important;gap:9px!important;
  border-radius:24px!important;
  background:linear-gradient(180deg,#151618,#070809)!important;
  border:1px solid rgba(255,255,255,.08)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 14px 28px rgba(10,12,14,.10)!important;
}
body .chips:after{content:"";flex:0 0 10px}
body .chip{
  min-height:46px!important;padding:0 15px!important;border-radius:17px!important;
  border:1px solid rgba(255,255,255,.08)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03))!important;
  color:rgba(255,255,255,.86)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)!important;
  font-size:12px!important;font-weight:900!important;
}
body .chip small{border-radius:999px!important;background:rgba(255,255,255,.11)!important;color:rgba(255,255,255,.75)!important}
body .chip.active{
  background:linear-gradient(180deg,#ffffff,#eeeeef)!important;color:#0d0e10!important;
  border-color:rgba(255,255,255,.95)!important;box-shadow:0 10px 22px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.98)!important;
}
body .chip.active small{background:#101214!important;color:#fff!important}

/* Section heading */
body .section-head{
  position:relative!important;min-height:64px!important;margin:8px 4px 14px!important;padding:0 2px 15px!important;
  border-bottom:1px solid var(--v307-line)!important;
}
body .section-head:after{content:""!important;position:absolute!important;left:2px!important;bottom:-1px!important;width:76px!important;height:4px!important;border-radius:999px!important;background:linear-gradient(90deg,#0c0d0f,#2d3135)!important}
body .section-kicker{color:#70747a!important;font-size:9px!important;line-height:1!important;font-weight:900!important;letter-spacing:.24em!important}
body .section-head h1,body .section-head h2{max-width:calc(100vw - 140px)!important;margin-top:7px!important;color:#0b0c0d!important;font-size:33px!important;line-height:.92!important;font-weight:950!important;letter-spacing:-.075em!important}
body #count{min-width:72px!important;min-height:36px!important;padding:0 14px!important;border-radius:14px!important;background:linear-gradient(180deg,#141618,#08090b)!important;color:#fff!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 10px 20px rgba(0,0,0,.10)!important;font-size:9px!important;letter-spacing:.14em!important}

/* Cards */
body #grid{gap:16px!important}
body #grid>.card{
  border-radius:28px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(252,252,253,.98))!important;
  border:1px solid rgba(255,255,255,.72)!important;
  box-shadow:0 22px 54px rgba(16,19,21,.07),0 3px 12px rgba(16,19,21,.03),inset 0 1px 0 rgba(255,255,255,.98)!important;
}
body #grid>.card:hover{transform:translateY(-3px)!important}
body #grid .card-visual{margin:10px 10px 0!important;border-radius:22px 22px 18px 18px!important;background:radial-gradient(circle at 50% 10%,rgba(255,255,255,1) 0,rgba(255,255,255,1) 14%,rgba(255,255,255,.56) 38%,transparent 62%),linear-gradient(180deg,#fbfbfc 0%,#f7f7f8 70%,#f1f1f3 100%)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.98),inset 0 -16px 22px rgba(16,18,20,.018)!important}
body #grid .card-visual:before{content:""!important;position:absolute!important;left:50%!important;top:12px!important;width:58%!important;height:5px!important;transform:translateX(-50%)!important;border-radius:999px!important;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.98),rgba(255,255,255,0))!important;box-shadow:0 10px 22px rgba(255,255,255,.86)!important}
body #grid .card-visual:after{content:""!important;position:absolute!important;left:18%!important;right:18%!important;bottom:16px!important;height:4px!important;border-radius:999px!important;background:linear-gradient(90deg,rgba(208,211,216,.18),rgba(160,164,170,.72),rgba(208,211,216,.18))!important;box-shadow:0 12px 20px rgba(12,15,18,.12)!important}
body #grid .card-visual img{padding:14px 12px 24px!important;filter:drop-shadow(0 16px 20px rgba(14,16,18,.09))!important}
body #grid .card-body{padding:13px 14px 14px!important;min-height:110px!important;background:transparent!important}
body #grid .cat{color:#7a7d83!important;font-size:8px!important;letter-spacing:.18em!important}
body #grid .card-weight{min-height:20px!important;padding:0 9px!important;border-radius:999px!important;background:linear-gradient(180deg,#141618,#090a0b)!important;color:#fff!important;font-size:7.6px!important;letter-spacing:.05em!important}
body #grid .name{font-size:15px!important;line-height:1.03!important;letter-spacing:-.055em!important;min-height:44px!important;max-height:44px!important}
body #grid .card-foot{padding-top:10px!important;border-top:1px solid rgba(15,18,20,.06)!important}
body #grid .card-brand{color:#8b8e94!important;font-size:7.8px!important;letter-spacing:.2em!important}
body #grid .card-arrow{width:28px!important;height:28px!important;border-radius:999px!important;background:linear-gradient(180deg,#121416,#090a0b)!important;color:#fff!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 8px 16px rgba(0,0,0,.08)!important}

/* Footer and drawer */
body .signature-footer{margin-top:28px!important;padding:28px 20px 34px!important;border-radius:32px!important;background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(249,249,250,.96))!important;border:1px solid rgba(255,255,255,.74)!important;box-shadow:0 24px 54px rgba(16,19,22,.06),inset 0 1px 0 rgba(255,255,255,.98)!important}
body .signature-logo{width:48px!important;height:48px!important;border-radius:50%!important;box-shadow:0 12px 24px rgba(16,19,22,.08)!important}
body .signature-name{margin-top:10px!important;color:#111315!important;font-size:18px!important;font-weight:950!important;letter-spacing:.06em!important}
body .signature-role{color:#73767b!important;font-size:11px!important;font-weight:700!important;letter-spacing:.04em!important}
body .signature-link{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:36px!important;padding:0 14px!important;border-radius:999px!important;background:#111315!important;color:#fff!important;text-decoration:none!important;font-size:11px!important;font-weight:900!important;letter-spacing:.04em!important}
body .drawer{border-top-right-radius:30px!important;border-bottom-right-radius:30px!important;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,248,249,.98))!important;border-right:1px solid rgba(255,255,255,.72)!important;box-shadow:20px 0 48px rgba(16,19,22,.08)!important}

body.nnb-scrolling #grid>.card,body.nnb-scrolling .apple-hero-banner,body.nnb-scrolling .apple-tools,body.nnb-scrolling .signature-footer{box-shadow:0 8px 18px rgba(16,19,21,.04)!important}

@media(max-width:720px){
 body .apple-topbar{height:58px!important;margin-bottom:12px!important}
 body .apple-hero-banner{padding:8px!important;border-radius:28px!important}
 body .apple-hero-banner .apple-hero-visual{min-height:168px!important;border-radius:22px!important}
 body .apple-tools{padding:9px!important;border-radius:28px!important}
 body .search,body .apple-search{height:56px!important}
 body .chips{min-height:60px!important;gap:8px!important}
 body .chip{min-height:44px!important;padding:0 14px!important;font-size:11.5px!important}
 body .section-head h1,body .section-head h2{font-size:31px!important;max-width:calc(100vw - 132px)!important}
 body #grid{gap:14px!important}
 body .signature-footer{padding:24px 18px 30px!important;border-radius:28px!important}
}
@media(max-width:390px){
 body .apple-hero-banner .apple-hero-visual{min-height:150px!important}
 body .apple-tools{padding:8px!important}
 body .chips{padding:6px!important}
 body #grid{gap:13px!important}
 body #grid>.card{border-radius:24px!important}
 body #grid .card-visual{margin:8px 8px 0!important;border-radius:19px 19px 16px 16px!important}
 body #grid .card-body{padding:12px 12px 13px!important;min-height:104px!important}
 body #grid .name{font-size:13.5px!important;min-height:40px!important;max-height:40px!important}
 body #grid .card-arrow{width:26px!important;height:26px!important;font-size:12px!important}
}
@media(min-width:700px){
 body .apple-hero-banner,body .apple-tools,body .signature-footer{max-width:920px!important;margin-left:auto!important;margin-right:auto!important}
 body .section-head,body #grid{max-width:920px!important;margin-left:auto!important;margin-right:auto!important}
}
