:root{
  --navy:#1a2e44; --navy-900:#132433;
  --teal:#0fa3b1; --teal-deep:#0a7d88; --teal-tint:#e6f7f9;
  --coral:#f0564a; --coral-tint:#fdecea;
  --green:#8bc53f; --green-tint:#f0f7e4;
  --amber:#c98a12; --amber-tint:#fdf3e0;
  --blue:#3d5cf5;
  --ink:#0f172a; --ink-2:#334155; --ink-3:#64748b; --ink-4:#94a3b8;
  --line:#e2e8f0; --line-soft:#eef2f6;
  --paper:#fff; --paper-2:#f8fafc; --paper-3:#f1f5f9;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --display:'Raleway',var(--sans);
  /* ONE column width for the whole page — text, figures, grids all align to this */
  --wrap:800px;
}
*{box-sizing:border-box}
/* nothing may force the page wider than the viewport
   (no overflow-x:hidden here — it would kill the sticky nav) */
h1,h2,h3,h4,p,li,figcaption{overflow-wrap:break-word}
.stats,.cards,.gallery,.figpair,.ba,.reflect,.metagrid,.chips,.timeline li{min-width:0}
.stats>*,.cards>*,.gallery>*,.figpair>*,.ba>*,.reflect>*,.metagrid>*{min-width:0}
html{scroll-behavior:smooth;scroll-padding-top:128px;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:17px;line-height:1.68}
img{max-width:100%;display:block}
video{max-width:100%;height:auto;display:block}
/* keep any single screenshot/recording from dominating the page vertically —
   scoped to direct children so it never fights the .hasScroll/.scroller
   pattern, which needs its image at full height to be scrollable */
.figbox>img,.figbox>video{max-height:640px;width:auto;max-width:100%;margin:0 auto}
a{color:var(--teal-deep)}
code{font-family:var(--mono);font-size:.88em;background:var(--paper-3);padding:1px 5px;border-radius:4px}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:28px}
.prose{max-width:none}
.prose p{margin:0 0 1.05em}
.prose p:last-child{margin-bottom:0}
strong{font-weight:640}

/* global site nav */
.global-nav{position:sticky;top:0;z-index:70;background:rgba(255,255,255,.94);
  backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line)}
.global-nav .wrap{max-width:1100px;display:flex;align-items:center;justify-content:space-between;height:60px}
.gn-brand{font-family:var(--display);font-weight:700;font-size:15px;color:var(--navy);
  text-decoration:none;letter-spacing:-.01em}
.gn-brand span{color:var(--teal-deep);font-weight:500}
.gn-links{display:flex;gap:28px;list-style:none;margin:0;padding:0;font-family:var(--display);font-size:13.5px}
.gn-links a{color:var(--ink-2);text-decoration:none;font-weight:600;transition:.15s}
.gn-links a:hover{color:var(--navy)}
.gn-toggle{display:none}
@media (max-width:720px){
  .gn-links{display:none;position:absolute;top:60px;left:0;right:0;flex-direction:column;gap:0;
    background:#fff;border-bottom:1px solid var(--line)}
  .gn-links.open{display:flex}
  .gn-links a{display:block;width:100%;padding:14px 28px;border-top:1px solid var(--line-soft)}
  .gn-toggle{display:block;background:none;border:1px solid var(--ink-3);border-radius:6px;
    width:38px;height:34px;cursor:pointer;font-size:16px;font-family:inherit}
}

/* progress + section nav */
#progress{position:fixed;top:60px;left:0;height:2px;background:var(--teal);width:0;z-index:60;transition:width .08s linear}
.tocbar{position:sticky;top:60px;z-index:50;background:rgba(255,255,255,.88);
  backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line)}
