/* Frontida homepage overall polish — 2026-08-30
   Visual refinement only. Existing content, PHP flows, forms, modals,
   admin-managed images, careers, product interactions and links remain intact. */

:root{
  --fp-green:#176b2d;
  --fp-green-deep:#0d4d25;
  --fp-green-ink:#07391b;
  --fp-green-soft:#edf6ef;
  --fp-orange:#e85b2a;
  --fp-orange-soft:#fff1eb;
  --fp-ink:#173d27;
  --fp-muted:#66766c;
  --fp-line:#dce7df;
  --fp-shadow:0 18px 46px rgba(19,73,39,.10);
  --fp-shadow-soft:0 10px 30px rgba(19,73,39,.07);
}

html{scroll-padding-top:92px}
body.public-home{
  background:#fff;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.public-home main{overflow:hidden}
.public-home main>section{scroll-margin-top:88px}
.public-home .section-shell{width:min(1360px,calc(100% - 72px))}
.public-home .section-heading{position:relative;text-align:center}
.public-home .section-heading>span,
.public-home .section-label{
  font-weight:850;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.public-home .section-heading h2{
  letter-spacing:-.035em;
  text-wrap:balance;
}
.public-home .section-heading p{text-wrap:balance}

/* Header: cleaner business navigation. */
.public-home .site-nav{
  border-bottom:1px solid rgba(15,75,34,.07);
  box-shadow:0 4px 24px rgba(12,60,30,.045);
}
.public-home .site-nav.scrolled{
  box-shadow:0 10px 34px rgba(12,60,30,.09);
}
.public-home .nav-inner{width:min(1360px,calc(100% - 72px));height:82px}
.public-home .nav-brand img{height:50px;transition:transform .22s ease}
.public-home .nav-brand:hover img{transform:translateY(-1px) scale(1.015)}
.public-home .nav-link{position:relative;padding:28px 0 25px;font-size:14px;font-weight:650}
.public-home .nav-link:after{bottom:19px;width:18px;left:50%;transform:translateX(-50%) scaleX(0);transform-origin:center}
.public-home .nav-link:hover:after{transform:translateX(-50%) scaleX(1)}
.public-home .nav-login,.public-home .nav-signup{min-width:82px;text-align:center;font-weight:750}

/* Hero: preserve full-right layout but give it a more intentional visual frame. */
.public-home .hero{
  background:
    radial-gradient(circle at 86% 17%,rgba(25,107,44,.055),transparent 22%),
    radial-gradient(circle at 7% 72%,rgba(232,91,42,.035),transparent 22%),
    linear-gradient(112deg,#fbfdfb 0%,#f5faf6 47%,#eef5f2 100%);
}
.public-home .hero-layout{padding-top:72px;padding-bottom:112px}
.public-home .hero-badge{
  margin-bottom:20px;
  color:var(--fp-green);
  font-size:15px;
  font-weight:800;
}
.public-home .hero h1{
  margin-bottom:26px;
  color:var(--fp-green-deep);
  text-shadow:0 1px 0 rgba(255,255,255,.85);
}
.public-home .hero h1 em{color:#327a2b}
.public-home .hero-copy>div>p{
  max-width:610px;
  margin-bottom:30px;
  color:#4f6257;
  font-size:18px;
  line-height:1.62;
}
.public-home .hero-buttons{gap:14px}
.public-home .hero-buttons a{
  min-height:50px;
  padding-inline:30px;
  font-weight:800;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.public-home .hero-buttons a:hover{transform:translateY(-2px)}
.public-home .hero-stats{margin-top:34px;gap:0}
.public-home .hero-stats div{
  min-width:122px;
  padding:0 28px;
  border-right:1px solid #d6e2d9;
}
.public-home .hero-stats div:first-child{padding-left:0}
.public-home .hero-stats strong{font-size:29px;line-height:1}
.public-home .hero-stats small{margin-top:6px;font-size:10px;letter-spacing:.09em}
.public-home .hero-collage{
  overflow:hidden!important;
  border:1px solid rgba(29,99,48,.12)!important;
  border-radius:28px!important;
  background:#fff;
  box-shadow:0 26px 66px rgba(20,71,39,.15)!important;
}
.public-home .hero-collage:before{
  width:13%!important;
  opacity:.72;
}
.public-home .collage-main{
  filter:saturate(.97) contrast(1.01)!important;
}

/* Products: refined showcase with stronger hierarchy and premium cards. */
.public-home .products-section{
  position:relative;
  padding:72px 0 82px;
  background:
    radial-gradient(circle at 5% 18%,rgba(25,107,44,.045),transparent 18%),
    radial-gradient(circle at 94% 85%,rgba(232,91,42,.035),transparent 19%),
    linear-gradient(180deg,#fff 0%,#f7faf7 100%);
}
.public-home .product-section-heading{margin-bottom:28px}
.public-home .product-section-heading>span{font-size:12px}
.public-home .product-section-heading h2{font-size:clamp(38px,3.4vw,46px)}
.public-home .product-section-heading h2:after{width:38px;height:3px;margin-top:11px}
.public-home .product-showcase{padding-inline:62px}
.public-home .product-grid{gap:18px;padding-top:10px;padding-bottom:22px}
.public-home .product-card{
  border-color:#dce8df;
  border-radius:18px;
  box-shadow:0 12px 32px rgba(19,73,39,.075);
}
.public-home .product-card:hover{
  transform:translateY(-7px) scale(1.012);
  border-color:#cadfce;
  box-shadow:0 22px 46px rgba(19,73,39,.14);
}
.public-home .product-image-wrap{
  background:linear-gradient(180deg,#fff 0%,#f5faf6 100%);
}
.public-home .product-copy h3{font-weight:800;letter-spacing:-.01em}
.public-home .product-nav{
  width:40px;
  height:40px;
  border-width:1px;
  box-shadow:0 10px 26px rgba(19,73,39,.13);
}
.public-home .product-expand-button{
  min-height:42px;
  padding:10px 25px;
  font-size:12px;
  font-weight:850;
  box-shadow:0 10px 24px rgba(25,107,44,.18);
}
.public-home .product-showcase[data-expanded="true"] .product-grid{gap:24px}
.public-home .product-showcase[data-expanded="true"] .product-card{
  border-radius:20px;
  box-shadow:0 16px 38px rgba(19,73,39,.095);
}
.public-home .product-showcase[data-expanded="true"] .product-image-wrap{
  background:linear-gradient(180deg,#f8fbf8 0%,#eef6ef 100%);
}
.public-home .product-showcase[data-expanded="true"] .product-copy h3{font-size:20px}
.public-home .product-showcase[data-expanded="true"] .product-cta{
  min-height:44px;
  border-radius:999px;
  font-weight:850;
}

/* Who We Are: stronger visual balance and highly readable Mission/Vision cards. */
.public-home .purpose-section{
  position:relative;
  padding:94px 0 98px;
  background:
    radial-gradient(circle at 100% 0,rgba(232,91,42,.075),transparent 19%),
    radial-gradient(circle at 0 100%,rgba(25,107,44,.055),transparent 20%),
    #f7faf6;
}
.public-home .purpose-showcase{gap:62px}
.public-home .purpose-feature-photo{
  min-height:470px;
  border:1px solid rgba(23,107,45,.10);
  border-radius:26px;
  box-shadow:0 22px 48px rgba(19,73,39,.12);
}
.public-home .purpose-feature-photo>img{height:470px;min-height:470px}
.public-home .purpose-photo-caption{
  right:24px;
  bottom:22px;
  left:24px;
  padding:16px 18px;
  border:1px solid rgba(20,82,39,.08);
  border-radius:14px;
  box-shadow:0 14px 28px rgba(12,56,31,.14);
}
.public-home .purpose-photo-caption strong{font-size:16px}
.public-home .purpose-copy>h2{margin-bottom:20px}
.public-home .purpose-copy>p{max-width:700px;font-size:16.5px;line-height:1.75}
.public-home .purpose-grid{gap:20px;margin-top:28px}
.public-home .purpose-card{
  min-height:232px;
  padding:26px 25px 24px;
  border-radius:20px;
  box-shadow:0 14px 32px rgba(19,73,39,.08);
}
.public-home .purpose-card:hover{transform:translateY(-5px)}
.public-home .purpose-card h3{font-size:21px}
.public-home .purpose-card p{font-size:15px;line-height:1.72}

/* Core Values: simple cards, clearer names, still using the eight admin images. */
.public-home .values-section{
  position:relative;
  padding:86px 0 94px;
  background:linear-gradient(180deg,#fff 0%,#fbfdfb 100%);
}
.public-home .values-section .section-heading{margin-bottom:30px}
.public-home .values-section .section-heading h2{font-size:clamp(36px,3.4vw,46px)}
.public-home .frontida-letters{gap:9px;margin-bottom:40px}
.public-home .frontida-letters span{
  width:52px;
  height:52px;
  border-radius:12px;
  box-shadow:0 9px 22px rgba(15,75,34,.16);
}
.public-home .values-grid{gap:20px}
.public-home .value-card{
  border-radius:18px;
  border-color:#dce7df;
  box-shadow:0 12px 30px rgba(20,67,36,.075);
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.public-home .value-card:hover{
  transform:translateY(-7px);
  border-color:#c8ddcd;
  box-shadow:0 20px 42px rgba(20,67,36,.13);
}
.public-home .value-photo{height:205px}
.public-home .value-photo:after{
  background:linear-gradient(to top,rgba(255,255,255,.94) 0%,rgba(255,255,255,.78) 19%,rgba(9,55,27,.12) 56%,rgba(9,55,27,.03) 100%);
}
.public-home .value-letter-badge{
  top:16px;
  left:16px;
  width:40px;
  height:40px;
  border-radius:10px;
  box-shadow:0 8px 18px rgba(133,50,18,.24);
}
.public-home .value-photo h3{
  right:17px;
  bottom:15px;
  left:17px;
  color:var(--fp-green-deep);
  font-family:'Source Sans 3',system-ui,sans-serif;
  font-size:17px;
  font-weight:850;
  line-height:1.2;
  text-shadow:none;
}

/* Why Frontida: turn the dark band into a deliberate premium brand section. */
.public-home .why-section{
  position:relative;
  padding:86px 0;
  background:
    radial-gradient(circle at 88% 12%,rgba(232,91,42,.14),transparent 20%),
    radial-gradient(circle at 10% 95%,rgba(255,255,255,.045),transparent 22%),
    linear-gradient(125deg,#0a3d20 0%,#0e4d25 52%,#145d2b 100%);
}
.public-home .why-section:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.13) 1px,transparent 1px);
  background-size:28px 28px;
  opacity:.08;
  mask-image:linear-gradient(90deg,#000,transparent 35%,transparent 65%,#000);
}
.public-home .why-grid{position:relative;z-index:1;gap:72px}
.public-home .why-copy .section-label{color:#ff9b73}
.public-home .why-copy h2{max-width:760px;font-size:clamp(38px,4vw,56px)}
.public-home .why-copy p{font-size:16px;line-height:1.78}
.public-home .why-strengths{gap:12px;margin-top:28px}
.public-home .why-strengths span{
  position:relative;
  padding:13px 15px 13px 38px;
  border-color:rgba(255,255,255,.14);
  border-radius:12px;
  background:rgba(255,255,255,.075);
  font-size:13px;
  transition:transform .2s ease,background .2s ease,border-color .2s ease;
}
.public-home .why-strengths span:before{
  content:"";
  position:absolute;
  top:50%;
  left:15px;
  width:8px;
  height:8px;
  transform:translateY(-50%);
  border-radius:50%;
  background:var(--fp-orange);
  box-shadow:0 0 0 4px rgba(232,91,42,.13);
}
.public-home .why-strengths span:hover{
  transform:translateY(-2px);
  border-color:rgba(255,255,255,.24);
  background:rgba(255,255,255,.11);
}
.public-home .why-photo img{
  height:360px;
  border-radius:22px;
  border-color:rgba(255,255,255,.18);
  box-shadow:0 24px 50px rgba(0,0,0,.22);
}
.public-home .delivery-card{
  right:18px;
  bottom:-16px;
  padding:12px 17px;
  border:1px solid rgba(25,107,44,.10);
  border-radius:12px;
  box-shadow:0 14px 28px rgba(0,0,0,.18);
}

/* Careers: stronger hierarchy and consistent white-card language. */
.public-home .careers-section{
  padding:96px 0 104px;
  background:
    radial-gradient(circle at 8% 18%,rgba(25,107,44,.035),transparent 20%),
    radial-gradient(circle at 93% 84%,rgba(232,91,42,.045),transparent 19%),
    #f8faf8;
}
.public-home .careers-heading{margin-bottom:48px}
.public-home .careers-heading h2{font-size:clamp(38px,4vw,54px)}
.public-home .careers-heading p{max-width:800px;color:#607067}
.public-home .careers-banner{
  min-height:390px;
  border-radius:24px;
  border-color:#dce7df;
  box-shadow:var(--fp-shadow);
}
.public-home .careers-banner>img{min-height:390px}
.public-home .careers-banner-copy{padding:44px 46px}
.public-home .hiring-badge{
  padding:8px 13px;
  border-radius:999px;
  font-weight:800;
  letter-spacing:.09em;
}
.public-home .careers-banner-copy h3{font-size:38px;line-height:1.04}
.public-home .career-highlights{gap:9px;flex-wrap:wrap}
.public-home .career-highlights span{
  padding:8px 10px;
  border:1px solid #dfe9e1;
  border-radius:999px;
  background:#f5f9f5;
  font-weight:650;
}
.public-home .open-positions{margin-top:54px}
.public-home .positions-heading{margin-bottom:20px}
.public-home .positions-heading h3{font-size:30px}
.public-home .job-card{
  border:1px solid #dfe8e1;
  border-radius:18px;
  box-shadow:0 10px 28px rgba(19,73,39,.065);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.public-home .job-card:hover{
  transform:translateY(-5px);
  border-color:#cbded0;
  box-shadow:0 18px 38px rgba(19,73,39,.12);
}
.public-home .job-apply{font-weight:800}

/* Contact: clearer card separation and a more confident form. */
.public-home .contact-section{
  position:relative;
  padding:92px 0 96px;
  background:linear-gradient(180deg,#fff 0%,#f7faf7 100%);
}
.public-home .contact-shell{width:min(1220px,calc(100% - 72px))}
.public-home .contact-section .section-heading{max-width:800px;margin-inline:auto;margin-bottom:42px}
.public-home .contact-section .section-heading h2{font-size:clamp(38px,3.8vw,50px)}
.public-home .contact-section .section-heading p{font-size:16px;line-height:1.72}
.public-home .contact-grid{
  grid-template-columns:.82fr 1.18fr;
  border-radius:24px;
  border-color:#d8e5db;
  box-shadow:0 22px 54px rgba(19,73,39,.11);
}
.public-home .contact-details{
  position:relative;
  padding:42px;
  background:
    radial-gradient(circle at 100% 0,rgba(232,91,42,.13),transparent 24%),
    linear-gradient(145deg,#124f27,#08391c);
}
.public-home .contact-details:after{
  content:"";
  position:absolute;
  right:24px;
  bottom:24px;
  width:90px;
  height:90px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:50%;
  box-shadow:0 0 0 22px rgba(255,255,255,.018);
  pointer-events:none;
}
.public-home .contact-details address div{padding-block:15px}
.public-home .contact-details address span{font-size:21px}
.public-home .contact-details address small{font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.public-home .contact-form-wrap{padding:42px 44px}
.public-home .contact-form{gap:18px}
.public-home .contact-form label>span{margin-bottom:7px;font-size:12px}
.public-home .contact-form input,
.public-home .contact-form textarea{
  min-height:48px;
  padding:12px 14px;
  border-radius:11px;
  background:#fbfdfb;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.public-home .contact-form textarea{min-height:132px;resize:vertical}
.public-home .contact-form input:focus,
.public-home .contact-form textarea:focus{background:#fff}
.public-home .contact-form button{
  min-height:48px;
  border-radius:999px;
  font-size:14px;
  font-weight:850;
  box-shadow:0 10px 24px rgba(25,107,44,.18);
}

/* Footer: compact but more finished. */
.public-home .site-footer{
  position:relative;
  padding:30px 0;
  background:linear-gradient(105deg,#07391b,#0d4d25 56%,#145c2b);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.public-home .site-footer>div{
  width:min(1360px,calc(100% - 72px));
  min-height:72px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:28px;
}
.public-home .site-footer img{width:auto;height:42px;opacity:.96}
.public-home .site-footer p{margin:0;font-size:13px;color:rgba(255,255,255,.78)}
.public-home .footer-links{display:flex;gap:8px}
.public-home .footer-links a{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:8px 13px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  background:rgba(255,255,255,.055);
  font-size:12px;
  font-weight:650;
  transition:background .18s ease,border-color .18s ease;
}
.public-home .footer-links a:hover{background:rgba(255,255,255,.11);border-color:rgba(255,255,255,.26);color:#fff}

/* Consistent keyboard focus and subtle motion. */
.public-home a:focus-visible,
.public-home button:focus-visible,
.public-home input:focus-visible,
.public-home textarea:focus-visible{
  outline:3px solid rgba(232,91,42,.28);
  outline-offset:3px;
}

@media (max-width:1180px){
  .public-home .section-shell{width:min(100% - 48px,1120px)}
  .public-home .nav-inner{width:min(100% - 48px,1120px)}
  .public-home .purpose-showcase{gap:40px}
  .public-home .why-grid{gap:44px}
  .public-home .contact-shell{width:min(100% - 48px,1120px)}
  .public-home .site-footer>div{width:min(100% - 48px,1120px)}
}

@media (max-width:900px){
  .public-home .hero-layout{padding-top:54px}
  .public-home .hero-copy>div>p{font-size:17px}
  .public-home .hero-stats div{min-width:105px;padding-inline:20px}
  .public-home .purpose-section,.public-home .values-section,.public-home .why-section,.public-home .careers-section,.public-home .contact-section{padding-top:72px;padding-bottom:76px}
  .public-home .purpose-feature-photo,.public-home .purpose-feature-photo>img{height:410px;min-height:410px}
  .public-home .why-photo img{height:340px}
  .public-home .contact-form-wrap,.public-home .contact-details{padding:32px}
  .public-home .site-footer>div{grid-template-columns:1fr;text-align:center;justify-items:center;gap:14px}
}

@media (max-width:640px){
  .public-home .section-shell,.public-home .contact-shell{width:calc(100% - 28px)}
  .public-home .nav-inner{width:calc(100% - 28px);height:70px}
  .public-home .nav-brand img{height:40px}
  .public-home .hero-layout{padding-top:44px;padding-bottom:92px}
  .public-home .hero h1{font-size:clamp(42px,13vw,56px)}
  .public-home .hero-copy>div>p{font-size:16px;line-height:1.6}
  .public-home .hero-buttons{display:grid;grid-template-columns:1fr;max-width:330px;margin-inline:auto}
  .public-home .hero-buttons a{width:100%}
  .public-home .hero-stats{gap:0}
  .public-home .hero-stats div{min-width:0;flex:1;padding:0 10px}
  .public-home .hero-stats div:first-child{padding-left:0}
  .public-home .hero-stats div:last-child{padding-right:0}
  .public-home .hero-stats strong{font-size:25px}
  .public-home .products-section{padding:58px 0 64px}
  .public-home .product-showcase{padding-inline:36px}
  .public-home .product-section-heading h2{font-size:36px}
  .public-home .purpose-section,.public-home .values-section,.public-home .why-section,.public-home .careers-section,.public-home .contact-section{padding-top:60px;padding-bottom:64px}
  .public-home .purpose-feature-photo,.public-home .purpose-feature-photo>img{height:340px;min-height:340px}
  .public-home .purpose-photo-caption{right:14px;bottom:14px;left:14px}
  .public-home .purpose-grid{gap:14px;margin-top:22px}
  .public-home .purpose-card{min-height:0;padding:22px 20px}
  .public-home .frontida-letters{gap:5px;margin-bottom:28px}
  .public-home .frontida-letters span{width:38px;height:42px;border-radius:9px;font-size:18px}
  .public-home .values-grid{gap:14px}
  .public-home .value-photo{height:185px}
  .public-home .why-strengths{grid-template-columns:1fr}
  .public-home .why-photo img{height:300px}
  .public-home .careers-banner{border-radius:18px}
  .public-home .careers-banner-copy{padding:28px 22px}
  .public-home .careers-banner-copy h3{font-size:32px}
  .public-home .contact-grid{border-radius:18px}
  .public-home .contact-form-wrap,.public-home .contact-details{padding:26px 20px}
  .public-home .site-footer{padding:26px 0}
  .public-home .site-footer>div{width:calc(100% - 28px)}
  .public-home .footer-links{flex-wrap:wrap;justify-content:center}
}

@media (prefers-reduced-motion:reduce){
  .public-home *,
  .public-home *:before,
  .public-home *:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}

/* Product carousel: clear 5-second glide animation. */
.public-home .product-grid.is-auto-sliding .product-card{
  transition:transform .45s cubic-bezier(.22,.8,.3,1),box-shadow .45s ease,border-color .45s ease;
}
.public-home .product-grid.is-auto-sliding .product-card:nth-child(odd){
  transform:translateY(-2px);
}
@media (prefers-reduced-motion: reduce){
  .public-home .product-grid.is-auto-sliding .product-card:nth-child(odd){transform:none}
}

/* Hero background visibility refinement — keep Admin-managed background noticeable without reducing readability. */
.public-home .hero-photo{
  opacity:1!important;
  background-position:center center!important;
  background-size:cover!important;
  filter:saturate(.78) contrast(.94) brightness(1.03)!important;
}
.public-home .hero-photo:after{
  background:linear-gradient(90deg,
    rgba(250,252,250,.965) 0%,
    rgba(250,252,250,.945) 32%,
    rgba(247,251,247,.86) 50%,
    rgba(240,247,242,.70) 72%,
    rgba(238,246,240,.58) 100%)!important;
}
@media (max-width:900px){
  .public-home .hero-photo{opacity:1!important}
  .public-home .hero-photo:after{
    background:linear-gradient(180deg,
      rgba(250,252,250,.88) 0%,
      rgba(248,252,248,.82) 54%,
      rgba(244,250,245,.78) 100%)!important;
  }
}

/* Legal notice links at public data-collection points */
.public-home .form-legal-note{margin:8px 0 0;text-align:center;color:#6b786f;font-size:11.5px;line-height:1.45}
.public-home .form-legal-note a,.career-consent a{color:#196b2c;font-weight:700;text-decoration:underline;text-underline-offset:2px}

/* ================================================================
   Hero image size restoration — 2026-08-30
   Return the desktop hero photo to the earlier balanced fixed frame.
   Prevent ultra-wide layouts from stretching the photo excessively.
   ================================================================ */
@media (min-width:1101px){
  .public-home .hero .section-shell.hero-layout{
    width:min(1320px,calc(100% - 64px))!important;
    max-width:1320px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    grid-template-columns:520px minmax(0,1fr)!important;
    gap:80px!important;
  }
  .public-home .hero-copy{
    width:auto!important;
    max-width:520px!important;
  }
  .public-home .hero-collage{
    justify-self:end!important;
    width:100%!important;
    max-width:720px!important;
    height:500px!important;
    margin-right:0!important;
    transform:none!important;
  }
}
@media (min-width:1101px) and (max-width:1320px){
  .public-home .hero .section-shell.hero-layout{
    grid-template-columns:minmax(440px,.88fr) minmax(0,1.12fr)!important;
    gap:56px!important;
  }
  .public-home .hero-copy{max-width:none!important}
  .public-home .hero-collage{max-width:680px!important;height:480px!important}
}