/* ===================================================================
   Royalty USA Pacific Northwest — "The Editorial" design system
   Impact Business Solutions
   =================================================================== */

/* ===================================================================
   ⚠️  FONT LICENSE — READ BEFORE LAUNCH
   The self-hosted font below (assets/fonts/amati-pro-regular.woff2)
   is an UNLICENSED copy, used ONLY to build this client mockup.
   Jodi has committed to purchasing the proper license from RMU
   (https://www.myfonts.com/fonts/rmu/amati-pro) before this site
   goes live. DO NOT deploy this file to a public production server
   until it is replaced with a properly licensed copy (same filename
   is fine — just swap the file once purchased).
   =================================================================== */
@font-face{
  font-family:'Amati Pro';
  src:url('../fonts/amati-pro-regular.woff2') format('woff2');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

:root{
  --black:#0B0B0B;
  --paper:#F6F4F0;
  --red:#CC2127;
  --gray:#E9E9E9;
  --hairline:rgba(255,255,255,.16);
  --hairline-dark:rgba(0,0,0,.12);
  --serif:'Amati Pro', Georgia, 'Times New Roman', serif;
  --sans:'Jost', 'Helvetica Neue', Arial, sans-serif;
  --script:'Cormorant Garamond', Georgia, serif;
  box-sizing:border-box;
}
*{box-sizing:inherit; margin:0; padding:0;}
html{scroll-behavior:smooth; scroll-padding-top:96px;}
body{
  font-family:var(--sans);
  color:var(--black);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
.wrap{max-width:1320px; margin:0 auto; padding:0 32px;}
@media(max-width:760px){ .wrap{padding:0 20px;} }

.eyebrow{font-family:var(--sans); font-weight:600; letter-spacing:.28em; font-size:11px; color:var(--red);}
.eyebrow.light{color:rgba(255,255,255,.75);}

h1,h2,h3{font-family:var(--serif); font-weight:400; letter-spacing:0; line-height:1.08;}

.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:16px 30px; font-family:var(--sans); font-weight:500;
  font-size:13px; letter-spacing:.14em; text-transform:uppercase;
  border:1px solid currentColor; transition:background .25s ease, color .25s ease;
  white-space:nowrap; cursor:pointer;
}
.btn-fill{background:var(--red); border-color:var(--red); color:#fff;}
.btn-fill:hover{background:#a91419; border-color:#a91419;}
.btn-line-dark{color:var(--black);}
.btn-line-dark:hover{background:var(--black); color:#fff;}
.btn-line-light{color:#fff;}
.btn-line-light:hover{background:#fff; color:var(--black);}

/* ---------- LOGO ----------
   The logo file itself now carries a white outline baked in (per
   client direction) — invisible on light backgrounds, and exactly
   what keeps the black crown/wordmark legible on dark ones. No
   plate or backing needed anywhere anymore. */
.hero-badge img{filter:drop-shadow(0 18px 40px rgba(0,0,0,.45));}
.footer-logo{height:60px; width:auto; margin-bottom:20px;}

/* ---------- NAV ---------- */
header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(246,244,240,.92); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--hairline-dark);
}
.navbar{display:flex; align-items:center; justify-content:space-between; padding:14px 32px; max-width:1440px; margin:0 auto;}
.navbar .logo-mark img{height:52px; width:auto;}
nav.primary{display:flex; align-items:center; gap:34px;}
nav.primary > .navlink{position:relative; font-size:12.5px; letter-spacing:.12em; text-transform:uppercase; font-weight:500; padding:8px 0; cursor:pointer;}
nav.primary > .navlink > a{border-bottom:1px solid transparent; padding-bottom:4px;}
nav.primary > .navlink:hover > a, nav.primary > .navlink > a.is-active{border-color:var(--red); color:var(--red);}
.dropdown{
  position:absolute; top:100%; left:50%; transform:translateX(-50%) translateY(6px);
  background:#fff; border:1px solid var(--hairline-dark); min-width:220px;
  padding:14px 0; opacity:0; visibility:hidden; transition:all .2s ease;
  box-shadow:0 18px 40px rgba(0,0,0,.12);
}
.navlink:hover .dropdown{opacity:1; visibility:visible; transform:translateX(-50%) translateY(0);}
.dropdown a{display:block; padding:9px 22px; font-size:12px; letter-spacing:.08em; text-transform:uppercase; font-weight:400;}
.dropdown a:hover{color:var(--red); background:var(--paper);}
.nav-cta{display:flex; align-items:center; gap:18px;}
.nav-cta .portal-link{font-size:12px; letter-spacing:.12em; text-transform:uppercase; font-weight:500;}
.register-btn{background:var(--red); color:#fff; padding:12px 22px; font-size:12px; letter-spacing:.14em; text-transform:uppercase; font-weight:600;}
.register-btn:hover{background:#a91419;}
.burger{display:none; flex-direction:column; gap:5px; cursor:pointer; z-index:120;}
.burger span{width:26px; height:2px; background:var(--black); display:block; transition:.25s;}

@media(max-width:1080px){
  nav.primary{display:none;}
  .nav-cta .portal-link{display:none;}
  .burger{display:flex;}
}

.mobile-menu{
  position:fixed; inset:0; background:var(--black); color:#fff; z-index:110;
  transform:translateX(100%); transition:transform .35s ease; overflow-y:auto;
  padding:100px 28px 60px;
}
.mobile-menu.open{transform:translateX(0);}
.mobile-menu .m-section{border-top:1px solid var(--hairline);}
.mobile-menu .m-top{display:flex; justify-content:space-between; align-items:center; padding:20px 0; font-family:var(--serif); font-weight:400; font-size:20px; cursor:pointer; color:#fff;}
.mobile-menu .m-sub{max-height:0; overflow:hidden; transition:max-height .3s ease;}
.mobile-menu .m-sub.open{max-height:400px;}
.mobile-menu .m-sub a{display:block; padding:10px 0 10px 14px; font-size:14px; color:rgba(255,255,255,.72); border-left:1px solid var(--hairline);}
.mobile-menu .m-cta{margin-top:34px; display:flex; flex-direction:column; gap:14px;}

/* ---------- HERO ---------- */
.hero{
  position:relative; min-height:100vh; display:flex; align-items:flex-end;
  background:
    linear-gradient(180deg, rgba(0,0,0,.25) 0%, rgba(0,0,0,.55) 62%, rgba(0,0,0,.88) 100%),
    radial-gradient(120% 90% at 20% 10%, #232323 0%, #0B0B0B 55%),
    repeating-linear-gradient(115deg, #141414 0 2px, #101010 2px 4px);
  padding-top:120px;
  overflow:hidden;
}
.hero::before{
  content:""; position:absolute; inset:0;
  background-image: radial-gradient(circle at 78% 24%, rgba(204,33,39,.14), transparent 40%),
                     radial-gradient(circle at 12% 78%, rgba(233,233,233,.06), transparent 45%);
}
.hero .diamond-line{
  position:absolute; top:44%; right:6%; width:170px; height:170px;
  border:1px solid rgba(255,255,255,.18); transform:rotate(45deg);
  opacity:.55;
}
.hero-inner{position:relative; z-index:2; width:100%; padding-bottom:88px;}
.hero-badge{margin-bottom:34px;}
.hero-badge img{height:108px; width:auto;}
.hero-region{
  display:block; margin-top:14px; color:#fff; font-family:var(--sans);
  font-weight:600; font-size:15px; letter-spacing:.42em; text-transform:uppercase;
}
.hero-grid{display:grid; grid-template-columns:1.5fr .9fr; gap:60px; align-items:end;}
.hero h1{color:#fff; font-size:clamp(48px, 7vw, 108px); text-transform:uppercase; letter-spacing:-.01em;}
.hero h1 .row2{display:block; color:var(--red);}
.hero-sub{color:rgba(255,255,255,.92); font-size:19px; line-height:1.7; max-width:460px; margin-top:28px; font-weight:400;}
.hero-ctas{display:flex; flex-wrap:wrap; gap:16px; margin-top:38px;}
.hero-tertiary{margin-top:20px;}
.hero-tertiary a{color:rgba(255,255,255,.8); font-size:12px; letter-spacing:.14em; text-transform:uppercase; border-bottom:1px solid rgba(255,255,255,.35); padding-bottom:3px;}
.hero-tertiary a:hover{color:#fff; border-color:#fff;}
.scroll-cue{position:absolute; left:32px; bottom:28px; color:rgba(255,255,255,.74); font-size:11px; letter-spacing:.2em; writing-mode:vertical-rl; display:flex; align-items:center; gap:10px; z-index:2;}
.scroll-cue::after{content:""; width:1px; height:44px; background:rgba(255,255,255,.4);}
@media(max-width:900px){
  .hero-grid{grid-template-columns:1fr;}
  .scroll-cue{display:none;}
  .hero{padding-top:110px;}
  .hero-badge img{height:76px;}
  .hero-region{font-size:11px; letter-spacing:.3em; margin-top:10px;}
}

/* ---------- SECTION 2: INTRO ---------- */
.intro{padding:150px 0 130px; background:var(--paper);}
.intro-grid{display:grid; grid-template-columns:.85fr 1.15fr; gap:80px; align-items:start;}
.intro h2{font-size:clamp(34px, 4.2vw, 58px); text-transform:uppercase; margin-top:18px;}
.intro-copy{padding-top:14px;}
.intro-copy p{font-size:18px; line-height:1.8; color:#262626; font-weight:400; margin-bottom:22px; max-width:520px;}
.intro-copy p:first-of-type{font-size:21px; color:var(--black); font-weight:400;}
.intro-link{margin-top:20px; display:inline-block; font-size:12px; letter-spacing:.16em; text-transform:uppercase; font-weight:600; border-bottom:2px solid var(--red); padding-bottom:6px;}
@media(max-width:880px){ .intro-grid{grid-template-columns:1fr; gap:36px;} .intro{padding:110px 0 90px;} }

/* ---------- SECTION 3: PILLARS ---------- */
.pillars{background:var(--black); color:#fff; padding:120px 0;}
.pillars-head{max-width:640px; margin-bottom:70px;}
.pillars-head h2{font-size:clamp(30px,3.6vw,46px); text-transform:uppercase; color:#fff; margin-top:16px;}
.pillar-list{display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--hairline);}
.pillar{padding:38px 26px 0; border-right:1px solid var(--hairline); min-height:280px; position:relative;}
.pillar:last-child{border-right:none;}
.pillar-num{font-family:var(--serif); font-size:14px; color:var(--red); margin-bottom:22px; display:block;}
.pillar h3{font-size:24px; text-transform:uppercase; color:#fff; margin-bottom:16px; letter-spacing:.02em;}
.pillar p{font-size:14.5px; line-height:1.7; color:rgba(255,255,255,.78); font-weight:400; max-width:230px;}
@media(max-width:920px){
  .pillar-list{grid-template-columns:1fr 1fr;}
  .pillar{border-bottom:1px solid var(--hairline); min-height:0; padding-bottom:34px;}
  .pillar:nth-child(2n){border-right:none;}
}
@media(max-width:560px){ .pillar-list{grid-template-columns:1fr;} }

/* ---------- SECTION 4: QUEENS ---------- */
.queens{padding:140px 0; background:var(--paper);}
.section-head{display:flex; justify-content:space-between; align-items:flex-end; gap:40px; margin-bottom:64px;}
.section-head h2{font-size:clamp(32px,4vw,54px); text-transform:uppercase; margin-top:16px;}
.section-head .head-cta{font-size:12px; letter-spacing:.14em; text-transform:uppercase; font-weight:600; border-bottom:1px solid var(--black); padding-bottom:4px; white-space:nowrap;}
.queen-editorial{display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--black);}
.queen-card{position:relative; aspect-ratio:3/4; overflow:hidden; background:#1c1c1c; cursor:pointer; display:block;}
.queen-card.featured{grid-row:span 2; aspect-ratio:auto;}
.queen-photo{
  position:absolute; inset:0;
  background:
    linear-gradient(200deg, rgba(204,33,39,.28), transparent 55%),
    linear-gradient(150deg,#3a3a3a,#0e0e0e 70%);
  filter:grayscale(1) contrast(1.05);
  transition:filter .5s ease, transform .6s ease;
}
.queen-photo img{width:100%; height:100%; object-fit:cover; position:absolute; inset:0;}
.queen-card:hover .queen-photo{filter:grayscale(0); transform:scale(1.04);}
.queen-photo .ph-label{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; text-align:center; color:rgba(255,255,255,.28); font-size:11px; letter-spacing:.14em; text-transform:uppercase; padding:20px;}
.queen-overlay{position:absolute; left:0; right:0; bottom:0; padding:24px 22px; background:linear-gradient(0deg, rgba(0,0,0,.86), transparent);}
.queen-title{color:var(--red); font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; font-weight:600; margin-bottom:6px;}
.queen-name{color:#fff; font-family:var(--serif); font-weight:400; font-size:22px;}
.queen-hover-cta{position:absolute; top:22px; right:22px; color:#fff; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; opacity:0; transform:translateY(-6px); transition:.3s ease;}
.queen-card:hover .queen-hover-cta{opacity:1; transform:translateY(0);}
@media(max-width:920px){ .queen-editorial{grid-template-columns:repeat(2,1fr);} .queen-card.featured{grid-row:auto; aspect-ratio:3/4;} }
@media(max-width:560px){ .queen-editorial{grid-template-columns:1fr;} .section-head{flex-direction:column; align-items:flex-start; gap:18px;} }

/* ---------- SECTION 5: JOURNEY ---------- */
.journey{background:var(--black); color:#fff; padding:140px 0 130px; position:relative; overflow:hidden;}
.journey::after{content:""; position:absolute; right:-120px; top:-120px; width:420px; height:420px; border:1px solid var(--hairline); transform:rotate(45deg);}
.journey-head{max-width:760px; margin-bottom:80px; position:relative; z-index:2;}
.journey-head h2{font-size:clamp(32px,4.6vw,62px); text-transform:uppercase; color:#fff; margin-top:16px;}
.journey-steps{display:flex; align-items:stretch; gap:0; position:relative; z-index:2; flex-wrap:wrap;}
.step{flex:1; min-width:150px; padding:0 22px 0 0; position:relative;}
.step:not(:last-child)::after{content:"→"; position:absolute; right:-2px; top:6px; color:var(--red); font-size:20px;}
.step-num{font-family:var(--serif); color:var(--red); font-size:15px; margin-bottom:14px; display:block;}
.step h3{font-size:16px; text-transform:uppercase; letter-spacing:.06em; color:#fff; margin-bottom:8px;}
.step p{font-size:13px; color:rgba(255,255,255,.74); line-height:1.6; font-weight:400;}
@media(max-width:900px){
  .journey-steps{flex-direction:column; gap:26px;}
  .step:not(:last-child)::after{content:"↓"; right:auto; left:0; top:auto; bottom:-24px;}
}
.journey-cta{margin-top:70px; position:relative; z-index:2;}

/* ---------- SECTION 6: REGISTRATION BAND ---------- */
.reg-band{background:var(--red); color:#fff; padding:130px 0;}
.reg-inner{display:grid; grid-template-columns:1.2fr .8fr; gap:60px; align-items:center;}
.reg-inner h2{font-size:clamp(34px,4.6vw,60px); text-transform:uppercase; color:#fff;}
.reg-copy p{font-size:17px; line-height:1.7; color:rgba(255,255,255,.92); font-weight:400; margin-bottom:8px;}
.reg-ctas{display:flex; flex-wrap:wrap; gap:16px; margin-top:36px;}
.reg-inner .btn-line-light{border-color:rgba(255,255,255,.7);}
.btn-white{background:#fff; color:var(--red); border-color:#fff;}
.btn-white:hover{background:var(--paper);}
@media(max-width:880px){ .reg-inner{grid-template-columns:1fr; gap:30px;} .reg-band{padding:90px 0;} }

/* ---------- SECTION 7: EXPERIENCE COLLAGE ---------- */
.experience{padding:140px 0; background:var(--paper);}
.exp-grid{display:grid; grid-template-columns:repeat(6,1fr); grid-template-rows:repeat(2,220px); gap:16px; margin-top:60px;}
.exp-tile{position:relative; overflow:hidden; background:linear-gradient(160deg,#e2e2e2,#cfcfcf);}
.exp-tile .ph-label{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:rgba(0,0,0,.32); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; text-align:center; padding:14px;}
.exp-tile img{width:100%; height:100%; object-fit:cover; object-position:top center; display:block;}
.exp-tile.t1{grid-column:span 3; grid-row:span 2; background:linear-gradient(160deg,#1c1c1c,#0a0a0a);}
.exp-tile.t1 .ph-label{color:rgba(255,255,255,.3);}
.exp-tile.t2{grid-column:span 2; grid-row:span 1;}
.exp-tile.t3{grid-column:span 1; grid-row:span 1; background:var(--red);}
.exp-tile.t3 .ph-label{color:rgba(255,255,255,.78);}
.exp-tile.t4{grid-column:span 1; grid-row:span 1;}
.exp-tile.t5{grid-column:span 2; grid-row:span 1; background:linear-gradient(160deg,#2a2a2a,#111);}
.exp-tile.t5 .ph-label{color:rgba(255,255,255,.3);}
@media(max-width:900px){
  .exp-grid{grid-template-columns:repeat(2,1fr); grid-template-rows:repeat(4,160px);}
  .exp-tile.t1{grid-column:span 2; grid-row:span 1;}
  .exp-tile.t2,.exp-tile.t3,.exp-tile.t4,.exp-tile.t5{grid-column:span 1; grid-row:span 1;}
}

/* ---------- SECTION 8: SPONSORS ---------- */
.sponsors{background:#101010; color:#fff; padding:130px 0;}
.sponsor-tiers{margin-top:70px; display:grid; gap:1px; background:var(--hairline);}
.tier-row{background:#101010; padding:36px 0; display:grid; grid-template-columns:180px 1fr; gap:30px; align-items:center;}
.tier-name{font-family:var(--serif); font-size:14px; letter-spacing:.06em; color:var(--red); text-transform:uppercase;}
.tier-logos{display:flex; flex-wrap:wrap; gap:14px;}
.sponsor-slot{border:1px solid var(--hairline); padding:16px 26px; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.64); transition:.25s;}
.sponsor-slot:hover{border-color:#fff; color:#fff;}
.sponsor-slot img{max-height:36px; width:auto;}
.sponsor-cta{margin-top:60px; display:flex; gap:16px; flex-wrap:wrap;}
@media(max-width:700px){ .tier-row{grid-template-columns:1fr;} }

/* ---------- SECTION 9: COMMUNITY ---------- */
.community{position:relative; min-height:640px; display:flex; align-items:center; background:linear-gradient(200deg,#3a3a3a,#0a0a0a); color:#fff; overflow:hidden;}
.community::before{content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(0,0,0,.72) 0%, rgba(0,0,0,.35) 65%, transparent 100%);}
.community-inner{position:relative; z-index:2; max-width:560px; padding:100px 0;}
.community h2{font-size:clamp(32px,4.4vw,56px); text-transform:uppercase; color:#fff; margin-top:16px;}
.community p{font-size:17px; line-height:1.75; color:rgba(255,255,255,.78); font-weight:400; margin:26px 0 20px;}
.community-list{list-style:none; margin-bottom:36px;}
.community-list li{font-size:14px; color:rgba(255,255,255,.8); padding:9px 0; border-top:1px solid var(--hairline);}
.community-list li:last-child{border-bottom:1px solid var(--hairline);}

/* ---------- SECTION 10: FINAL CTA ---------- */
.final-cta{position:relative; min-height:74vh; display:flex; align-items:center; justify-content:center; text-align:center; background:radial-gradient(120% 100% at 50% 0%, #232323, #050505); color:#fff; padding:120px 24px;}
.final-cta::before{content:""; position:absolute; top:14%; left:50%; width:120px; height:120px; border:1px solid var(--hairline); transform:translateX(-50%) rotate(45deg);}
.final-inner{position:relative; z-index:2; max-width:760px; margin:0 auto;}
.final-cta h2{font-size:clamp(38px,6vw,80px); text-transform:uppercase; color:#fff; margin-bottom:20px;}
.final-cta .script-line{font-family:var(--script); font-style:italic; font-size:22px; color:rgba(255,255,255,.75); margin-bottom:30px; font-weight:400;}
.final-ctas{display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin-top:38px;}

/* ---------- FOOTER ---------- */
footer{background:var(--black); color:rgba(255,255,255,.74); padding:80px 0 34px;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:50px; padding-bottom:60px; border-bottom:1px solid var(--hairline);}
.footer-grid p{font-size:13.5px; line-height:1.7; max-width:280px;}
.footer-col h4{color:#fff; font-size:12px; letter-spacing:.14em; text-transform:uppercase; margin-bottom:18px; font-weight:600;}
.footer-col a{display:block; font-size:13.5px; padding:6px 0; color:rgba(255,255,255,.74);}
.footer-col a:hover{color:var(--red);}
.footer-bottom{display:flex; justify-content:space-between; align-items:center; padding-top:30px; font-size:12px; flex-wrap:wrap; gap:14px;}
@media(max-width:900px){ .footer-grid{grid-template-columns:1fr 1fr; gap:36px;} }
@media(max-width:560px){ .footer-grid{grid-template-columns:1fr;} }

/* ---------- GENERIC INNER PAGE / COMING SOON ---------- */
.page-hero{background:var(--black); color:#fff; padding:190px 0 90px; text-align:center;}
.page-hero .eyebrow{display:block; margin-bottom:16px;}
.page-hero h1{font-size:clamp(36px,5.4vw,64px); text-transform:uppercase; color:#fff;}
.page-body{padding:100px 0; max-width:720px; margin:0 auto; text-align:center;}
.page-body p{font-size:17px; line-height:1.8; color:#333; margin-bottom:22px; font-weight:400;}
.coming-soon-tag{display:inline-block; margin-bottom:28px; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--red); font-weight:600; border:1px solid var(--red); padding:8px 18px;}

/* Single queen profile */
.queen-profile{padding:170px 0 120px;}
.queen-profile-grid{display:grid; grid-template-columns:.9fr 1.1fr; gap:70px; align-items:start;}
.queen-profile-photo{aspect-ratio:3/4; background:linear-gradient(150deg,#3a3a3a,#0e0e0e); position:relative;}
.queen-profile-photo .ph-label{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.3); font-size:12px; letter-spacing:.12em; text-transform:uppercase; text-align:center; padding:24px;}
.queen-profile h1{font-size:clamp(34px,4.6vw,56px); text-transform:uppercase; margin:14px 0 20px;}
.queen-profile p{font-size:17px; line-height:1.8; color:#262626; font-weight:400; margin-bottom:20px;}
.queen-profile-quote{font-family:var(--script); font-style:italic; font-size:22px; color:var(--red); margin:18px 0;}
@media(max-width:860px){ .queen-profile-grid{grid-template-columns:1fr; gap:36px;} }

/* Queens listing grid (reuses .queen-editorial pattern at a lighter weight) */
.queens-listing{padding:170px 0 130px;}

/* Leadership / director bio stat strip */
.stat-row{display:flex; flex-wrap:wrap; gap:38px 48px; margin:34px 0 8px; padding-top:28px; border-top:1px solid var(--hairline-dark);}
.stat-row .stat{min-width:110px;}
.stat-row .stat-num{font-family:var(--serif); font-size:36px; color:var(--red); line-height:1; display:block;}
.stat-row .stat-label{font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:#767676; margin-top:8px; display:block; max-width:140px;}