/* MATCHA reference: section order, image-led hero, centered headings, three
   services, case cards, staggered NEWS/COLUMN, contact, two lower banners.
   All visual tokens and typography remain LPF's black/turquoise system. */
.r-reference {--m-space:112px}
.m-container {width:min(calc(100% - 64px),1080px);margin-inline:auto}
.m-wide {width:min(calc(100% - 72px),1368px)}
.m-heading {text-align:center;margin:0 0 32px}
.m-heading>p,.m-eyebrow {font:700 13px/1.5 Arial,sans-serif;letter-spacing:.16em;color:var(--accent-primary);margin:0 0 12px!important}
.r-reference .m-heading h2 {font-size:clamp(28px,3vw,40px);font-weight:800;line-height:1.4}
.m-section-lead {text-align:center;font-size:17px;line-height:1.9;color:var(--text-secondary);margin:0 auto 48px!important}
.m-center {text-align:center;margin-top:40px}
.m-center .r-button {min-width:280px;justify-content:center}
.m-hero {height:calc(100svh - 136px);min-height:560px;max-height:780px;position:relative;isolation:isolate;margin:0 24px;overflow:hidden;border-radius:0 0 12px 12px;background:var(--bg-deep)}
.m-hero-panels {position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;z-index:-2}
.m-hero figure {margin:0;position:relative;min-width:0;overflow:hidden;background:var(--surface)}
.m-hero figure>img {width:100%;height:100%;object-fit:cover;object-position:center 42%;display:block}
.m-hero figure:nth-child(2)>img {object-position:center 35%}
.m-hero figure:nth-child(3)>img {object-position:55% center}
.m-hero figure::after {content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(3,9,11,.07),rgba(3,9,11,.48) 45%,rgba(3,9,11,.65) 75%,rgba(3,9,11,.85))}
.m-hero figcaption {position:absolute;z-index:2;inset:auto 24px 24px}
.m-hero figcaption a {color:white;text-decoration:none;display:flex;align-items:center;justify-content:space-between;font:600 14px/1.5 Arial,sans-serif}
.m-hero figcaption a:hover {text-decoration:underline}
.m-hero figcaption span {font-size:22px;color:var(--accent-mint)}
.m-hero-copy {position:absolute;left:32px;right:32px;top:50%;transform:translateY(-56%);text-align:center;pointer-events:none;color:var(--text-primary)}
.m-hero-copy>p {font:600 13px/1.5 Arial,sans-serif;letter-spacing:.24em;margin:0 0 24px!important;color:var(--text-secondary)}
.r-reference .m-hero h1 {font-size:clamp(36px,4.5vw,64px);font-weight:900;line-height:1.5;letter-spacing:.04em;color:#fff;text-shadow:0 2px 24px #03090b}
.m-hero h1 span {color:var(--accent-mint)}
.m-scroll {position:absolute;left:50%;bottom:62px;transform:translateX(-50%);font:11px/1.5 Arial,sans-serif;letter-spacing:.18em;color:#fff!important;text-decoration:none;display:flex;gap:20px;align-items:center}
.m-scroll span {font-size:22px;color:var(--accent-primary)}
.m-about {padding:var(--m-space) 0}
.m-about-lead {text-align:center;font-size:clamp(20px,2vw,28px);font-weight:700;line-height:1.8;margin-bottom:64px!important}
.m-about-lead span {color:var(--accent-primary);text-decoration:underline;text-underline-offset:8px;text-decoration-thickness:1px}
.m-about-split {display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;margin-right:max(32px,calc((100% - 1080px)/2))}
.m-about-visual {height:430px;overflow:hidden;border-radius:0 12px 12px 0}
.m-about-visual img {width:100%;height:100%;object-fit:cover;display:block}
.m-about-text {max-width:480px;font-size:16px;line-height:2;color:var(--text-secondary)}
.m-about-text p {margin-bottom:22px}
.m-about-text .r-button {margin-top:12px}
.m-services {position:relative;padding:var(--m-space) 0;background:var(--surface);border-top:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle)}
.m-service-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.m-service {min-width:0;text-align:center}
.m-service-visual {height:285px;display:block;position:relative;overflow:hidden;border-radius:12px;background:var(--bg-deep);border:1px solid var(--border-subtle)}
.m-service-photo {width:100%;height:100%;object-fit:cover;display:block;object-position:center 40%}
.m-service-visual::after {content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 32%,rgba(3,9,11,.76))}
.m-service-number {position:absolute;top:16px;left:16px;z-index:2;font:600 16px Arial,sans-serif;background:var(--bg-deep);padding:8px 12px;border-radius:4px;color:var(--accent-primary)}
.m-service-logo {position:absolute;inset:auto 20px 20px;z-index:2;height:62px;padding:10px 16px;background:rgba(255,255,255,.96);border-radius:8px;display:grid;place-items:center}
.m-service-logo img {max-width:100%;max-height:42px;width:auto;height:auto}
.r-reference .m-service h3 {font-size:22px;line-height:1.6;margin:24px 0 16px}
.m-service>p {font-size:16px;line-height:1.8;color:var(--text-secondary);max-width:360px;margin:0 auto 16px!important}
.m-service-links {display:flex;gap:24px;flex-wrap:wrap;justify-content:center;align-items:center;font-size:14px}
.m-service-links>a:last-child {color:var(--text-secondary);text-underline-offset:5px}
.m-quiz {margin-top:72px;padding-top:48px;border-top:1px solid var(--border-subtle);display:grid;grid-template-columns:1fr 1.6fr;gap:48px;align-items:center}
.r-reference .m-quiz h3 {font-size:24px;margin:0 0 16px}
.m-quiz p:not(.m-eyebrow) {font-size:16px;color:var(--text-secondary);max-width:340px}
.m-quiz-links {display:grid;gap:12px}
.m-quiz-links>a {display:flex;align-items:center;gap:20px;padding:12px;background:var(--bg-deep);border:1px solid var(--border-subtle);border-radius:8px;text-decoration:none}
.m-quiz-links>a:hover {background:var(--surface-hover)}
.m-quiz-links img {width:96px;height:64px;object-fit:cover;object-position:top;border-radius:4px}
.m-quiz-links span {flex:1;min-width:0}
.m-quiz-links strong {display:block;font-size:17px}
.m-quiz-links small {display:block;font-size:14px;color:var(--text-muted);margin-top:4px}
.m-quiz-links b {color:var(--accent-primary);font-size:20px;font-weight:400}
.m-cases {padding:var(--m-space) 0;background:var(--bg-deep)}
.m-case-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.m-case {background:var(--surface);border:1px solid var(--border-subtle);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.m-case>a:first-child {display:block;text-decoration:none;flex:1}
.m-case>a:first-child>img {display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.m-case-text {padding:24px}
.m-case-tag {font-size:12px!important;color:var(--accent-primary)!important;margin:0 0 16px!important}
.r-reference .m-case h3 {font-size:21px;line-height:1.6;margin:0 0 16px}
.m-case-text>p {font-size:16px;line-height:1.8;color:var(--text-secondary)}
.m-case-more {display:block;color:var(--accent-cyan);font-size:14px;text-decoration:underline;text-underline-offset:5px;margin-top:20px}
.m-proof {font-size:13px;color:var(--text-muted)!important;margin:0 24px 24px;text-underline-offset:5px}
.m-case-note {font-size:14px;text-align:center;color:var(--text-muted);margin:24px 0 0!important}
.m-updates {padding:var(--m-space) 0;background:var(--bg-base)}
.m-news-row,.m-column-row {width:min(calc(100% - 64px),1080px);margin:auto;display:grid;gap:64px;align-items:center}
.m-news-row {grid-template-columns:.65fr 1.35fr}
.m-update-intro .m-heading {text-align:left}
.m-update-intro>p {font-size:16px;line-height:1.9;color:var(--text-secondary)}
.m-update-intro small {font-size:12px;color:var(--text-muted)}
.m-news-list {padding:12px 32px;background:var(--surface);border:1px solid var(--border-subtle);border-radius:12px}
.m-news-list>a {display:grid;grid-template-columns:auto auto 1fr auto;gap:10px 16px;align-items:center;padding:24px 0;text-decoration:none;border-bottom:1px solid var(--border-subtle)}
.m-news-list>a:last-child {border-bottom:0}
.m-news-list time {font:13px Arial,sans-serif;color:var(--text-muted)}
.m-news-kind {font-size:11px;padding:3px 8px;background:var(--bg-deep);border:1px solid var(--border-subtle);border-radius:4px;color:var(--text-secondary)}
.r-reference .m-news-list h3 {grid-row:2;grid-column:1/4;font-size:16px;line-height:1.7;font-weight:500}
.m-news-list>a>span:last-child {grid-column:4;grid-row:1/3;color:var(--accent-primary)}
.m-column-row {grid-template-columns:1.6fr .7fr;margin-top:112px}
.m-note-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.m-note-card {min-width:0;display:block;text-decoration:none}
.m-note-card>img {width:100%;aspect-ratio:16/9;object-fit:cover;border:1px solid var(--border-subtle);border-radius:8px;display:block;margin-bottom:20px}
.m-note-card>time {display:block;font:12px Arial,sans-serif;color:var(--text-muted);margin-bottom:12px}
.r-reference .m-note-card h3 {font-size:15px;font-weight:500;line-height:1.8;margin-bottom:16px}
.m-note-card>span {font-size:13px;color:var(--accent-cyan);text-decoration:underline;text-underline-offset:5px}
.m-contact {position:relative;padding:80px 0;background:linear-gradient(110deg,rgba(3,9,11,.95),rgba(4,17,20,.88)),url('/assets/lpf-ai-workbench.png') center/cover;border-block:1px solid var(--border-subtle)}
.m-contact>.m-container {display:flex;align-items:center;justify-content:space-between;gap:48px}
.r-reference .m-contact h2 {font-size:clamp(28px,3vw,40px);line-height:1.5;margin:0 0 24px}
.m-contact p:not(.m-eyebrow) {font-size:16px;line-height:1.8;color:var(--text-secondary)}
.m-contact-actions {display:flex;gap:16px;flex-wrap:wrap;margin-top:32px}
.m-contact-qr {text-align:center;flex-shrink:0}
.m-contact-qr img {display:block;width:160px;height:160px;border-radius:8px;background:white;padding:8px;margin:auto}
.m-contact-qr p {font-size:13px!important;margin:16px 0 0!important}
.m-bottom-links {display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:24px}
.m-bottom-links>a {display:flex;align-items:center;justify-content:space-between;gap:24px;position:relative;isolation:isolate;padding:56px 48px;text-decoration:none;overflow:hidden;border-radius:12px;min-height:220px;border:1px solid var(--border-subtle)}
.m-bottom-links>a>img {position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center 40%}
.m-bottom-links>a::after {content:"";position:absolute;inset:0;background:rgba(3,9,11,.8);z-index:-1}
.m-bottom-links small {display:block;font:700 12px Arial,sans-serif;letter-spacing:.14em;color:var(--accent-primary);margin-bottom:12px}
.m-bottom-links strong {display:block;font-size:28px;line-height:1.5}
.m-bottom-links em {display:block;font-style:normal;font-size:14px;color:var(--text-secondary);margin-top:12px}
.m-bottom-links b {font-size:28px;font-weight:400;color:var(--accent-primary)}
.r-reference .r-footer {border-top:0}
.m-services,.m-cases,.m-about,.m-updates,#quiz,#news,#column {scroll-margin-top:152px}
@media(min-width:801px) and (max-width:1150px){
 .r-reference .r-nav {gap:16px}.r-reference .r-nav a{font-size:12px}.m-about-split{gap:40px}.m-service-grid{gap:20px}.m-service-visual{height:240px}.m-news-row,.m-column-row{gap:40px}.m-column-row{grid-template-columns:1.5fr 1fr}.m-note-grid{gap:16px}
}
@media(max-width:959px){.m-service-grid{grid-template-columns:1fr;gap:48px;max-width:620px;margin:auto}.m-service-visual{height:340px}.m-case-grid{grid-template-columns:1fr}.m-case>a:first-child{display:grid;grid-template-columns:1fr 1.2fr}.m-case>a:first-child>img{height:100%;aspect-ratio:auto;object-fit:cover}.m-proof{align-self:end}.m-quiz{grid-template-columns:1fr 1.5fr}}
@media(max-width:800px){
 .r-reference{--m-space:64px}.m-container,.m-wide,.m-news-row,.m-column-row{width:calc(100% - 40px)}
 .m-hero{height:580px;min-height:0;max-height:none;margin:0 12px;border-radius:0 0 8px 8px}
 .m-hero-panels{gap:8px;grid-template-columns:repeat(3,minmax(0,1fr))}
 .m-hero figure>img{object-position:48% center}.m-hero figure:nth-child(2)>img{object-position:50% center}.m-hero figure:nth-child(3)>img{object-position:62% center}
 .m-hero figure::after{background:linear-gradient(180deg,rgba(3,9,11,.1),rgba(3,9,11,.55) 35%,rgba(3,9,11,.7) 80%,rgba(3,9,11,.88))}
 .m-hero-copy{left:16px;right:16px;transform:translateY(-55%)}
 .r-reference .m-hero h1{font-size:clamp(28px,5.6vw,40px);line-height:1.7;letter-spacing:0}.m-hero h1 span{display:block}
 .m-hero-copy>p{font-size:10px;letter-spacing:.2em;margin-bottom:24px!important}
 .m-hero figcaption{left:8px;right:8px;bottom:20px}.m-hero figcaption a{font-size:10px;gap:4px}.m-hero figcaption span{font-size:14px}
 .m-scroll{bottom:68px;font-size:10px}.m-heading{margin-bottom:24px}.m-heading>p,.m-eyebrow{font-size:12px}
 .m-section-lead{font-size:16px;margin-bottom:32px!important}.m-about-lead{font-size:20px;margin-bottom:40px!important}
 .m-about-split{grid-template-columns:1fr;margin-right:0;gap:32px}.m-about-visual{height:280px;margin-right:20px}
 .m-about-text{width:calc(100% - 40px);max-width:none;margin:auto}.m-about-text .r-button{width:auto}
 .m-quiz{margin-top:48px;padding-top:40px;grid-template-columns:1fr;gap:24px}.m-quiz-links img{width:80px;height:56px}.m-quiz-links>a{gap:12px}
 .m-news-row,.m-column-row{grid-template-columns:1fr;gap:24px}.m-column-row{margin-top:64px}
 .m-column-row>.m-update-intro{grid-row:1}.m-news-list{padding:8px 20px}.m-news-list>a{padding:20px 0}
 .m-update-intro .m-heading{margin-bottom:16px}.m-update-intro>p{margin-bottom:12px}
 .m-note-grid{grid-template-columns:1fr;gap:24px}.m-note-card{display:grid;grid-template-columns:112px 1fr;gap:8px 16px;align-content:start}
 .m-note-card>img{grid-column:1;grid-row:1/4;margin:0;width:112px;height:88px}.m-note-card>time{margin:0}.r-reference .m-note-card h3{font-size:15px;margin:0}.m-note-card>span{grid-column:2}
 .m-contact{padding:56px 0}.m-contact>.m-container{display:grid;grid-template-columns:1fr;gap:32px}.m-contact-actions{display:grid;gap:12px}
 .m-contact-qr{display:flex;gap:24px;align-items:center;justify-content:center}.m-contact-qr img{width:112px;height:112px;margin:0}.m-contact-qr p{text-align:left;margin:0!important}
 .m-bottom-links{grid-template-columns:1fr;gap:16px;padding:20px}.m-bottom-links>a{padding:32px 24px;min-height:180px}.m-bottom-links strong{font-size:24px}
 .m-services,.m-cases,.m-about,.m-updates,#quiz,#news,#column{scroll-margin-top:144px}
}
@media(max-width:540px){.m-service-visual{height:280px}.m-case>a:first-child{display:block}.m-case>a:first-child>img{height:auto;aspect-ratio:16/9}.m-case-text{padding:24px}.m-case-grid{gap:24px}.m-hero figcaption a{font-size:9px}.m-note-card{grid-template-columns:96px 1fr}.m-note-card>img{width:96px;height:76px}}
@media(prefers-reduced-motion:reduce){.r-reference *{scroll-behavior:auto}}

/* Match the approved business-card headline and keep the emphasized phrase together. */
@media(max-width:800px){.r-reference .m-hero h1{font-size:clamp(26px,7vw,40px)}.m-hero h1 span{display:inline}}
.m-hero h1 .r-accent{text-shadow:none}