.tocbar .wrap{display:flex;align-items:center;gap:18px;height:58px}
.tocbar .mark{font-weight:700;font-size:12.5px;color:var(--navy);white-space:nowrap;text-decoration:none;flex-shrink:0}
.tocbar .mark span{color:var(--teal)}
.tocbar nav{display:flex;gap:15px;overflow-x:auto;scrollbar-width:none;margin-left:auto}
.tocbar nav::-webkit-scrollbar{display:none}
.tocbar nav a{font-size:12.5px;color:var(--ink-3);text-decoration:none;white-space:nowrap;
  padding:4px 0;border-bottom:2px solid transparent;transition:.15s}
.tocbar nav a:hover{color:var(--ink)}
.tocbar nav a.on{color:var(--navy);border-bottom-color:var(--teal);font-weight:600}

/* hero */
.hero{background:
    radial-gradient(1100px 520px at 88% -10%, rgba(15,163,177,.30), transparent 62%),
    radial-gradient(760px 420px at 4% 108%, rgba(139,197,63,.13), transparent 60%),
    linear-gradient(168deg, var(--navy) 0%, var(--navy-900) 100%);
  color:#fff;padding:100px 0 74px;position:relative;overflow:hidden}
.eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:#6fd8e2;margin:0 0 22px}
.hero h1{font-size:clamp(2rem,7.4vw,3.6rem);line-height:1.05;letter-spacing:-.028em;font-weight:700;margin:0 0 24px}
.hero .deck{font-size:clamp(1.06rem,2.1vw,1.22rem);line-height:1.55;color:#c3d3e2;margin:0 0 44px}
.metagrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:24px 28px;
  padding-top:32px;border-top:1px solid rgba(255,255,255,.15)}
.metagrid dt{font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:#7f9ab3;font-weight:700;margin-bottom:7px}
.metagrid dd{margin:0;font-size:14.5px;line-height:1.5;color:#e8eef4}
.metagrid dd .sub{display:block;color:#8fa8bd;font-size:13px}

/* sections */
section{padding:84px 0}
section+section{border-top:1px solid var(--line-soft)}
.tinted{background:var(--paper-2)}
.dark{background:var(--navy);color:#dfe8f0}
.dark .kicker{color:#6fd8e2}
.dark h2,.dark h3{color:#fff}
.dark .lede{color:#b8cadb}
.kicker{font-size:11.5px;letter-spacing:.15em;text-transform:uppercase;font-weight:700;
  color:var(--teal-deep);margin:0 0 15px;display:flex;align-items:center;gap:11px}
.kicker:before{content:"";width:22px;height:2px;background:var(--teal);border-radius:2px}
h2{font-size:clamp(1.8rem,4.2vw,2.35rem);line-height:1.14;letter-spacing:-.022em;font-weight:700;margin:0 0 20px}
h3{font-size:1.26rem;line-height:1.32;letter-spacing:-.012em;font-weight:660;margin:0 0 12px}
h4{font-size:1rem;font-weight:660;margin:0 0 9px}
.lede{font-size:1.11rem;line-height:1.6;color:var(--ink-2);margin:0 0 40px}

/* stats */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:12px;margin:0 0 44px}
.stat{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:18px 16px}
.stat b{display:block;font-size:1.95rem;line-height:1;font-weight:700;letter-spacing:-.035em;color:var(--navy);margin-bottom:7px}
.stat span{font-size:12px;line-height:1.38;color:var(--ink-3);display:block}

/* problem cards — stacked so each one gets the full column */
.cards{display:grid;gap:18px;grid-template-columns:1fr;margin-top:40px}
/* claim + annotated evidence, paired */
.evidence{margin:40px 0 0}
.evidence figure{margin:16px 0 0}
/* numbered legend that mirrors the badges burned into the screenshot */
ol.notes{list-style:none;counter-reset:n;margin:14px 0 0;padding:0;
  display:grid;gap:9px}
/* li must stay a normal flow box — as a grid container, its inline
   children (em, code) would each become separate grid items and
   shatter mid-sentence. Badge is absolutely positioned instead. */
ol.notes li{counter-increment:n;position:relative;padding-left:30px;
  font-size:14px;line-height:1.5;color:var(--ink-2)}
ol.notes li:before{content:counter(n);position:absolute;left:0;top:1px;
  display:flex;align-items:center;justify-content:center;
  width:20px;height:20px;border-radius:50%;background:var(--coral);color:#fff;
  font-size:11.5px;font-weight:700}
.card{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:26px 24px;position:relative}
.card:before{content:"";position:absolute;top:0;left:24px;right:24px;height:2px;background:var(--coral)}
.card .num{font-family:var(--mono);font-size:11.5px;color:var(--coral);font-weight:600;margin-bottom:11px;display:block}
.card p{margin:0 0 .85em;font-size:15px;line-height:1.58;color:var(--ink-2)}
.card p:last-child{margin-bottom:0}

/* quote */
.quote{margin:40px 0 0;padding:24px 0 24px 30px;border-left:3px solid var(--teal)}
.quote p{font-size:clamp(1.2rem,2.9vw,1.45rem);line-height:1.38;letter-spacing:-.018em;font-weight:600;color:var(--navy);margin:0 0 13px}
.quote cite{font-style:normal;font-size:13.5px;color:var(--ink-3)}

/* callout — a short aside that doesn't need its own section */
.callout{margin:56px 0 0;padding:26px 28px;background:var(--paper-2);
  border:1px solid var(--line);border-left:3px solid var(--teal);border-radius:0 12px 12px 0}
.callout h4{font-size:12px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--teal-deep);font-weight:700;margin:0 0 12px}
.callout p{margin:0 0 .85em;font-size:15.5px;line-height:1.6;color:var(--ink-2)}
.callout p:last-child{margin-bottom:0}

/* bullets */
ul.tight{margin:0 0 1.05em;padding-left:20px;max-width:none}
ul.tight li{margin-bottom:.42em;color:var(--ink-2);font-size:16px;line-height:1.55}
ul.tight li:last-child{margin-bottom:0}
.dark ul.tight li{color:#c3d3e2}

/* figures */
figure{margin:36px 0}
.figbox{position:relative;border:1px solid var(--line);border-radius:13px;overflow:hidden;
  background:var(--paper-3);box-shadow:0 1px 2px rgba(15,23,42,.04),0 12px 34px -18px rgba(15,23,42,.22)}
.figbox.pad{padding:22px;background:var(--paper-2)}
figcaption{margin-top:13px;font-size:13.5px;line-height:1.55;color:var(--ink-3);max-width:none}
figcaption b{color:var(--ink-2);font-weight:640}
.expand{position:absolute;top:12px;right:12px;z-index:4;background:rgba(255,255,255,.94);
  border:1px solid var(--line);border-radius:8px;font-size:12px;font-weight:600;color:var(--ink-2);
  padding:6px 11px;cursor:pointer;box-shadow:0 2px 8px rgba(15,23,42,.10);font-family:inherit;transition:.15s}
.expand:hover{background:#fff;color:var(--navy);border-color:var(--ink-4)}

/* scrollable tall diagrams */
.scroller{max-height:600px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#b6c2d1 transparent}
.scroller::-webkit-scrollbar{width:12px}
.scroller::-webkit-scrollbar-track{background:rgba(15,23,42,.04)}
.scroller::-webkit-scrollbar-thumb{background:#b6c2d1;border-radius:7px;border:3px solid transparent;background-clip:content-box}
.scroller::-webkit-scrollbar-thumb:hover{background:#94a3b8;background-clip:content-box}
.figbox.hasScroll:after{content:"";position:absolute;left:0;right:12px;bottom:0;height:56px;pointer-events:none;
  background:linear-gradient(to bottom,rgba(241,245,249,0),rgba(241,245,249,.96))}
.scrollhint{position:absolute;bottom:12px;left:12px;z-index:4;display:inline-flex;align-items:center;gap:7px;
  background:rgba(26,46,68,.9);color:#fff;font-size:11.5px;font-weight:600;letter-spacing:.02em;
  padding:6px 11px;border-radius:7px;pointer-events:none;box-shadow:0 2px 8px rgba(15,23,42,.2)}

.figpair{display:grid;gap:20px;grid-template-columns:1fr 1fr}
.figpair.narrow{grid-template-columns:1fr 1fr}

/* device mockups — a framed product shot, used sparingly as a lead visual */
.device-frame{margin:36px auto;max-width:640px}
.browser-frame{border-radius:12px;overflow:hidden;background:#fff;border:1px solid var(--line);
  box-shadow:0 24px 60px -24px rgba(15,23,42,.35)}
.browser-frame .chrome{display:flex;align-items:center;gap:6px;padding:10px 12px;
  background:var(--paper-3);border-bottom:1px solid var(--line)}
.browser-frame .chrome .dot{width:10px;height:10px;border-radius:50%}
.browser-frame .chrome .dot.r{background:#ff5f57}
.browser-frame .chrome .dot.y{background:#febc2e}
.browser-frame .chrome .dot.g{background:#28c840}
.browser-frame img{display:block;width:100%}

/* phone mockups — wraps a simulator screenshot/recording (which already
   includes its own notch/status bar) in a rounded bezel sized to the
   screenshot's own aspect ratio, instead of stretching a plain box across
   the whole text column */
.phone-frame{position:relative;margin:0 auto;max-width:280px;
  background:linear-gradient(155deg,#3a3f47,#111318 45%,#0a0c0f);
  border-radius:46px;padding:10px;
  box-shadow:0 30px 60px -22px rgba(15,23,42,.45),inset 0 0 0 1px rgba(255,255,255,.06)}
.phone-frame img,.phone-frame video{display:block;width:100%;border-radius:36px;max-height:none}
.phone-frame .expand{top:22px;right:22px}

/* persona cards — recreated live so names can stay role-only */
.persona-card{border:1px solid var(--line);border-radius:14px;padding:22px 22px 26px;background:var(--paper)}
.persona-head{border-radius:12px;padding:14px 18px;color:#fff;font-weight:700;font-size:1.1rem;
  display:flex;align-items:center;gap:10px}
.persona-head.admin{background:var(--teal-deep)}
.persona-head.principal{background:var(--blue)}
.persona-sub{color:var(--ink-3);font-size:12.5px;margin:14px 0 10px}
.persona-quote{font-weight:700;font-size:1.02rem;line-height:1.4;margin:0 0 18px}
.persona-quote.admin{color:var(--teal-deep)}
.persona-quote.principal{color:var(--blue)}
.persona-sec{margin-bottom:18px}
.persona-sec:last-child{margin-bottom:0}
.persona-sec h5{font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;margin:0 0 8px}
.persona-sec h5.admin{color:var(--teal-deep)}
.persona-sec h5.principal{color:var(--blue)}
.persona-sec ul{margin:0;padding-left:18px}
.persona-sec li{font-size:13.5px;line-height:1.5;color:var(--ink-2);margin-bottom:6px}
.persona-sec li:last-child{margin-bottom:0}
@media (max-width:820px){.figpair.narrow{grid-template-columns:1fr}}

/* decisions */
.decision{padding:42px 0;border-top:1px solid var(--line)}
.decision:first-of-type{border-top:none;padding-top:0}
.decision h3{font-size:clamp(1.24rem,2.9vw,1.48rem);letter-spacing:-.018em;margin-bottom:15px}
.decision p{color:var(--ink-2);max-width:none;margin:0 0 1.05em}
.decision p:last-child{margin-bottom:0}

/* status chips */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 22px}
.chip{display:inline-flex;flex-direction:column;gap:3px;border:1px solid var(--line);
  background:var(--paper);border-radius:10px;padding:10px 14px;min-width:128px}
.chip b{font-size:13px;font-weight:660;color:var(--navy)}
.chip span{font-size:11.5px;color:var(--ink-3);line-height:1.35}
.chip.t{border-color:#a9dfe5;background:var(--teal-tint)}
.chip.g{border-color:#c9e3a0;background:var(--green-tint)}
.chip.c{border-color:#f6bdb7;background:var(--coral-tint)}
.chip.a{border-color:#efd7a4;background:var(--amber-tint)}
.chiplabel{font-size:11px;letter-spacing:.13em;text-transform:uppercase;font-weight:700;color:var(--ink-4);margin:20px 0 -6px}

/* before / after + tradeoff */
.ba{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:26px 0}
.ba>div{border-radius:12px;padding:20px 22px;border:1px solid var(--line)}
.ba .before{background:var(--coral-tint);border-color:#f6cdc8}
.ba .after{background:var(--green-tint);border-color:#d5e9b3}
.ba h4{font-size:11px;letter-spacing:.13em;text-transform:uppercase;margin-bottom:10px;font-weight:700}
.ba .before h4{color:#b13b31}
.ba .after h4{color:#5d8b1f}
.ba p{margin:0;font-size:14.5px;line-height:1.55;color:var(--ink-2)}
.ba ul{margin:0;padding-left:18px}
.ba li{font-size:14.5px;line-height:1.5;color:var(--ink-2);margin-bottom:.35em}
.ba li:last-child{margin-bottom:0}
.dark .ba>div{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.16)}
.dark .ba .before h4{color:#ff9d92}
.dark .ba .after h4{color:#bfe58a}
.dark .ba li,.dark .ba p{color:#cfdce8}

/* gallery — one per row so each screenshot gets the full column */
.gallery{display:grid;grid-template-columns:1fr;gap:30px;margin-top:26px;align-items:start}
.gallery figure{margin:0}
.gallery figcaption{font-size:13px;margin-top:11px}
.grouphead{display:flex;align-items:center;gap:12px;margin:52px 0 0;
  font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--navy)}
.grouphead:after{content:"";flex:1;height:1px;background:var(--line)}
.grouphead em{font-style:normal;letter-spacing:0;text-transform:none;font-weight:500;font-size:13px;color:var(--ink-3)}

/* timeline */
.timeline{margin:30px 0 0;padding:0;list-style:none;max-width:none}
.timeline li{display:grid;grid-template-columns:148px 1fr;gap:22px;padding:15px 0;
  border-top:1px solid rgba(255,255,255,.13);font-size:15px;align-items:baseline}
.timeline li:first-child{border-top:none}
.timeline b{color:#6fd8e2;font-weight:660;font-size:13.5px}
.timeline span{color:#c3d3e2}

/* reflection */
.reflect{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));margin-top:40px}
.reflect>div{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:26px 24px}
.reflect h4{color:var(--navy);margin-bottom:10px;font-size:1rem;line-height:1.4}
.reflect p{margin:0;font-size:14.5px;line-height:1.58;color:var(--ink-2)}

.linkrow{display:flex;flex-wrap:wrap;gap:11px;margin-top:32px}
.linkrow a{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;text-decoration:none;
  color:#dfe8f0;border:1px solid rgba(255,255,255,.24);border-radius:9px;padding:9px 15px;
  transition:.15s;background:rgba(255,255,255,.05)}
.linkrow a:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.45);color:#fff}
.linkrow a em{font-style:normal;color:#7f9ab3;font-weight:400}

footer{background:var(--navy-900);color:#8fa8bd;padding:46px 0;font-size:14px}
footer .wrap{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center}
footer b{color:#dfe8f0;font-weight:600}

.next-project{padding:46px 0 60px;text-align:center;background:var(--navy-900);border-top:1px solid rgba(255,255,255,.15)}
.next-project .eyebrow{display:block;margin-bottom:10px}
.next-project a{font-family:var(--display);font-size:1.8rem;text-decoration:none;color:#fff;border-bottom:2px solid var(--teal)}
.next-project a:hover{color:var(--teal)}

/* lightbox */
#lb{position:fixed;inset:0;background:rgba(10,17,26,.94);z-index:100;display:none;padding:34px;overflow:auto}
#lb.on{display:block}
#lb img{margin:0 auto;max-width:none;width:auto;border-radius:6px;background:#fff}
#lb .close{position:fixed;top:20px;right:24px;background:rgba(255,255,255,.12);color:#fff;
  border:1px solid rgba(255,255,255,.3);border-radius:9px;padding:9px 15px;font-size:13.5px;
  font-weight:600;cursor:pointer;font-family:inherit;z-index:101}
#lb .close:hover{background:rgba(255,255,255,.22)}
#lb .hint{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);color:#7f9ab3;
  font-size:12.5px;background:rgba(10,17,26,.8);padding:7px 14px;border-radius:8px}

@media (max-width:860px){
  /* 5 stats never divide evenly — 3+2 reads more deliberate than 4+1 */
  .stats{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:820px){
  body{font-size:16px}
  section{padding:58px 0}
  .hero{padding:74px 0 54px}
  .figpair,.figpair.narrow,.ba{grid-template-columns:1fr}
  .timeline li{grid-template-columns:1fr;gap:4px}
  .tocbar nav{display:none}
  .wrap{padding-inline:20px}
}
/* ============================================================
   Password gate — a handful of case studies are gated behind a
   shared password rather than fully public
   ============================================================ */
html.gate-locked, html.gate-locked body{overflow:hidden;height:100%}
html:not(.gate-locked) .gate-overlay{display:none}
.gate-overlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;
  padding:28px;
  background:
    radial-gradient(1100px 520px at 88% -10%, rgba(15,163,177,.30), transparent 62%),
    radial-gradient(760px 420px at 4% 108%, rgba(139,197,63,.13), transparent 60%),
    linear-gradient(168deg, var(--navy) 0%, var(--navy-900) 100%)}
.gate-card{width:100%;max-width:380px;background:var(--paper);border-radius:16px;padding:40px 32px;
  text-align:center;box-shadow:0 24px 60px -20px rgba(0,0,0,.5)}
.gate-card .gate-icon{width:42px;height:42px;margin:0 auto 18px;color:var(--teal-deep)}
.gate-card h2{font-family:var(--display);font-size:1.25rem;font-weight:700;color:var(--ink);margin:0 0 8px;line-height:1.3}
.gate-card p{font-size:14.5px;color:var(--ink-3);margin:0 0 22px;line-height:1.5}
.gate-form{display:flex;flex-direction:column;gap:12px}
.gate-form input{font:inherit;font-size:15px;padding:0.75em 1em;border:1px solid var(--line);
  border-radius:10px;outline:none;text-align:center;transition:border-color .15s ease;width:100%}
.gate-form input:focus{border-color:var(--teal-deep)}
.gate-form button{font-family:var(--display);font-weight:600;font-size:14.5px;color:#fff;background:var(--navy);
  border:none;border-radius:10px;padding:0.8em 1em;cursor:pointer;transition:background .15s ease}
.gate-form button:hover{background:var(--teal-deep)}
.gate-card .gate-error{font-size:13.5px;color:var(--coral);margin:0;min-height:1.2em}
.gate-back{display:inline-block;margin-top:18px;font-size:13px;color:var(--ink-3);text-decoration:none}
.gate-back:hover{color:var(--ink)}

@media print{.global-nav,.tocbar,#progress,.expand,#lb,.scrollhint,.gate-overlay{display:none!important}
  section{padding:30px 0;break-inside:avoid}.scroller{max-height:none;overflow:visible}}