/* Published work and explanatory illustrations share the existing forest/gold identity. */
.portfolio-carousel [hidden],.portfolio-controls[hidden] { display:none!important; }
.portfolio-carousel { isolation:isolate; touch-action:pan-y; }
.portfolio-carousel:focus-visible { outline:3px solid #e8bc72; outline-offset:5px; }
.portfolio-slides { min-width:0; }
.portfolio-slide { margin:0; }
.portfolio-photo-link { display:block; background:#162c2b; }
.hero-feature.portfolio-carousel .portfolio-slide img { display:block; width:100%; height:clamp(230px,36vw,360px); object-fit:cover; object-position:center; }
.hero-feature.portfolio-carousel figcaption { min-height:116px; padding:18px 22px; gap:5px; }
.hero-feature.portfolio-carousel figcaption strong { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.portfolio-slide time { color:#cbd8cf; font-size:.73rem; line-height:1.6; }
.portfolio-image-error { min-height:clamp(230px,36vw,360px); margin:0; padding:48px 24px; display:flex; gap:16px; align-items:center; justify-content:center; flex-direction:column; background:#162c2b; color:#f7f1e2; text-align:center; }
.portfolio-image-error a { color:#eccb86; text-decoration:underline; text-underline-offset:4px; }
.portfolio-controls { display:grid; grid-template-columns:44px minmax(0,1fr) 44px; align-items:center; gap:4px; padding:8px 12px 12px; border-top:1px solid #e8bc7229; }
.portfolio-controls [data-portfolio-prev] { grid-column:1; grid-row:1; }
.portfolio-controls [data-portfolio-next] { grid-column:3; grid-row:1; }
.portfolio-controls button { display:inline-flex; justify-content:center; align-items:center; min-width:44px; min-height:44px; padding:8px; border:1px solid transparent; border-radius:50%; color:#f5eddd; background:transparent; font:inherit; cursor:pointer; }
.portfolio-controls button:hover { background:#ffffff0f; }
.portfolio-controls button:focus-visible { outline:2px solid #e8bc72; outline-offset:1px; }
.portfolio-dots { display:flex; justify-content:center; grid-column:1/-1; grid-row:2; flex-wrap:wrap; gap:0; min-width:0; }
.portfolio-dots button { min-width:44px; width:44px; min-height:44px; padding:0; border-radius:8px; }
.portfolio-dots button span { display:block; width:7px; height:7px; border-radius:50%; background:#95aa9a; }
.portfolio-dots button[aria-current=true] span { background:#e8bc72; box-shadow:0 0 0 4px #e8bc7220; }
.portfolio-controls .portfolio-pause { grid-column:2; grid-row:1; justify-self:center; min-width:76px; border-radius:9px; font-size:.73rem; border-color:#e8bc723b; margin:0; }
.portfolio-controls .portfolio-pause:disabled { opacity:.65; cursor:default; }
.hero-home .cta-row { gap:12px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.portfolio-highlight { background:#f4f0e6; border-bottom:1px solid #d9d7c8; }
.portfolio-highlight-grid { display:grid; align-items:center; gap:32px; }
.portfolio-highlight figure { margin:0; border-radius:20px; overflow:hidden; background:#123733; box-shadow:0 18px 52px #122f3014; }
.portfolio-highlight figure a { display:block; }
.portfolio-highlight img { display:block; width:100%; aspect-ratio:3/2; object-fit:cover; }
.portfolio-highlight figcaption { padding:14px 20px; font-size:.78rem; color:#f6eedb; line-height:1.75; }
.portfolio-highlight h2 { margin-top:12px; line-height:1.55; }
.portfolio-highlight .cta-row { margin-top:24px; }
#services .service-cards { display:grid; grid-template-columns:minmax(0,1fr); gap:24px; }
#services .service-cards .card { display:flex; flex-direction:column; min-width:0; border:1px solid #d8dfd3; border-radius:20px; overflow:hidden; background:#fffdf7; }
#services .service-cards .card-body { display:flex; flex-direction:column; flex:1; padding:26px; }
#services .service-cards .card-body .link-arrow { margin-top:auto; padding-top:20px; }
#services .service-cards .card h3 { margin:0 0 14px; }
#services .service-cards .card-media,#services .service-cards .service-illustration { display:block; flex:none; width:100%; height:auto; aspect-ratio:auto; margin:0; padding:0; position:relative; background:#eff3e9; }
#services .service-cards .card-media img,#services .service-cards .service-illustration img { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; transform:none; }
#services .service-cards .service-illustration img { object-fit:contain; }
#services .service-cards figcaption { padding:10px 18px; min-height:42px; color:#496154; background:#edf1e7; font-size:.72rem; line-height:1.65; }
#services .service-cards .service-photo figcaption { background:#153b35; color:#f4ead5; }
.illustrated-usecases { display:grid; grid-template-columns:minmax(0,1fr); gap:24px; margin-top:32px; }
.illustrated-usecases .usecase { padding:0; overflow:hidden; border-radius:18px; border:1px solid #d7dfd0; background:#fffdf7; }
.illustrated-usecases figure { margin:0; }
.illustrated-usecases img { display:block; width:100%; aspect-ratio:16/9; height:auto; object-fit:contain; }
.illustrated-usecases figcaption { padding:8px 22px; color:#637366; font-size:.69rem; background:#edf1e7; }
.usecase-body { padding:24px; }
.usecase-body h3 { margin-top:0; }
.usecase-body .usecase-detail { border-top:1px solid #d7dfd0; padding-top:14px; margin-top:20px; color:#526b59; font-size:.76rem; }
.compare-illustrations { display:grid; grid-template-columns:minmax(0,1fr); gap:26px; margin:36px 0; }
.compare-method { min-width:0; border:1px solid #d8dfd1; border-radius:20px; overflow:hidden; background:#fffdf8; }
.compare-method figure { margin:0; background:#edf1e8; }
.compare-method img { width:100%; height:auto; aspect-ratio:16/9; display:block; }
.compare-method figcaption { padding:10px 24px; color:#637366; font-size:.72rem; }
.compare-method > div { padding:26px; }
.compare-method h3 { font-size:1.5rem; margin:4px 0 14px; }
.compare-method .method-kicker { color:#8e682e; text-transform:none; font-size:.75rem; font-weight:600; margin:0; }
.comparison-table-wrap { max-width:100%; overflow:auto; border:1px solid #d4dece; border-radius:16px; background:#fffdf8; overscroll-behavior-x:contain; }
.comparison-table-wrap:focus-visible { outline:3px solid #ad823d; outline-offset:4px; }
.portfolio-compare-table { width:100%; min-width:570px; border-collapse:collapse; font-size:.86rem; line-height:1.9; }
.portfolio-compare-table caption { text-align:left; padding:18px 22px; color:#426151; font-weight:600; }
.portfolio-compare-table th,.portfolio-compare-table td { text-align:left; vertical-align:top; padding:18px 22px; border-top:1px solid #dbe2d4; overflow-wrap:anywhere; }
.portfolio-compare-table thead { background:#183d36; color:#f8eedb; }
.portfolio-compare-table tbody th { width:22%; min-width:145px; font-weight:600; color:#254d3b; background:#f2f3e9; }
.portfolio-compare-table td { width:39%; }
.portfolio-compare-table tbody tr:nth-child(even) td { background:#f8f8f1; }
.comparison-note { margin:20px 0 28px; padding:18px 22px; border-left:3px solid #b38a47; color:#4f6759; background:#eeeede; font-size:.84rem; line-height:1.9; }
.service-operation-illustration { max-width:800px; margin:28px auto 0; }
.service-operation-illustration img { width:100%; height:auto; border-radius:18px; display:block; }
.service-operation-illustration figcaption { text-align:center; font-size:.76rem; padding:12px; color:#667766; }
@media(min-width:640px){ .illustrated-usecases { grid-template-columns:repeat(2,minmax(0,1fr)); } .compare-illustrations { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(min-width:900px){ .portfolio-highlight-grid { grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); gap:56px; } #services .service-cards { grid-template-columns:repeat(3,minmax(0,1fr)); } .illustrated-usecases { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(min-width:1200px){ .hero-feature.portfolio-carousel { width:40%; top:100px; } .hero-home .hero-inner { min-height:760px; } .hero-feature.portfolio-carousel .portfolio-slide img { height:320px; } .hero-feature.portfolio-carousel .portfolio-image-error { min-height:320px; } }
@media(max-width:639px){ .hero-feature.portfolio-carousel .portfolio-slide img { height:220px; } .hero-feature.portfolio-carousel .portfolio-image-error { min-height:220px; } .hero-feature.portfolio-carousel figcaption { min-height:108px; padding:14px 16px; } .portfolio-controls { padding:7px 8px 10px; gap:0; } .portfolio-dots button { width:44px; min-width:44px; } .portfolio-highlight-grid { gap:24px; } .portfolio-highlight h2 { font-size:1.55rem; } .compare-method > div,.usecase-body { padding:22px; } .portfolio-compare-table th,.portfolio-compare-table td { padding:15px; } }
@media(prefers-reduced-motion:reduce){ .portfolio-carousel * { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }