/* ==========================================================================
   G'LUX TRAILER — トレーラーページ専用（2026-09-09）
   屋外展示場の空と、内部の暖かい灯りを同じ画面で成立させる層。
   ・ファーストビューは「走る箱｜住める家」を縦罫で二分する組み
   ・けん引免許不要／750kg を金属の札で置く
   ・装備は暖色、車体は鋼色と、外と内で温度を変える
   結線＝body class="… iron-page trailer-open"。撤去＝<link> 1行。
   ========================================================================== */
body.trailer-open{
  --ac:#a8853c;
  --ac-deep:#6f5722;
  --ac-soft:#dcb668;
  --edge:#8b877455;
  --edge-hi:#a5a08d66;
  --plate-a:#252520;
  --plate-b:#121211;
  background:repeating-linear-gradient(0deg,#ffffff02 0,transparent 1px,transparent 4px),#0b0b0a;
}
body.trailer-open .page-hero{border-bottom:4px solid #6f5722;background:#14140f}
body.trailer-open .page-hero>img{filter:brightness(.62) saturate(1.1)}
body.trailer-open .page-hero::after{background:linear-gradient(90deg,#0a0a08e8,#0a0a0880 50%,#0a0a0800),linear-gradient(0deg,#0b0b0a,transparent 46%),radial-gradient(ellipse at 74% 30%,#a7c4d81a,transparent 55%)}
body.trailer-open .page-hero h1{max-width:60%}
body.trailer-open .page-hero h1 span.sub{-webkit-text-stroke:1px #cfc7ae;font-size:.5em}
body.trailer-open .page-lead{border-left-color:var(--ac)}
/* 車体の切り抜き */
body.trailer-open .iron-bike{right:-2%;top:auto;bottom:58px;height:56%;width:60%;filter:drop-shadow(-16px 26px 26px #000c)}
body.trailer-open .iron-bike img{object-position:bottom right}
/* 走る箱｜住める家 */
.tr-split{display:flex;align-items:stretch;gap:0;margin-top:26px;max-width:560px;border-top:1px solid #ffffff2e;border-bottom:1px solid #ffffff2e}
.tr-split div{flex:1;padding:20px 24px 20px 0;min-width:0}
.tr-split div+div{border-left:1px solid #ffffff2e;padding-left:24px}
.tr-split small{display:block;font:10px 'Oswald',sans-serif;letter-spacing:.24em;color:var(--ac-soft)}
.tr-split b{display:block;margin-top:10px;font-size:clamp(20px,2.3vw,30px);font-weight:700;letter-spacing:.06em;color:#f2ece0}
.tr-split span{display:block;margin-top:8px;font-size:12px;line-height:1.85;color:#b5b0a4}
/* 金属の札 */
.tr-badge{position:absolute;z-index:6;left:clamp(24px,6vw,100px);bottom:38px;display:inline-flex;align-items:center;gap:0;border:1px solid #9b968355;background:linear-gradient(150deg,#33322c,#16150f);box-shadow:inset 0 1px #ffffff26,0 10px 24px #0008}
.tr-badge i{font-style:normal;display:block;padding:14px 20px;font:11px 'Oswald',sans-serif;letter-spacing:.18em;color:#ded7c6}
.tr-badge i+i{border-left:1px solid #9b968344}
.tr-badge i b{display:block;margin-top:6px;font:500 22px/1 'Oswald',sans-serif;color:#f4efe3;letter-spacing:.01em}
.tr-badge i.hot b{color:var(--ac-soft)}

body.trailer-open .section-head{border-top:3px solid #8b8774}
body.trailer-open .section-head .eyebrow{color:var(--ac-soft)}
body.trailer-open .locator-copy .eyebrow{color:var(--ac-soft)}

/* 2つの型＝大きなカード */
.tr-types{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.tr-type{position:relative;border:1px solid var(--edge);border-top:2px solid var(--edge-hi);background:linear-gradient(150deg,var(--plate-a),var(--plate-b));box-shadow:0 22px 42px #0007;overflow:hidden;display:flex;flex-direction:column;min-width:0}
.tr-type>img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}
.tr-type-body{padding:26px 26px 28px;display:flex;flex-direction:column;gap:0;flex:1}
.tr-type small{font:10px 'Oswald',sans-serif;letter-spacing:.24em;color:var(--ac-soft)}
.tr-type b{display:block;margin-top:12px;font:500 clamp(24px,2.6vw,38px)/1.08 'Oswald',sans-serif;letter-spacing:-.01em;color:#f2ece0}
.tr-type em{display:block;margin-top:10px;font-style:normal;font-size:14px;font-weight:500;letter-spacing:.06em;color:#ded7c9}
.tr-type p{margin:16px 0 0;font-size:13px;line-height:2;color:#b3aea3;word-break:keep-all;overflow-wrap:anywhere}
.tr-type ul{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:0;border-top:1px solid #ffffff1c}
.tr-type li{display:grid;grid-template-columns:118px 1fr;gap:14px;padding:11px 0;border-bottom:1px solid #ffffff14;font-size:12.5px;line-height:1.7}
.tr-type li i{font-style:normal;color:#9c968a;letter-spacing:.06em}
.tr-type li span{color:#ddd7cb}

/* 装備＝暖色の格子 */
.tr-kit{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.tr-kit figure{position:relative;margin:0;overflow:hidden;border:1px solid var(--edge);border-top:2px solid var(--edge-hi);background:#141312;box-shadow:0 16px 30px #0006}
.tr-kit img{width:100%;aspect-ratio:8/5;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.22,1,.36,1)}
.tr-kit figure:hover img{transform:scale(1.05)}
.tr-kit figcaption{padding:18px 20px 20px;background:linear-gradient(180deg,#1e1d1a,#131211)}
.tr-kit figcaption b{display:block;font:500 17px 'Oswald',sans-serif;letter-spacing:.09em;color:#f0eade}
.tr-kit figcaption span{display:block;margin-top:8px;font-size:12.5px;line-height:1.85;color:#b2ada2;word-break:keep-all;overflow-wrap:anywhere}
.tr-kit figcaption b::before{content:"";display:inline-block;width:16px;height:2px;margin-right:10px;vertical-align:middle;background:var(--ac)}

body.trailer-open .goo-band{border-left-color:var(--ac-deep)}
body.trailer-open .steps li{border-top-color:var(--ac-deep)}
body.trailer-open .cta-col:last-child{background:linear-gradient(145deg,#6d5121,#2c2415)}
body.trailer-open .iron-figures b i{color:var(--ac-soft)}
body.trailer-open .iron-actions small{color:var(--ac-soft)}
body.trailer-open .iron-story-body small{color:var(--ac-soft)}

@media(max-width:1000px){
  .tr-types{grid-template-columns:1fr}
  .tr-kit{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){
  body.trailer-open .page-hero{min-height:840px}
  body.trailer-open .page-hero h1{max-width:100%;font-size:16vw;margin:20px 0 16px}
  body.trailer-open .page-hero-inner{padding-bottom:118px}
  body.trailer-open .iron-catch{margin:16px 0 224px}
  body.trailer-open .iron-bike{right:-8%;top:auto;bottom:336px;height:196px;width:88%}
  .tr-split{max-width:100%;margin-top:20px}
  .tr-split div{padding:14px 12px 14px 0}
  .tr-split div+div{padding-left:14px}
  .tr-split b{font-size:19px}
  .tr-badge{left:24px;bottom:22px}
  .tr-badge i{padding:10px 13px;font-size:9px;letter-spacing:.12em}
  .tr-badge i b{font-size:17px}
  .tr-kit{grid-template-columns:1fr}
  .tr-type li{grid-template-columns:96px 1fr;gap:10px;font-size:12px}
}
