/* Homepage actions and closing sections. */
.portfolio-actions{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:16px;margin-top:34px}
.home-page .portfolio-button{display:inline-flex;justify-content:center;align-items:center;gap:14px;min-height:62px;padding:17px 27px;border:1.5px solid #cecdc4;border-radius:999px;color:var(--ink);font-family:var(--sans);font-size:20px;font-weight:600;line-height:1.2;white-space:nowrap;text-decoration:none;transition:background .2s,color .2s,border-color .2s}
.portfolio-button svg{width:25px;height:25px;flex:none}
.home-page .portfolio-button-primary{background:#34362d;border-color:#34362d;color:var(--paper)}
.home-page .portfolio-button:hover{background:var(--green);border-color:var(--green);color:var(--paper);text-decoration:none}
.home-testimonials{padding-top:28px;padding-bottom:110px}
.testimonials-heading{max-width:850px;margin-bottom:44px}
.home-testimonials h2,.home-contact h2{margin:0;font-family:var(--serif);font-size:clamp(36px,4.2vw,54px);font-weight:500;letter-spacing:-.035em;line-height:1.13;text-wrap:balance}
.testimonial-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.testimonial-card{display:flex;flex-direction:column;padding:30px 28px 26px;border:1px solid var(--line);border-radius:22px;background:#eee9dd}
.testimonial-card:nth-child(2){background:#e7e8dc}
.testimonial-card:nth-child(3){background:#eee4d8}
.quote-mark{height:48px;color:var(--accent);font-family:Georgia,serif;font-size:70px;line-height:1}
.testimonial-card h3{margin:16px 0 18px;font-family:var(--serif);font-size:27px;font-weight:500;line-height:1.18;letter-spacing:-.025em}
.testimonial-card blockquote{margin:0 0 32px}
.testimonial-card blockquote p{margin:0;color:#4a4b40;font-size:16px;line-height:1.7}
.testimonial-attribution{display:flex;align-items:center;gap:12px;margin:auto 0 0;padding-top:22px;border-top:1px solid #25261f20}
.testimonial-monogram{display:grid;place-items:center;flex:none;width:36px;height:36px;border:1px solid #25261f30;border-radius:50%;color:var(--green);font-size:11px}
.testimonial-attribution strong{display:block;font-size:12px;font-weight:600;line-height:1.45}
.home-contact{padding-block:95px 105px;background:#e3e5d8;border-top:1px solid #55594518}
.contact-inner{display:grid;grid-template-columns:1.05fr 1fr;gap:80px;align-items:start}
.contact-introduction .section-kicker{margin-bottom:22px}
.home-contact h2{font-size:clamp(38px,4vw,52px)}
.contact-details{padding-top:36px}
.contact-details>p{margin-bottom:22px;color:#505344;font-size:16px;line-height:1.7}
.contact-email{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0 17px;border-bottom:1px solid #55594560;font-size:clamp(18px,2vw,25px);font-weight:500;letter-spacing:-.035em}
.contact-email span{overflow-wrap:anywhere}
.contact-email svg{flex:none;width:24px;height:24px;transition:transform .2s}
.contact-email:hover svg{transform:translate(3px,-3px)}
.contact-secondary-links{display:flex;flex-wrap:wrap;gap:30px;margin-top:24px;font-size:14px;font-weight:500}
.contact-secondary-links span{margin-left:7px}
.contact-secondary-links a:hover{text-decoration:underline;text-underline-offset:4px}
@media(max-width:1000px){
  .testimonial-grid{gap:14px}
  .testimonial-card{padding:25px 20px}
  .testimonial-card h3{font-size:24px}
  .testimonial-card blockquote p{font-size:15px}
  .contact-inner{gap:40px}
}
@media(max-width:760px){
  .testimonial-grid{grid-template-columns:1fr}
  .testimonial-card{padding:28px}
  .testimonial-card h3{font-size:28px}
  .testimonial-card blockquote p{font-size:16px}
  .home-testimonials{padding-top:12px;padding-bottom:75px}
  .testimonials-heading{margin-bottom:30px}
  .contact-inner{grid-template-columns:1fr;gap:28px}
  .contact-details{padding-top:0}
  .home-contact{padding-block:65px 70px}
}
@media(max-width:480px){
  .portfolio-actions{gap:12px;margin-top:28px}
  .home-page .portfolio-button{min-height:54px;padding:15px 22px;gap:12px;font-size:17px}
  .portfolio-button svg{width:22px;height:22px}
  .desktop-break{display:none}
  .home-testimonials h2{font-size:36px}
  .contact-email{font-size:20px}
}
@media(prefers-reduced-motion:reduce){.home-page .portfolio-button,.contact-email svg{transition:none}.contact-email:hover svg{transform:none}}

/* Keep the homepage content comfortably inside the canvas. */
.home-page .site-shell{width:min(calc(100% - 120px),1040px)}
.home-page .home-intro{max-width:760px;padding-top:145px;padding-bottom:125px}
.home-page .home-intro h1{font-size:clamp(34px,3.6vw,48px);line-height:1.16}
.home-page .home-intro .intro-note{max-width:650px;font-size:16px;line-height:1.8}
.home-page .portfolio-button{min-height:54px;padding:15px 24px;font-size:17px;gap:12px}
.portfolio-button svg{width:22px;height:22px}
.home-page .home-work{padding-bottom:130px}
.home-page .project-list{grid-template-columns:minmax(0,760px)}
.home-page .project-card{padding:42px;gap:30px}
.home-page .project-card h3{font-size:36px;line-height:1.12}
.home-page .project-card .project-description{font-size:16px;line-height:1.75}
.home-page .project-card-image.product-pair{height:320px}
.home-testimonials{padding-bottom:130px}
.testimonials-heading{margin-bottom:48px}
.home-testimonials h2{font-size:clamp(30px,3.2vw,40px);line-height:1.2}
.testimonial-grid{gap:28px}
.testimonial-card{padding:30px 26px;border-radius:20px}
.quote-mark{height:35px;font-size:56px}
.testimonial-card h3{margin:18px 0 22px;font-size:23px;line-height:1.3}
.testimonial-card blockquote p{font-size:15px;line-height:1.8}
.testimonial-attribution{padding-top:24px}
.testimonial-attribution strong{font-size:11px}
.home-contact{padding-block:110px 115px}
.contact-inner{grid-template-columns:1fr 1fr;gap:88px}
.home-contact h2{font-size:clamp(30px,3.2vw,40px);line-height:1.2}
.contact-details{padding-top:34px}
.contact-details>p{font-size:15px;line-height:1.85;margin-bottom:24px}
.contact-email{font-size:21px;padding-top:14px}
.contact-secondary-links{font-size:13px;gap:28px}
@media(max-width:1000px){
  .home-page .site-shell{width:calc(100% - 80px)}
  .testimonial-grid{gap:20px}
  .testimonial-card{padding:26px 22px}
  .contact-inner{gap:48px}
}
@media(max-width:760px){
  .home-page .site-shell{width:calc(100% - 48px)}
  .home-page .home-intro{padding-top:95px;padding-bottom:95px}
  .home-page .home-work{padding-bottom:90px}
  .home-page .project-card{padding:26px;gap:24px}
  .home-page .project-card h3{font-size:30px}
  .home-page .project-card-image.product-pair{height:250px}
  .home-testimonials{padding-bottom:90px}
  .testimonial-grid{gap:24px}
  .testimonial-card{padding:30px}
  .testimonial-card h3{font-size:24px}
  .contact-inner{grid-template-columns:1fr;gap:32px}
  .contact-details{padding-top:0}
  .home-contact{padding-block:75px 80px}
  .contact-email{font-size:20px}
}
@media(max-width:380px){
  .testimonial-card{padding:25px}
  .contact-email{font-size:18px}
}

/* Second selected project: the live product retains its own visual identity. */
.home-page .project-list{row-gap:40px}
.home-page .bubu-project-card{background:#e3e8e7}
.bubu-card-preview{width:100%;overflow:hidden;border:1px solid #83959e50;border-radius:12px;background:#122337}
.bubu-card-browser{display:block;padding:11px 16px;color:#d9e5ed;background:#263b4b;font-size:10px;letter-spacing:.03em}
.bubu-card-preview img{width:100%;height:auto}
.project-card .bubu-card-outcome{margin:2px 0 4px;padding-top:14px;border-top:1px solid #263f5326;color:#365365;font-size:13px;line-height:1.6}
@media(max-width:600px){.home-page .project-list{row-gap:30px}.project-card .bubu-card-outcome{font-size:12px}}
.bubu-card-preview:has(img[src*="magic-bubu/landing"]){padding:32px 18px 18px;background:#e1e7e8}
.bubu-card-preview img[src*="magic-bubu/landing"]{border:0;border-radius:0;box-shadow:none;width:100%;height:auto;object-fit:contain}

/* Compare the two projects side by side, with equally sized image areas. */
.home-page .project-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px;align-items:stretch}
.home-page .project-card{padding:32px;gap:34px}
.home-page .project-card h3{font-size:30px;line-height:1.2}
.home-page .project-card .project-description{font-size:15px;line-height:1.8}
.home-page .project-card-copy{flex:1;gap:20px}
.home-page .project-card .card-link{margin-top:auto;padding-top:16px}
.home-page .project-card-image.product-pair,.home-page .bubu-card-preview{height:240px;flex:none}
.home-page .bubu-card-preview:has(img[src*="magic-bubu/landing"]){display:flex;align-items:center;padding:20px 8px;border:0;background:transparent}
.home-page .bubu-card-preview img[src*="magic-bubu/landing"]{height:100%;object-fit:contain}
.home-page .home-work>.section-kicker{margin-bottom:36px}
@media(min-width:761px) and (max-width:1000px){.home-page .project-list{gap:28px}.home-page .project-card{padding:24px;gap:28px}.home-page .project-card h3{font-size:27px}.home-page .project-card-image.product-pair,.home-page .bubu-card-preview{height:190px}}
@media(max-width:760px){.home-page .project-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.home-page .project-card{padding:22px;gap:26px}.home-page .project-card-image.product-pair,.home-page .bubu-card-preview{height:175px}.home-page .project-card h3{font-size:25px}}

/* The two selected projects stay in one row, including narrow previews. */
.home-page :is(.section-kicker,.testimonial-attribution strong,.contact-secondary-links){font-size:15px;letter-spacing:0}
.home-page :is(.intro-note,.project-description,.testimonial-card p,.contact-details p){text-wrap:balance}
.home-page .testimonial-card h3{font-size:26px}
.home-page .project-card .project-cta{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:12px 20px;border:1px solid var(--ink);border-radius:999px;background:var(--ink);color:var(--paper);font-size:13px;font-weight:500;line-height:1.3}
.home-page .project-card:hover .project-cta,.home-page .project-card:focus-visible .project-cta{background:var(--green);border-color:var(--green)}
@media(max-width:520px){.home-page .home-work.site-shell{width:calc(100% - 32px)}.home-page .project-list{gap:14px}.home-page .project-card{padding:14px;gap:22px;border-radius:18px;min-height:0}.home-page .project-card-image.product-pair,.home-page .bubu-card-preview{height:118px}.home-page .bubu-card-preview:has(img){padding:8px 0}.home-page .project-card h3{font-size:21px;overflow-wrap:anywhere}.home-page .project-card .project-meta{font-size:9px;letter-spacing:.07em}.home-page .project-card .project-description{font-size:13px;line-height:1.7}.home-page .project-card-copy{gap:16px}.home-page .project-card .project-cta{font-size:11px;padding:11px 12px;min-height:44px}}
