@import url('../css/tokens.css');

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: #050708; color: var(--cim-text); font: 14px/1.5 var(--font-body); }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
:focus-visible { outline: 2px solid var(--cim-orange); outline-offset: 3px; }
.cim02-skip { position: fixed; z-index: 20; top: 8px; left: 8px; padding: 10px 14px; background: #f1f2f2; color: #050708; transform: translateY(-150%); }
.cim02-skip:focus { transform: none; }
.cim02-header { border-bottom: 1px solid rgba(233,172,53,.2); background: #090c0e; }
.cim02-header-inner { display: flex; align-items: center; gap: clamp(16px,3vw,48px); width: min(100% - 32px, 1440px); min-height: 88px; margin: auto; }
.cim02-brand { display: inline-flex; align-items: center; flex: none; gap: 12px; font-weight: 700; letter-spacing: .12em; color: var(--cim-gold-bright); text-transform: uppercase; }
.cim02-brand img { display: block; object-fit: contain; }
.cim02-nav { display: flex; align-items: center; flex-wrap: wrap; gap: clamp(12px,1.6vw,26px); margin-left: auto; }
.cim02-nav a { color: var(--cim-text-muted); }
.cim02-nav a:hover, .cim02-nav a:focus-visible { color: var(--cim-gold-bright); }
.cim02-languages { display: flex; flex: none; gap: 4px; margin-left: auto; }
.cim02-languages a { padding: 6px 8px; border: 1px solid #42494c; border-radius: 4px; color: var(--cim-text-muted); }
.cim02-languages a[aria-current] { color: var(--cim-gold-bright); border-color: var(--cim-gold); }
.cim02-main { width: min(100% - 32px, 1440px); min-height: 70vh; margin: auto; padding: clamp(40px,7vw,96px) 0 80px; }
.cim02-intro { max-width: 850px; }
.cim02-kicker { margin: 0 0 12px; color: var(--cim-orange); font-size: .75rem; font-weight: 700; letter-spacing: .18em; }
h1 { margin: 0; color: var(--cim-gold-bright); font-size: clamp(2.2rem,4.5vw,4.8rem); line-height: 1.1; letter-spacing: -.04em; }
.cim02-lead { max-width: 72ch; margin: 24px 0 32px; color: #d5d7d8; font-size: clamp(1rem,1.35vw,1.3rem); line-height: 1.65; }
.cim02-search { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; max-width: 850px; padding: 18px; border: 1px solid var(--cim-border); border-radius: var(--radius-card); background: #0d1012; }
.cim02-search label { width: 100%; font-weight: 700; }
.cim02-search input { flex: 1 1 240px; min-width: 0; min-height: 48px; padding: 10px 14px; border: 1px solid #555d61; border-radius: 4px; background: #050708; color: white; }
.cim02-search button, .cim02-action { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 10px 20px; border: 1px solid var(--cim-orange); border-radius: 4px; background: var(--cim-orange); color: white; cursor: pointer; font-weight: 700; }
.cim02-search button:hover, .cim02-action:hover { background: var(--cim-orange-hover); }
.cim02-scope { color: var(--cim-text-muted); }
.cim02-status { display: inline-block; margin: 0 0 28px; padding: 10px 14px; border: 1px solid rgba(233,172,53,.35); border-radius: 4px; color: var(--cim-gold-bright); background: rgba(233,172,53,.07); }
.cim02-section { margin-top: 44px; }
.cim02-section h2 { margin: 0 0 16px; color: var(--cim-gold-bright); font-size: 1.35rem; }
.cim02-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,270px),1fr)); gap: 14px; }
.cim02-card { display: flex; flex-direction: column; gap: 10px; min-height: 140px; padding: 22px; border: 1px solid var(--cim-border); border-radius: var(--radius-card); background: linear-gradient(145deg,#15191b,#090c0e); color: var(--cim-gold-bright); font-size: 1.13rem; font-weight: 700; }
.cim02-card span { color: #d3d5d6; font-size: .92rem; font-weight: 400; line-height: 1.45; }
.cim02-card:hover, .cim02-card:focus-visible { border-color: var(--cim-orange); background: linear-gradient(145deg,#1e1a16,#0c0e0f); }
.cim02-note { max-width: 760px; padding: 22px; border: 1px solid var(--cim-border); border-radius: var(--radius-card); background: #0d1012; }
.cim02-note p { margin: 0 0 16px; }
.cim02-empty { padding: 22px; border: 1px solid var(--cim-border); border-radius: 4px; }
.cim02-share { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; margin-top: 46px; }
.cim02-share-status { color: var(--cim-gold-bright); }
.cim02-footer { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 18px; width: min(100% - 32px,1440px); margin: auto; padding: 26px 0 40px; border-top: 1px solid var(--cim-border); color: var(--cim-text-muted); }
.cim02-footer a { color: var(--cim-gold-bright); }
@media (max-width: 760px) {
  .cim02-header-inner { flex-wrap: wrap; gap: 12px; padding: 14px 0; }
  .cim02-brand { font-size: .85rem; }
  .cim02-nav { width: 100%; order: 3; margin: 0; overflow-x: auto; flex-wrap: nowrap; white-space: nowrap; padding: 8px 0; }
  .cim02-nav a { min-height: 44px; display: inline-flex; align-items: center; }
  .cim02-languages { margin-left: auto; }
  .cim02-main { padding-top: 40px; }
}

/* R07 personal platform */
.cim02-user-nav{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-left:auto}.cim02-user-nav a{color:#d8e0e2;font-size:.84rem}.cim02-mini-action{padding:7px 10px;border:1px solid var(--cim-orange);border-radius:4px}
.cim02-form{display:grid;gap:16px;width:min(100%,720px);padding:clamp(20px,4vw,34px);border:1px solid rgba(233,172,53,.3);border-radius:var(--radius-card);background:linear-gradient(145deg,#15191b,#090c0e)}
.cim02-field{display:grid;gap:7px;color:#e7e9ea;font-weight:700}.cim02-field input,.cim02-field textarea,.cim02-field select{width:100%;min-height:48px;padding:10px 12px;border:1px solid #59666b;border-radius:4px;background:#050708;color:#fff}.cim02-field textarea{min-height:120px;resize:vertical}.cim02-field input:disabled{color:#a9b2b5;background:#101416}
.cim02-check{display:flex;align-items:flex-start;gap:10px;color:#d7dcde}.cim02-check input{flex:none;width:20px;height:20px;accent-color:var(--cim-orange)}.cim02-form-status{min-height:1.5em;margin:0;color:#b9c5c8}.cim02-form-status.success{color:#9ee6af}.cim02-form-status.error{color:#ffaea0}.cim02-message{width:min(100%,900px);padding:14px 16px;border-left:3px solid var(--cim-gold);background:#101416;color:#dce1e2}
.cim02-card-main{display:flex;flex-direction:column;flex:1}.cim02-personal-controls{display:flex;flex-wrap:wrap;gap:8px;padding:12px 18px 18px;border-top:1px solid #273238}.cim02-small-button,.cim02-text-button{min-height:40px;padding:8px 13px;border:1px solid #68777d;border-radius:4px;background:#101518;color:#f2d69e;cursor:pointer}.cim02-text-button{border:0;padding:4px 6px;text-decoration:underline}
.cim02-community-feed{display:grid;gap:18px}.cim02-post{padding:clamp(20px,4vw,32px);border:1px solid rgba(233,172,53,.28);border-radius:var(--radius-card);background:#0d1113}.cim02-post h3{color:#f3e2bb;font-size:1.45rem}.cim02-user-content{white-space:pre-wrap;overflow-wrap:anywhere;color:#e4e7e8;line-height:1.7}.cim02-comment{margin-top:10px;padding:14px 16px;border-left:3px solid #41535a;background:#080b0c}.cim02-comment-form{display:grid;gap:10px;border-top:1px solid #273238;padding-top:18px}.cim02-notification{margin-top:10px;padding:18px;border:1px solid #35444a;border-radius:4px;background:#0b0f11}.cim02-notification.is-unread{border-left:4px solid var(--cim-orange)}.cim02-notification time{color:#9cafb4;font-size:.8rem}
@media(max-width:1050px){.cim02-header-inner{flex-wrap:wrap;padding:12px 0}.cim02-user-nav{width:100%;order:4;margin:0}.cim02-nav{order:3;margin-left:0}}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* R06 product pages retain the R05 dark, photographic Car Is Magic language. */
body { background: #070a0c; }
.cim02-header { position: relative; z-index: 2; background: rgba(6, 10, 12, .96); }
.cim02-header-inner { width: min(calc(100% - 32px), 1440px); }
.cim02-nav a[aria-current="page"] { color: var(--cim-gold-bright); border-bottom: 2px solid var(--cim-orange); }
.cim02-main { width: min(100%, 1440px); padding: 0 16px 88px; }
.cim02-masthead {
  display: flex; align-items: end; min-height: clamp(280px, 33vw, 470px);
  margin: 0 -16px 38px; border-bottom: 1px solid rgba(233,172,53,.3);
  background: linear-gradient(90deg, rgba(4,7,9,.94) 4%, rgba(4,7,9,.75) 47%, rgba(4,7,9,.28) 100%),
    url('../assets/images/masters/page-scene/02_fortsettelse.png') center 45% / cover no-repeat;
}
.cim02-masthead-inner { width: min(100% - 32px, 1320px); margin: 0 auto; padding: 42px 0 50px; }
.cim02-back { display: inline-block; margin-bottom: 22px; color: #e5bd73; font-weight: 700; }
.cim02-back:hover, .cim02-back:focus-visible { color: #fff0ca; }
.cim02-masthead h1 { max-width: 16ch; text-wrap: balance; text-shadow: 0 3px 20px #000; }
.cim02-masthead .cim02-lead { max-width: 68ch; margin-bottom: 0; color: #e1e5e5; text-shadow: 0 2px 12px #000; }
.cim02-main > :not(.cim02-masthead) { width: min(100%, 1320px); margin-left: auto; margin-right: auto; }
.cim02-section { margin-top: 42px; }
.cim02-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr)); gap: 18px; }
.cim02-card { overflow: hidden; padding: 0; min-height: 0; border-color: rgba(233,172,53,.22); box-shadow: 0 18px 36px rgba(0,0,0,.15); }
.cim02-content-card { display: block; }
.cim02-media-image { display: block; width: 100%; height: clamp(175px, 18vw, 240px); object-fit: cover; }
.cim02-card-copy { display: flex; flex-direction: column; gap: 8px; padding: 20px 22px 22px; }
.cim02-card h3 { margin: 0; color: #f3e2bb; font-size: clamp(1.15rem, 1.5vw, 1.5rem); line-height: 1.2; }
.cim02-card p { margin: 0; color: #d0d5d6; font-size: .93rem; font-weight: 400; line-height: 1.5; }
.cim02-eyebrow { color: var(--cim-orange); font-size: .7rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.cim02-card-status { margin-top: auto; padding-top: 8px; color: #aac6ce; font-size: .75rem; font-weight: 600; }
.cim02-route-card { padding: 23px; border-top: 2px solid var(--cim-orange); }
.cim02-route-card h3 { margin: 10px 0 0; }
.cim02-search { max-width: none; margin-top: -8px; }
.cim02-scope { max-width: 95ch; margin-top: 18px; color: #b5c4c8; line-height: 1.6; }
.cim02-empty { width: min(100%, 920px); margin-top: 24px; padding: clamp(22px,4vw,36px); border: 1px solid rgba(233,172,53,.3); border-radius: var(--radius-card); background: linear-gradient(145deg,#15191b,#090c0e); }
.cim02-empty h2 { margin: 0 0 10px; color: var(--cim-gold-bright); font-size: clamp(1.35rem,2vw,1.8rem); }
.cim02-empty p { margin: 0; color: #d2d9db; line-height: 1.65; }
.cim02-empty .cim02-action { margin-top: 20px; }
.cim02-filter { display: flex; flex-wrap: wrap; gap: 8px; }
.cim02-filter a { padding: 10px 15px; border: 1px solid #46545a; border-radius: 4px; color: #d7e0e2; }
.cim02-filter a[aria-current="page"] { border-color: var(--cim-orange); color: #fff; background: rgba(241,90,36,.18); }
.cim02-article { max-width: 1000px; }
.cim02-meta { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 25px; color: #ebbd74; font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; }
.cim02-meta span + span::before { content: '·'; margin-right: 10px; color: #7d898e; }
.cim02-figure { margin: 0 0 28px; }
.cim02-detail-image { display: block; width: 100%; max-height: 520px; object-fit: cover; border: 1px solid rgba(233,172,53,.28); border-radius: var(--radius-card); }
.cim02-figure figcaption { margin-top: 8px; color: #9fb1b5; font-size: .78rem; }
.cim02-video { width: 100%; max-height: 560px; background: #000; }
.cim02-article-body { max-width: 74ch; color: #e6e9ea; font-size: 1.05rem; line-height: 1.78; }
.cim02-article-body > p { margin: 0 0 1.4em; }
.cim02-article-body .cim02-empty { margin-left: 0; }
.cim02-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 30px; }
.cim02-tags span { padding: 6px 11px; border: 1px solid #3f535b; border-radius: 20px; color: #c1d2d7; font-size: .75rem; }
.cim02-pager { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 45px; }
.cim02-pager a { padding: 10px 14px; border: 1px solid #65727a; border-radius: 4px; color: #f4d397; }
.cim02-footer { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 18px; }
.cim02-footer-art { grid-row: span 2; width: min(100%, 330px); height: auto; }
.cim02-footer-nav { display: flex; flex-wrap: wrap; justify-content: end; gap: 10px 18px; }
.cim02-footer p { margin: 0; text-align: right; }
@media (max-width: 760px) {
  .cim02-nav { flex-wrap: wrap; overflow: visible; white-space: normal; gap: 2px 14px; }
  .cim02-masthead { min-height: 330px; background-position: 58% 45%; }
  .cim02-masthead-inner { padding-bottom: 34px; }
  .cim02-masthead h1 { font-size: clamp(2.05rem,8vw,3.3rem); }
  .cim02-media-image { height: 220px; }
  .cim02-footer { grid-template-columns: 1fr; }
  .cim02-footer-art { grid-row: auto; width: 230px; }
  .cim02-footer-nav { justify-content: start; }
  .cim02-footer p { text-align: left; }
}

/* Owner whole-card navigation keeps independent account actions above the link. */
.cim02-content-card { position:relative; }
.cim02-content-card > .cim02-card-main::after { content:''; position:absolute; inset:0; z-index:1; border-radius:inherit; }
.cim02-content-card > .cim02-personal-controls { position:relative; z-index:2; }
.cim02-content-card:has(.cim02-card-main:focus-visible) { outline:2px solid #fff0b3; outline-offset:4px; }
.cim02-content-card > .cim02-card-main:focus-visible { outline:none; }
/* Existing relevant action surfaces share graphite, amber and pressed depth. */
:is(.cim02-action,.cim02-small-button,.cim02-mini-action,.cim02-search button) {
  box-shadow:inset 0 1px 0 rgb(255 236 195 / 18%),0 3px 10px rgb(0 0 0 / 25%);
  transition:background-color 160ms,border-color 160ms,box-shadow 160ms,transform 100ms;
}
:is(.cim02-action,.cim02-search button) { color:#160f08; }
@media (hover:hover) and (pointer:fine) {
  :is(.cim02-action,.cim02-small-button,.cim02-mini-action,.cim02-search button):not(:disabled):hover {
    border-color:#ffd08a; box-shadow:inset 0 1px 0 rgb(255 236 195 / 35%),0 0 16px rgb(225 151 48 / 18%);
  }
  :is(.cim02-small-button,.cim02-mini-action):not(:disabled):hover { background:#30271c; color:#fff0cf; }
}
:is(.cim02-action,.cim02-small-button,.cim02-mini-action,.cim02-search button):not(:disabled):active {
  transform:translateY(1px); box-shadow:inset 0 3px 10px rgb(0 0 0 / 50%);
}
:is(.cim02-action,.cim02-small-button,.cim02-mini-action,.cim02-search button):focus-visible { outline:2px solid #fff0b3; outline-offset:3px; }
:is(.cim02-action,.cim02-small-button,.cim02-search button):disabled { opacity:.6; cursor:default; }
@media (prefers-reduced-motion:reduce) {
  :is(.cim02-action,.cim02-small-button,.cim02-mini-action,.cim02-search button) { transition:none; transform:none; }
}
@media (forced-colors:active) {
  .cim02-content-card:has(.cim02-card-main:focus-visible),:is(.cim02-action,.cim02-small-button,.cim02-mini-action,.cim02-search button):focus-visible { outline-color:Highlight; }
}

/* CEV4: entire existing discovery cards are native links; no preview strip. */
.cim02-discovery-card { text-decoration:none; transition:border-color 160ms,box-shadow 160ms,background-color 160ms; }
.cim02-discovery-card:focus-visible { outline:2px solid #fff0b3; outline-offset:4px; }
:is(.cim02-discovery-card,.cim02-content-card):has(.cim02-card-main:active),.cim02-discovery-card:active { border-color:#f6c575; box-shadow:inset 0 3px 16px #0009; background:linear-gradient(145deg,#272018,#090c0e); }
.cim02-content-card:has(.cim02-card-main:hover),.cim02-discovery-card:hover { box-shadow:inset 0 1px 0 #f5d49626,0 14px 28px #0006; }
:is(.cim02-action,.cim02-small-button,.cim02-search button) { font-size:1rem; font-weight:650; }
@media (prefers-reduced-motion:reduce) { .cim02-discovery-card { transition:none; } }
@media (forced-colors:active) { .cim02-discovery-card:focus-visible { outline-color:Highlight; } }