.elementor-29956 .elementor-element.elementor-element-800e88f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS *//* ================================
   Plantone Academy Global Styles
   Elementor Site Settings → Custom CSS
   ================================ */

/* 1) CSS Variables: brand palette, spacing, radii */
:root{
  /* Brand palette */
  --c-primary:#4A5840;   /* 森林墨綠（主色） */
  --c-accent:#D8C3A5;    /* 暖土米（輔色） */
  --c-bg-soft:#F3F1EE;   /* 靜白灰（柔和底） */

  /* Neutral */
  --c-text:#111;
  --c-sub:#555;
  --c-border:#eee;
  --c-bg:#fafafa;

  /* Typography scale */
  --fz-hero-min:28px;
  --fz-hero-max:42px;

  /* Radii */
  --radius:12px;
  --radius-lg:16px;

  /* Spacing scale */
  --space-1:8px;  --space-2:12px; --space-3:16px; --space-4:20px;
  --space-5:28px; --space-6:32px; --space-7:40px; --space-8:56px; --space-9:64px;

  /* Containers */
  --max-w:1120px; 
  --max-w-narrow:920px;

  /* Motion */
  --ease: cubic-bezier(.25,.8,.25,1); /* gentle ease */
  --dur-1:160ms;
  --dur-2:280ms;
}

/* 2) Base Resets */
.pl-section{padding:var(--space-8) 0;}
.pl-hero{padding:var(--space-9) 0;}
.pl-strip{padding:var(--space-5) 0;border-top:1px solid var(--c-border);border-bottom:1px solid var(--c-border);background:var(--c-bg);}
.pl-container{max-width:var(--max-w);margin:0 auto;padding:0 var(--space-4);}
.pl-container--narrow{max-width:var(--max-w-narrow);}
.pl-title{margin:0 0 var(--space-2);font-size:clamp(var(--fz-hero-min),4vw,var(--fz-hero-max));line-height:1.2;color:var(--c-text);}
.pl-h2{margin:0 0 var(--space-3);font-size:28px;line-height:1.3;color:var(--c-text);}
.pl-lead{margin:0 0 var(--space-4);font-size:18px;line-height:1.7;color:var(--c-text);}
.pl-meta{font-size:14px;color:var(--c-sub);}

/* 3) Grid System */
.pl-grid{display:grid;gap:var(--space-3);}
.pl-grid--2{grid-template-columns:repeat(2,1fr);}
.pl-grid--3{grid-template-columns:repeat(3,1fr);}
.pl-grid--4{grid-template-columns:repeat(4,1fr);}
.pl-grid--12-10{grid-template-columns:1.2fr 1fr;}

/* 4) Cards and Figures */
.pl-card{border:1px solid var(--c-border);border-radius:var(--radius);background:#fff;transition:transform var(--dur-2) var(--ease), box-shadow var(--dur-2) var(--ease);}
.pl-card__body{padding:var(--space-4);}
.pl-card h3{margin:0 0 var(--space-2);font-size:18px;color:var(--c-text);}
.pl-card p{margin:0;color:var(--c-sub);font-size:14px;}
.pl-card:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.06);}
.pl-figure{border-radius:var(--radius);overflow:hidden;border:1px solid var(--c-border);min-height:240px;background:#fff;}

/* 5) Buttons */
.pl-actions{display:flex;gap:var(--space-2);flex-wrap:wrap;}
.pl-btn{
  display:inline-block;
  padding:12px 20px;
  border-radius:8px;
  text-decoration:none;
  line-height:1;
  border:1px solid transparent;
  background:transparent;
  color:var(--c-text);
  transition:background-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease), transform var(--dur-1) var(--ease);
}
.pl-btn--primary{background:var(--c-primary);color:#fff;}
.pl-btn--primary:hover{transform:translateY(-1px);background:#3f4c37;}
.pl-btn--outline{border-color:var(--c-primary);color:var(--c-primary);}
.pl-btn--outline:hover{background:var(--c-primary);color:#fff;}

/* 6) Links and Posts */
.pl-link{font-size:14px;color:var(--c-primary);text-decoration:none;border-bottom:1px solid transparent;transition:border-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease);}
.pl-link:hover{color:#3f4c37;border-color:#3f4c37;}
.pl-post{display:block;text-decoration:none;color:var(--c-text);}
.pl-post__thumb{height:160px;background:linear-gradient(0deg, rgba(74,88,64,.12), rgba(74,88,64,.12)), #ddd;}
.pl-post__body{padding:14px;}
.pl-post__body h3{margin:0 0 6px;font-size:18px;color:var(--c-text);}
.pl-post__body p{margin:0;color:var(--c-sub);font-size:14px;}

/* 7) Lists */
.pl-list{margin:var(--space-2) 0 var(--space-4) var(--space-4);color:var(--c-sub);line-height:1.8;font-size:14px;}

/* 8) Brand Background Helpers */
.bg-soft{background:var(--c-bg-soft);}
.border-accent{border-color:var(--c-accent) !important;}
.text-accent{color:var(--c-accent);}

/* 9) Gentle Section Animations */
@keyframes pl-fade-up{
  from{opacity:0;transform:translateY(8px);}
  to{opacity:1;transform:translateY(0);}
}
.pl-section,.pl-strip{animation:pl-fade-up var(--dur-2) var(--ease) both;}
.pl-card,.pl-figure,.pl-post{animation:pl-fade-up var(--dur-2) var(--ease) both;}
/* stagger utility: add .stagger-1/2/3 on child elements if需要 */
.stagger-1>*{animation-delay:60ms;}
.stagger-2>*{animation-delay:120ms;}
.stagger-3>*{animation-delay:180ms;}

/* 10) Hero Accent Underline (optional for H1) */
.pl-title.pl-accent{
  position:relative;
  padding-bottom:10px;
}
.pl-title.pl-accent:after{
  content:"";
  position:absolute;left:0;bottom:0;
  width:96px;height:6px;border-radius:4px;
  background:linear-gradient(90deg,var(--c-accent), transparent);
}

/* 11) RWD */
@media (max-width:1024px){
  .pl-grid--4{grid-template-columns:repeat(2,1fr);}
  .pl-grid--12-10{grid-template-columns:1fr;}
}
@media (max-width:640px){
  .pl-grid--3{grid-template-columns:1fr;}
  .pl-grid--4{grid-template-columns:1fr;}
  .pl-lead{font-size:16px;}
  .pl-h2{font-size:24px;}
}

/* 12) Optional: subtle focus styles for accessibility */
.pl-btn:focus,.pl-link:focus{outline:2px solid var(--c-accent);outline-offset:2px;}/* End custom CSS */