/* ============= hub.css — enrichment layer for the three top-level pages
   (index · brands · solutions). Loads AFTER fashion.css. Uses the same
   cream/ink/gold tokens; adds no new colours. ============= */

/* --- sticky pillar rail (solutions hub) --- */
.hub-rail{position:sticky;top:0;z-index:60;background:var(--ink);border-bottom:1px solid rgba(245,241,234,.14)}
.hub-rail .container{display:flex;align-items:center;gap:26px;flex-wrap:wrap;padding-top:13px;padding-bottom:13px}
.hub-rail .lead{font-family:'Inter',sans-serif;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgba(245,241,234,.42)}
.hub-rail a{display:flex;align-items:baseline;gap:8px;white-space:nowrap;font-family:'Inter',sans-serif;font-size:12px;letter-spacing:.06em;color:rgba(245,241,234,.8);text-decoration:none;padding-bottom:2px;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.hub-rail a:hover{color:var(--gold-bright);border-bottom-color:var(--gold-bright)}
.hub-rail a .i{font-size:9px;letter-spacing:.14em;color:var(--gold-bright)}
@media(max-width:900px){.hub-rail{position:static}.hub-rail .container{gap:14px 18px}}

/* --- house line + spec chips inside cards --- */
.house-line{font-family:'Inter',sans-serif;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);margin:0 0 12px}
.hub-card .house-line{margin:-4px 0 12px}
.hub-pillar.featured .house-line,.is-dark .house-line{color:rgba(245,241,234,.55)}
.spec-chips{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 0}
.spec-chips span{font-family:'Inter',sans-serif;font-size:10.5px;letter-spacing:.06em;color:var(--soft);border:1px solid var(--softest);border-radius:2px;padding:4px 8px;background:rgba(255,255,255,.4)}
.hub-pillar.featured .spec-chips span,.is-dark .spec-chips span{color:rgba(245,241,234,.72);border-color:rgba(245,241,234,.2);background:rgba(255,255,255,.04)}

/* --- deep-link row (Intercom cluster) --- */
.deep-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;padding-top:14px;border-top:1px solid var(--softest)}
.deep-links a{font-family:'Inter',sans-serif;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);text-decoration:none;border:1px solid var(--gold-soft);border-radius:2px;padding:6px 10px;transition:background .2s,color .2s}
.deep-links a:hover{background:var(--gold);color:var(--paper)}
.deep-links a b{font-weight:500}
.deep-links a em{font-style:normal;color:var(--soft);margin-left:5px}
.deep-links a:hover em{color:rgba(245,241,234,.7)}
.dossier+.links,.deep-links+.links{margin-top:26px}

/* --- pass 2 --- */
.plate-band video{display:block;width:100%;height:clamp(220px,26vw,360px);object-fit:cover;object-position:center;filter:grayscale(.2) contrast(1.04)}
.brand-tile .spec{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:15px;line-height:1.35;color:var(--soft);margin-top:8px}
.brand-tile.dark .spec{color:rgba(245,241,234,.6)}
.method-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--softer);border:1px solid var(--softer);margin-top:44px}
.method-strip div{background:var(--paper);padding:26px 24px}
.method-strip .n{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:19px;color:var(--gold);margin-bottom:10px}
.method-strip h4,.method-strip h3.was-h4{font-family:'Italiana',serif;font-size:23px;letter-spacing:.02em;margin:0 0 8px;font-weight:400}
.method-strip h4 em,.method-strip h3.was-h4 em{font-family:'Cormorant Garamond',serif}
.method-strip p{font-family:'Cormorant Garamond',serif;font-size:16.5px;line-height:1.5;color:var(--soft);margin:0}
@media(max-width:900px){.method-strip{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.method-strip{grid-template-columns:1fr}}
/* --- product image inside hub cards --- */
.hub-card .card-img{margin:-40px -34px 26px;height:170px;overflow:hidden;position:relative;background:var(--paper-3);border-bottom:1px solid rgba(10,10,10,.14)}
.hub-card .card-img img{width:100%;height:100%;object-fit:cover;object-position:center;filter:grayscale(.15) contrast(1.03);transition:transform .6s ease,filter .4s ease}
.hub-card:hover .card-img img{transform:scale(1.04);filter:none}
.hub-pillar.featured .hub-card .card-img{background:#141414;border-bottom-color:rgba(245,241,234,.16)}
.hub-card .card-img .tag{position:absolute;left:12px;bottom:10px;z-index:2;white-space:nowrap;font-family:'Inter',sans-serif;font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:rgba(245,241,234,.85);background:rgba(10,10,10,.55);padding:5px 9px;backdrop-filter:blur(2px)}

/* --- index table --- */
.index-table{width:100%;border-collapse:collapse;margin-top:28px;font-family:'Inter',sans-serif}
.index-table thead th{text-align:left;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--soft);font-weight:500;padding:0 18px 12px 0;border-bottom:1px solid var(--rule)}
.index-table td{vertical-align:top;padding:16px 18px 16px 0;border-bottom:1px solid var(--softest);font-size:13.5px;line-height:1.55;color:var(--soft)}
.index-table td:first-child{width:23%}
.index-table td a{font-family:'Italiana',serif;font-size:19px;letter-spacing:.02em;color:var(--ink);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s,color .2s}
.index-table td a:hover{color:var(--gold-deep);border-bottom-color:var(--gold-soft)}
.index-table td .sub{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--soft);margin-top:5px}
.index-table td .spec{color:var(--ink)}
@media(max-width:820px){.index-table,.index-table tbody,.index-table tr,.index-table td{display:block;width:100%}.index-table thead{display:none}.index-table tr{border-bottom:1px solid var(--softer);padding:6px 0 14px}.index-table td{border:0;padding:4px 0}.index-table td:first-child{width:auto;padding-top:14px}}

