/* ══════════════════════════════════════════════════════════
   pages.css - collection · vehicle · journal · article · admin
   Loaded after main.css (shares its tokens + nav/footer/cursor).
   ══════════════════════════════════════════════════════════ */

/* sub-pages: solid nav from the top, and body padding to clear it */
.nav--solid{background:rgba(10,10,11,.72);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--hairline);}
.page{padding-top:96px;min-height:70vh;}
.page-wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter);}

/* ── scroll reveals (CSS-driven on sub-pages) ── */
[data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out);}
[data-reveal].revealed{opacity:1;transform:none;}
.rm [data-reveal]{transition-duration:.4s;transform:none;}

/* ── page masthead ── */
.masthead{padding:clamp(48px,8vh,110px) var(--gutter) clamp(32px,5vh,60px);max-width:var(--maxw);margin:0 auto;}
.masthead__eyebrow{margin-bottom:22px;}
.masthead__title{font-family:var(--serif);font-weight:300;font-size:clamp(2.8rem,7vw,6rem);line-height:.98;letter-spacing:-.02em;}
.masthead__title em{font-style:italic;}
.masthead__sub{margin-top:22px;color:var(--bone-60);max-width:56ch;}
.masthead__rule{height:1px;background:var(--hairline);margin:clamp(28px,4vh,52px) 0 0;}

/* ── back link ── */
.backlink{display:inline-flex;align-items:center;gap:10px;font-family:var(--sans);font-weight:500;font-size:.6875rem;text-transform:uppercase;letter-spacing:.2em;color:var(--bone-60);transition:color .3s;}
.backlink:hover{color:var(--bone);}
.backlink .arrow{width:13px;height:13px;transition:transform .35s var(--ease-out);}
.backlink:hover .arrow{transform:translateX(-4px);}

/* ══════ COLLECTION ══════ */
.filters{display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding:0 var(--gutter);max-width:var(--maxw);margin:0 auto clamp(28px,4vh,44px);}
.filters__search{flex:1;min-width:200px;position:relative;}
.filters input[type="search"],.filters select{
  font-family:var(--sans);font-size:.8rem;color:var(--bone);background:var(--ink-2);border:1px solid var(--hairline);
  padding:13px 16px;border-radius:0;appearance:none;transition:border-color .3s;letter-spacing:.02em;
}
.filters input[type="search"]{width:100%;}
.filters select{width:auto;min-width:148px;cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--bone-60) 50%),linear-gradient(135deg,var(--bone-60) 50%,transparent 50%);background-position:calc(100% - 18px) 55%,calc(100% - 13px) 55%;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:38px;}
.filters input:focus:not(:focus-visible),.filters select:focus:not(:focus-visible){outline:none;}
.filters input:focus,.filters select:focus{border-color:var(--bone-30);}
.filters__count{font-family:var(--mono);font-size:.72rem;color:var(--bone-50);letter-spacing:.08em;white-space:nowrap;margin-left:auto;}