/* --- symptom / problem router --- */
.symptoms{display:grid;grid-template-columns:repeat(2,1fr);gap:0 46px;margin-top:8px}
.symptom{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:baseline;padding:17px 0;border-bottom:1px solid var(--softest);text-decoration:none}
.symptom q{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:19px;line-height:1.4;color:var(--ink);quotes:'“' '”'}
.symptom .to{font-family:'Inter',sans-serif;font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--gold);white-space:nowrap}
.symptom:hover q{color:var(--gold-deep)}
.symptom:hover .to{color:var(--gold-deep)}
@media(max-width:900px){.symptoms{grid-template-columns:1fr;gap:0}}

/* --- house dossier strip (brands) --- */
.dossier{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--softest);border:1px solid var(--softest);margin:20px 0 0}
.dossier div{background:var(--paper);padding:13px 14px}
.dossier .l{font-family:'Inter',sans-serif;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--soft);margin-bottom:6px}
.dossier .v{font-family:'Cormorant Garamond',serif;font-size:17px;line-height:1.35;color:var(--ink)}
@media(max-width:900px){.dossier{grid-template-columns:repeat(2,1fr)}}

/* --- house mark (logo) --- */
.house-mark{height:34px;margin:0 0 16px;display:flex;align-items:center}
.house-mark img{max-height:34px;max-width:170px;width:auto;object-fit:contain;filter:grayscale(1) contrast(1.05);opacity:.82}
.maison-card:hover .house-mark img{filter:none;opacity:1}

/* --- cluster (home: inside one solution) --- */
.cluster{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:34px}
.cluster a{display:flex;flex-direction:column;gap:9px;padding:26px 24px 24px;background:var(--paper);border:1px solid var(--softer);text-decoration:none;transition:border-color .25s,transform .25s,background .25s}
.cluster a:hover{border-color:var(--gold-soft);transform:translateY(-3px);background:var(--cream)}
.cluster .n{font-family:'Inter',sans-serif;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.cluster h4,.cluster h3.was-h4{font-family:'Italiana',serif;font-size:26px;letter-spacing:.02em;color:var(--ink);margin:0}
.cluster p{font-family:'Cormorant Garamond',serif;font-size:17px;line-height:1.5;color:var(--soft);margin:0}
.cluster .fig{margin-top:auto;padding-top:14px;font-family:'Inter',sans-serif;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--soft);border-top:1px solid var(--softest)}
@media(max-width:900px){.cluster{grid-template-columns:1fr}}

/* --- locations strip --- */
.loc-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--softer);border-top:1px solid var(--softer);border-bottom:1px solid var(--softer)}
.loc-strip a{background:var(--paper);padding:24px 20px;text-decoration:none;transition:background .25s}
.loc-strip a:hover{background:var(--cream)}
.loc-strip .city{font-family:'Italiana',serif;font-size:24px;letter-spacing:.03em;color:var(--ink)}
.loc-strip .role{font-family:'Inter',sans-serif;font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--soft);margin-top:7px}
@media(max-width:1000px){.loc-strip{grid-template-columns:repeat(2,1fr)}.loc-strip a:last-child{grid-column:1/-1}}

/* --- certification / norms line --- */
.norms{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 30px;font-family:'Italiana',serif;font-size:22px;letter-spacing:.04em;color:var(--ink)}
.norms span.d{color:var(--gold)}

/* L9b · hub grids collapse fully on a phone */
@media(max-width:560px){.method-strip,.dossier,.loc-strip,.cluster,.symptoms{grid-template-columns:1fr}}