.car-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--hairline);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);}
.car-grid--wrap{max-width:var(--maxw);margin:0 auto clamp(60px,10vh,120px);}
.car-card{position:relative;background:var(--ink);display:flex;flex-direction:column;}
.car-card__link{display:flex;flex-direction:column;height:100%;}
.car-card__media{position:relative;aspect-ratio:16/11;overflow:hidden;background:var(--ink-2);}
.car-card__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease-out);}
@media (hover:hover){.car-card:hover .car-card__media img{transform:scale(1.045);}}
.car-card__placeholder{position:absolute;inset:0;display:grid;place-items:center;color:var(--bone-30);}
.car-card__tag{position:absolute;top:16px;left:16px;font-family:var(--sans);font-weight:500;font-size:.6rem;text-transform:uppercase;letter-spacing:.18em;color:var(--bone);background:rgba(10,10,11,.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:7px 12px;border:1px solid var(--hairline);}
.car-card__tag--sold{color:var(--bone);border-color:var(--rosso);}
.car-card__body{padding:24px var(--gutter) 28px;display:flex;flex-direction:column;gap:6px;flex:1;}
.car-card__body{padding-left:26px;padding-right:26px;}
.car-card__year{font-family:var(--mono);font-size:.7rem;color:var(--bone-50);letter-spacing:.1em;}
.car-card__name{font-family:var(--serif);font-weight:300;font-size:clamp(1.3rem,2vw,1.7rem);line-height:1.1;letter-spacing:-.01em;}
.car-card__variant{color:var(--bone-60);font-size:.9rem;}
.car-card__foot{margin-top:auto;padding-top:18px;display:flex;align-items:baseline;justify-content:space-between;gap:12px;}
.car-card__price{font-family:var(--mono);font-size:.95rem;color:var(--bone);letter-spacing:.02em;}
.car-card__price--poa{color:var(--bone-60);}
.car-card__specs{font-family:var(--mono);font-size:.66rem;color:var(--bone-50);letter-spacing:.05em;text-transform:uppercase;}
.car-card__arrow{width:14px;height:14px;color:var(--bone);opacity:0;transform:translateX(-6px);transition:opacity .35s,transform .35s var(--ease-out);}
.car-card:hover .car-card__arrow{opacity:1;transform:none;}
.car-card.is-sold .car-card__media img{filter:grayscale(.55) brightness(.7);}

.empty{grid-column:1/-1;padding:clamp(60px,12vh,140px) var(--gutter);text-align:center;color:var(--bone-50);font-family:var(--serif);font-weight:300;font-size:clamp(1.4rem,3vw,2.2rem);background:var(--ink);}

/* ══════ VEHICLE DETAIL ══════ */
.vehicle{max-width:var(--maxw);margin:0 auto;padding:clamp(20px,4vh,40px) var(--gutter) clamp(60px,10vh,120px);}
.vehicle__top{margin-bottom:clamp(24px,4vh,44px);}
.vehicle__gallery{display:grid;grid-template-columns:1fr;gap:2px;}
.vehicle__main{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--ink-2);}
.vehicle__main img{width:100%;height:100%;object-fit:cover;}
.vehicle__thumbs{display:flex;gap:2px;flex-wrap:wrap;margin-top:2px;}
.vehicle__thumb{width:96px;aspect-ratio:16/11;object-fit:cover;background:var(--ink-2);cursor:pointer;opacity:.55;transition:opacity .3s;border:1px solid transparent;}
.vehicle__thumb.is-active,.vehicle__thumb:hover{opacity:1;}
.vehicle__thumb.is-active{border-color:var(--rosso);}
.vehicle__grid{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(32px,6vw,88px);margin-top:clamp(36px,5vh,64px);align-items:start;}
.vehicle__eyebrow{margin-bottom:18px;}
.vehicle__title{font-family:var(--serif);font-weight:300;font-size:clamp(2.2rem,4.5vw,3.6rem);line-height:1.02;letter-spacing:-.02em;}
.vehicle__variant{color:var(--bone-60);font-size:1.1rem;margin-top:8px;}
.vehicle__price{font-family:var(--mono);font-size:1.6rem;color:var(--bone);margin:26px 0;letter-spacing:.01em;}
.vehicle__desc{color:var(--bone-60);line-height:1.8;white-space:pre-line;}
.vehicle__cta{margin-top:34px;display:flex;gap:20px;flex-wrap:wrap;align-items:center;}
.vehicle__specs{border:1px solid var(--hairline);}
.spec-row{display:flex;justify-content:space-between;gap:16px;padding:15px 22px;border-bottom:1px solid var(--hairline);font-size:.85rem;}
.spec-row:last-child{border-bottom:none;}
.spec-row dt{font-family:var(--mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.12em;color:var(--bone-50);}
.spec-row dd{color:var(--bone);text-align:right;}

/* related cars strip (internal links on vehicle detail) */
.vehicle__related{margin-top:clamp(36px,5vh,64px);padding-top:28px;border-top:1px solid var(--hairline);}
.vehicle__related .eyebrow{margin-bottom:16px;}
.vehicle__related ul{display:flex;flex-direction:column;gap:12px;}
.vehicle__related .mono{font-size:.7rem;color:var(--bone-50);text-transform:none;letter-spacing:.05em;}
.article__also{font-size:.68rem;letter-spacing:.08em;color:var(--bone-50);}
.article__also a{color:var(--bone-60);}
.article__also a:hover{color:var(--bone);}

/* ══════ JOURNAL ══════ */
.journal-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:var(--hairline);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);max-width:var(--maxw);margin:0 auto clamp(60px,10vh,120px);}
.post-card{background:var(--ink);}
.post-card__link{display:flex;flex-direction:column;height:100%;}
.post-card__media{aspect-ratio:16/9;overflow:hidden;background:var(--ink-2);}
.post-card__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease-out);}
@media (hover:hover){.post-card:hover .post-card__media img{transform:scale(1.04);}}
.post-card__body{padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;gap:14px;flex:1;}
.post-card__meta{font-family:var(--mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.14em;color:var(--bone-50);}
.post-card__title{font-family:var(--serif);font-weight:300;font-size:clamp(1.5rem,2.6vw,2.2rem);line-height:1.1;letter-spacing:-.01em;}
.post-card__excerpt{color:var(--bone-60);font-size:.95rem;line-height:1.7;}
.post-card__more{margin-top:auto;padding-top:8px;display:inline-flex;align-items:center;gap:10px;font-family:var(--sans);font-weight:500;font-size:.66rem;text-transform:uppercase;letter-spacing:.2em;color:var(--bone);}
.post-card__more .arrow{width:13px;height:13px;transition:transform .35s var(--ease-out);}
.post-card:hover .post-card__more .arrow{transform:translateX(4px);}
.post-card--draft{outline:1px dashed var(--rosso);outline-offset:-1px;}
.post-card__draft{color:var(--rosso);}

/* ══════ ARTICLE ══════ */
.article{max-width:820px;margin:0 auto;padding:clamp(20px,4vh,40px) var(--gutter) clamp(60px,10vh,120px);}
.article__meta{font-family:var(--mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.14em;color:var(--bone-50);margin-bottom:20px;}
.article__title{font-family:var(--serif);font-weight:300;font-size:clamp(2.2rem,5vw,4rem);line-height:1.02;letter-spacing:-.02em;margin-bottom:14px;}
.article__excerpt{color:var(--bone-60);font-size:1.15rem;line-height:1.6;max-width:60ch;}
.article__cover{margin:clamp(32px,5vh,60px) 0;aspect-ratio:16/9;overflow:hidden;background:var(--ink-2);}
.article__cover img{width:100%;height:100%;object-fit:cover;}
.article__body{font-size:1.075rem;line-height:1.85;color:var(--bone-60);}
.article__body p{margin:0 0 1.4em;}
.article__body p:first-child::first-letter{font-family:var(--serif);font-weight:300;float:left;font-size:3.6em;line-height:.78;padding:6px 14px 0 0;color:var(--bone);}
.article__foot{margin-top:clamp(40px,6vh,72px);padding-top:28px;border-top:1px solid var(--hairline);}

/* ══════ RESPONSIVE ══════ */
@media (max-width:900px){
  .car-grid{grid-template-columns:repeat(2,1fr);}
  .vehicle__grid{grid-template-columns:1fr;}
  .journal-grid{grid-template-columns:1fr;}
}
@media (max-width:600px){
  .car-grid{grid-template-columns:1fr;}
  .filters__count{margin-left:0;width:100%;}
  .article__body p:first-child::first-letter{font-size:3em;}
}

/* ══════════════════════════════════════════════════════════
   ADMIN
   ══════════════════════════════════════════════════════════ */
[data-admin]{font-family:var(--sans);}
.admin-toast{position:fixed;left:50%;bottom:32px;transform:translate(-50%,20px);z-index:10000;background:var(--ink-2);color:var(--bone);border:1px solid var(--hairline);padding:13px 22px;font-size:.8rem;letter-spacing:.02em;opacity:0;transition:opacity .3s,transform .3s var(--ease-out);pointer-events:none;}
.admin-toast.show{opacity:1;transform:translate(-50%,0);}

/* login overlay */
.admin-login{position:fixed;inset:0;z-index:9800;background:rgba(8,8,9,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:grid;place-items:center;padding:24px;}
.admin-login-card{background:var(--ink-2);border:1px solid var(--hairline);padding:clamp(28px,4vw,44px);width:min(400px,100%);display:flex;flex-direction:column;gap:14px;text-align:center;}
.admin-login-lock{font-size:1.6rem;}
.admin-login-card h2{font-family:var(--serif);font-weight:300;font-size:1.8rem;}
.admin-login-card p{color:var(--bone-60);font-size:.9rem;margin-bottom:6px;}
.admin-login-card input{background:var(--ink);border:1px solid var(--hairline);color:var(--bone);padding:14px 16px;font-size:.95rem;}
.admin-login-card input:focus:not(:focus-visible){outline:none;}
.admin-login-card input:focus{border-color:var(--bone-30);}
.admin-login-err{color:var(--rosso)!important;font-size:.8rem!important;margin:0!important;}
.admin-login-cancel{color:var(--bone-50);font-size:.8rem;text-transform:uppercase;letter-spacing:.14em;margin-top:4px;}
.admin-login-cancel:hover{color:var(--bone);}

/* buttons */
.admin-btn,.admin-btn-primary{font-family:var(--sans);font-weight:500;font-size:.75rem;text-transform:uppercase;letter-spacing:.14em;padding:12px 20px;border:1px solid var(--hairline);color:var(--bone);cursor:pointer;transition:background .3s,border-color .3s,color .3s;}
.admin-btn-primary{background:var(--rosso);border-color:var(--rosso);color:var(--bone);}
.admin-btn-primary:hover{filter:brightness(1.1);}
.admin-btn:hover{background:var(--ink);border-color:var(--bone-30);}
.admin-btn.ghost{background:none;}
.admin-btn.danger{color:var(--rosso);border-color:rgba(227,6,19,.4);}
.admin-btn.danger:hover{background:rgba(227,6,19,.12);}

/* admin bar */
.admin-bar{position:fixed;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:9600;display:flex;align-items:center;gap:14px;background:var(--ink-2);border:1px solid var(--hairline);padding:10px 14px;box-shadow:0 10px 40px rgba(0,0,0,.5);flex-wrap:wrap;justify-content:center;max-width:calc(100vw - 24px);}
.admin-dot{width:8px;height:8px;border-radius:50%;background:var(--verde);box-shadow:0 0 8px var(--verde);}
.admin-bar-label{font-size:.72rem;text-transform:uppercase;letter-spacing:.16em;color:var(--bone);}
.admin-bar-hint{font-size:.72rem;color:var(--bone-50);}
.admin-bar .admin-btn{padding:8px 14px;}
.admin-warn{width:100%;text-align:center;font-size:.68rem;color:var(--rosso);letter-spacing:.02em;}

/* editable-image badge */
.admin-img-host{position:relative;}
.admin-edit-badge{position:absolute;top:12px;right:12px;z-index:20;display:inline-flex;align-items:center;gap:7px;font-family:var(--sans);font-size:.68rem;font-weight:500;letter-spacing:.06em;color:var(--bone);background:rgba(10,10,11,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid var(--hairline);padding:8px 12px;cursor:pointer;opacity:0;transition:opacity .25s;}
.admin-img-host:hover .admin-edit-badge{opacity:1;}
@media (hover:none){.admin-edit-badge{opacity:1;}}
.admin-edit-badge svg{width:14px;height:14px;}

/* card admin controls */
.admin-card-bar{position:absolute;top:12px;right:12px;z-index:20;display:flex;gap:6px;}
.admin-card-bar button{background:rgba(10,10,11,.78);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid var(--hairline);color:var(--bone);font-size:.75rem;padding:7px 10px;cursor:pointer;line-height:1;}
.admin-card-bar button:hover{border-color:var(--bone-30);}
body.admin-on .car-card,body.admin-on .post-card{outline:1px dashed rgba(242,237,228,.16);outline-offset:-1px;}

/* modal */
.admin-modal{position:fixed;inset:0;z-index:9900;display:grid;place-items:center;padding:20px;}
.admin-modal-backdrop{position:absolute;inset:0;background:rgba(6,6,7,.8);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);}
.admin-modal-panel{position:relative;z-index:2;background:var(--ink-2);border:1px solid var(--hairline);width:min(820px,100%);max-height:90vh;max-height:90dvh;overflow:auto;padding:clamp(24px,3vw,40px);}
.admin-modal-panel h2{font-family:var(--serif);font-weight:300;font-size:1.7rem;margin-bottom:22px;}
.admin-modal-close{position:absolute;top:16px;right:18px;font-size:1.6rem;line-height:1;color:var(--bone-60);background:none;border:none;cursor:pointer;}
.admin-modal-close:hover{color:var(--bone);}
.admin-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
.admin-field{display:flex;flex-direction:column;gap:6px;}
.admin-field.span2{grid-column:1/-1;}
.admin-field label{font-size:.68rem;text-transform:uppercase;letter-spacing:.12em;color:var(--bone-50);}
.admin-field input,.admin-field select,.admin-field textarea{background:var(--ink);border:1px solid var(--hairline);color:var(--bone);padding:11px 13px;font-family:var(--sans);font-size:.9rem;width:100%;}
.admin-field textarea{resize:vertical;min-height:64px;font-family:var(--sans);line-height:1.6;}
.admin-field input:focus:not(:focus-visible),.admin-field select:focus:not(:focus-visible),.admin-field textarea:focus:not(:focus-visible){outline:none;}
.admin-field input:focus,.admin-field select:focus,.admin-field textarea:focus{border-color:var(--bone-30);}
.admin-checks{display:flex;gap:24px;margin:20px 0 6px;flex-wrap:wrap;}
.admin-checks label{display:flex;align-items:center;gap:8px;font-size:.85rem;color:var(--bone);}
.admin-checks-hint,.admin-photo-hint{font-size:.75rem;color:var(--bone-50);line-height:1.5;}
.admin-modal-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:26px;flex-wrap:wrap;}
.admin-modal-foot>div{display:flex;gap:12px;margin-left:auto;}

/* gallery in modal */
.admin-gallery-wrap{margin-bottom:22px;}
.admin-gallery-label{font-size:.68rem;text-transform:uppercase;letter-spacing:.12em;color:var(--bone-50);display:block;margin-bottom:8px;}
.admin-gallery{display:flex;flex-wrap:wrap;gap:8px;padding:8px;border:1px dashed var(--hairline);}
.admin-gallery.drag{border-color:var(--rosso);}
.admin-thumb{position:relative;width:96px;aspect-ratio:16/11;overflow:hidden;background:var(--ink);border:1px solid var(--hairline);}
.admin-thumb img{width:100%;height:100%;object-fit:cover;}
.admin-thumb.is-main{border-color:var(--rosso);}
.admin-thumb .thumb-rm{position:absolute;top:2px;right:2px;background:rgba(0,0,0,.6);color:#fff;border:none;width:20px;height:20px;cursor:pointer;line-height:1;}
.admin-thumb .thumb-main{position:absolute;bottom:0;left:0;right:0;font-size:.55rem;text-transform:uppercase;letter-spacing:.08em;background:var(--rosso);color:var(--bone);text-align:center;padding:2px;}
.admin-thumb.add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer;color:var(--bone-50);border-style:dashed;}
.admin-thumb.add span{font-size:1.3rem;line-height:1;}
.admin-thumb.add small{font-size:.6rem;text-transform:uppercase;letter-spacing:.1em;}

body.admin-on{--admin-pad:64px;}
body.admin-on .footer{padding-bottom:80px;}

@media (max-width:640px){ .admin-grid{grid-template-columns:1fr;} }
/* iOS Safari auto-zooms (and stays zoomed) when a focused control is under 16px */
@media (pointer:coarse){
  .filters input[type="search"],.filters select,
  .admin-field input,.admin-field select,.admin-field textarea,.admin-login-card input{font-size:16px;}
}