/*
Theme Name: Elvarino Beauty
Author: PingVinni
Description: Custom WordPress theme for Elvarino Beauty Malaysia. Includes editable content, MY localization, privacy/cookie pages and consent management.
Version: 2.3.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 8.0
Text Domain: elvarino
*/

:root{
  --el-bg-deep:#0E1A11;
  --el-bg:#142619;
  --el-bg-mid:#1B3522;
  --el-bg-card:#203923;
  --el-cream:#F2EAD8;
  --el-text:#AEB9AA;
  --el-muted:#8FA88A;
  --el-coral:#E8603A;
  --el-coral-hover:#F06B44;
  --el-gold:#C9A050;
  --el-line:rgba(242,234,216,.19);
  --el-home-shell:1280px;
  --el-header-shell:1232px;
  --el-shadow:0 22px 55px rgba(0,0,0,.18);
  /* Readability floor: never below 14px. Desktop uses 16px for general copy. */
  --el-min-readable:16px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--el-bg-deep)}
body{margin:0;background:var(--el-bg);color:var(--el-cream);font-family:"Outfit",Arial,sans-serif;font-size:16px;line-height:1.62;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.menu-open,body.cookie-open{overflow:hidden}
body.admin-bar .site-nav{top:64px}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
::selection{background:var(--el-coral);color:#fff}
[hidden]{display:none!important}

.home-shell{width:min(var(--el-home-shell),calc(100% - 60px));margin-inline:auto}
.header-shell,.footer-shell{width:min(var(--el-header-shell),calc(100% - 109px));margin-inline:auto}
.el-eyebrow{display:flex;align-items:center;gap:12px;color:var(--el-gold);font-size:14px;line-height:1.2;font-weight:600;text-transform:uppercase;letter-spacing:.13em}
.el-eyebrow::before{content:"";width:24px;height:1px;background:currentColor;opacity:.84}
.el-title{margin:11px 0 0;font-family:"Playfair Display",Georgia,serif;font-size:48px;line-height:1.04;font-weight:700;letter-spacing:-.025em;color:var(--el-cream)}
.el-copy{color:var(--el-text);font-size:14px;line-height:1.72}
.el-button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 22px;border-radius:999px;border:1px solid transparent;font-size:14px;font-weight:600;transition:transform .22s ease,box-shadow .22s ease,background-color .22s ease,border-color .22s ease,color .22s ease}
.el-button:hover{transform:translateY(-2px)}
.el-button--primary{background:var(--el-coral);color:#fff;box-shadow:0 8px 20px rgba(232,96,58,.14)}
.el-button--primary:hover{background:var(--el-coral-hover);box-shadow:0 12px 28px rgba(232,96,58,.24)}
.el-button--outline{border-color:rgba(242,234,216,.48);color:var(--el-cream);background:transparent}
.el-button--outline:hover{border-color:var(--el-cream);background:rgba(255,255,255,.035)}
.el-anchor{scroll-margin-top:72px}

/* Header */
.site-header{height:64px;background:var(--el-bg-deep);border-bottom:1px solid rgba(242,234,216,.045);position:relative;z-index:80}
.site-header__inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:34px}
.site-brand{position:relative;z-index:92;display:inline-flex;align-items:center;gap:7px;min-width:max-content;color:var(--el-cream);font-size:14px;font-weight:600;letter-spacing:-.02em}
.site-brand__mark{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;color:var(--el-gold);font-size:14px;line-height:1}
.site-brand .custom-logo{max-height:28px;width:auto}
.site-nav{display:flex;align-items:center;gap:28px;color:#D2D7CD;font-size:14px;font-weight:400}
.site-nav a{position:relative;padding:9px 0;transition:color .2s ease}
.site-nav a:not(.site-nav__cta)::after{content:"";position:absolute;left:0;right:100%;bottom:4px;height:1px;background:var(--el-gold);transition:right .22s ease}
.site-nav a:hover{color:#fff}.site-nav a:hover::after{right:0}
.site-nav__cta{padding:9px 17px!important;border-radius:999px;background:var(--el-coral);color:#fff!important;font-weight:600;box-shadow:0 7px 16px rgba(232,96,58,.15)}
.site-nav__cta:hover{background:var(--el-coral-hover)}
.site-menu-toggle{display:none;width:42px;height:42px;padding:0;border:0;background:transparent;color:var(--el-cream);position:relative;z-index:92}
.site-menu-toggle span,.site-menu-toggle::before,.site-menu-toggle::after{content:"";position:absolute;left:9px;right:9px;height:1px;background:currentColor;transition:transform .2s ease,top .2s ease,opacity .2s ease}
.site-menu-toggle::before{top:13px}.site-menu-toggle span{top:20px}.site-menu-toggle::after{top:27px}
.site-menu-toggle.is-open::before{top:20px;transform:rotate(45deg)}.site-menu-toggle.is-open span{opacity:0}.site-menu-toggle.is-open::after{top:20px;transform:rotate(-45deg)}
.inner-nav{display:flex;align-items:center;gap:24px}
.inner-nav__label{color:var(--el-gold);font-size:14px;text-transform:uppercase;letter-spacing:.14em}
.inner-nav__home{display:inline-flex;align-items:center;gap:7px;color:#D2D7CD;font-size:14px;transition:color .2s ease,transform .2s ease}
.inner-nav__home:hover{color:#fff;transform:translateX(-2px)}

/* Home: hero */
.hero{background:var(--el-bg-deep);overflow:hidden}
.hero__grid{display:grid;grid-template-columns:50% 50%;height:775px}
.hero__left{display:flex;align-items:center}
.hero__content{width:100%;max-width:610px;margin-left:max(38px,calc((100vw - var(--el-header-shell))/2));padding:56px clamp(38px,4.6vw,68px) 55px 0}
.hero__title{margin:24px 0 25px;font-family:"Playfair Display",Georgia,serif;font-size:96px;font-weight:900;line-height:.86;letter-spacing:-.052em;color:var(--el-cream)}
.hero__title span{display:block}.hero__title .hero__accent{color:var(--el-coral);font-style:italic;font-weight:900}
.hero__text{max-width:410px;margin:0;color:#AAB8AA;font-size:14px;line-height:1.7}
.hero__actions{display:flex;align-items:center;gap:14px;margin-top:28px;flex-wrap:wrap}
.hero__visual{position:relative;height:775px;overflow:hidden}
.hero__visual img{width:100%;height:100%;object-fit:cover;object-position:center 48%;filter:saturate(1.035) contrast(1.02)}
.hero__visual::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,26,17,.20),transparent 24%);pointer-events:none}
.hero__scroll{position:absolute;left:-22px;bottom:20px;color:#728272;font-size:14px;letter-spacing:.18em;text-transform:uppercase;transform:rotate(-90deg);transform-origin:left bottom;z-index:2}

/* Services */
.services{background:var(--el-bg);padding:93px 0 106px}
.services__heading{display:grid;grid-template-columns:1.35fr .65fr;align-items:end;gap:80px;margin-bottom:47px}
.services__intro{max-width:320px;justify-self:end;margin:0;color:#AAB6A7;font-size:14px;line-height:1.62}
.services__list{border-bottom:1px solid var(--el-line)}
.service-row{display:grid;grid-template-columns:38px 1.04fr 2.05fr 88px;align-items:center;gap:22px;min-height:107px;padding:22px 0;border-top:1px solid var(--el-line);transition:background-color .2s ease,padding .2s ease}
.service-row:hover{background:rgba(255,255,255,.014);padding-left:8px;padding-right:8px}
.service-row__num{align-self:start;padding-top:5px;color:var(--el-gold);font-size:14px;font-weight:600;letter-spacing:.07em}
.service-row__title{margin:0;font-family:"Playfair Display",Georgia,serif;font-size:18px;line-height:1.15;font-weight:700;color:var(--el-cream)}
.service-row__desc{max-width:500px;color:#9FAE9E;font-size:14px;line-height:1.62}
.service-row__price{justify-self:end;padding:4px 9px;border-radius:999px;background:#4D2D20;color:#F07A55;font-size:14px;font-weight:600;white-space:nowrap}
.services__fineprint{margin:18px 0 0;color:#718071;font-size:14px}

/* Story */
.story{background:var(--el-bg-mid);padding:102px 0 96px}
.story__grid{display:grid;grid-template-columns:.87fr 1.13fr;align-items:center;gap:95px}
.story__media{position:relative;width:100%;max-width:445px;margin-left:68px}
.story__media img{width:100%;aspect-ratio:.79;object-fit:cover;filter:grayscale(1) contrast(1.05)}
.story__badge{position:absolute;right:-24px;bottom:-8px;width:88px;height:88px;border-radius:16px;background:var(--el-coral);display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;box-shadow:0 16px 30px rgba(0,0,0,.17)}
.story__badge strong{font-family:"Playfair Display",Georgia,serif;font-size:23px;font-weight:700;line-height:1}.story__badge span{margin-top:5px;font-size:14px}
.story__body{max-width:590px}.story__body .el-title{max-width:540px}.story__body .el-copy{margin-top:20px;max-width:575px}.story__body p{margin:0 0 15px}
.story__stats{display:flex;gap:10px;margin-top:28px;flex-wrap:wrap}
.story-stat{min-width:120px;padding:15px 15px 13px;background:#27442C;border-radius:2px}
.story-stat strong{display:block;font-family:"Playfair Display",Georgia,serif;font-size:22px;font-weight:700;line-height:1;color:var(--el-cream)}
.story-stat span{display:block;margin-top:6px;color:#A3B09F;font-size:14px}
.story__note{margin-top:8px;color:#798779;font-size:14px}

/* Process */
.process{background:#122318;padding:98px 0 95px}
.process__heading{text-align:center}.process__heading .el-eyebrow{justify-content:center}.process__heading .el-eyebrow::before{display:none}.process__heading .el-title{font-size:45px}
.process__steps{display:grid;grid-template-columns:repeat(3,1fr);gap:70px;margin-top:60px}
.process-step__icon{width:38px;height:38px;margin-bottom:19px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#304128;color:var(--el-gold);font-family:"Playfair Display",Georgia,serif;font-size:14px;font-weight:700}
.process-step h3{margin:0 0 9px;font-family:"Playfair Display",Georgia,serif;font-size:16px;font-weight:700}.process-step p{margin:0;max-width:330px;color:#9DAC9C;font-size:14px;line-height:1.65}
.gallery{display:grid;grid-template-columns:1fr 1.02fr 1fr;gap:16px;align-items:end;margin-top:67px}
.gallery__item{overflow:hidden;margin:0;border-radius:2px;background:#1D3422}.gallery__item:nth-child(1),.gallery__item:nth-child(3){height:540px}.gallery__item:nth-child(2){height:445px;margin-bottom:47px}
.gallery__item img{width:100%;height:100%;object-fit:cover;transition:transform .55s ease,filter .55s ease}.gallery__item:hover img{transform:scale(1.035);filter:saturate(1.06)}

/* Pasukan */
.team{background:var(--el-bg-mid);padding:101px 0 107px}
.team__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:88px;margin-top:58px}
.team-card__photo{width:102px;height:102px;margin-bottom:21px;border-radius:50%;overflow:hidden;border:1px solid rgba(242,234,216,.12)}
.team-card__photo img{width:100%;height:100%;object-fit:cover}.team-card h3{margin:0 0 4px;font-family:"Playfair Display",Georgia,serif;font-size:18px;font-weight:700}.team-card__role{color:var(--el-coral);font-size:14px;line-height:1.4;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.team-card p{margin:11px 0 0;max-width:320px;color:#9CAC9B;font-size:14px;line-height:1.62}

/* Reviews */
.reviews{background:#122318;padding:102px 0 107px}
.reviews__heading{text-align:center}.reviews__heading .el-eyebrow{justify-content:center}.reviews__heading .el-eyebrow::before{display:none}.reviews__heading .el-title{font-size:45px}.reviews__sub{margin-top:5px;color:#778676;font-size:14px}
.reviews__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:50px}
.review-card{min-height:205px;padding:29px 28px 26px;border-radius:7px;background:#1C3522;border:1px solid rgba(255,255,255,.025);transition:transform .25s ease,background-color .25s ease}.review-card:hover{transform:translateY(-3px);background:#203B26}
.review-card__mark{margin-bottom:11px;color:var(--el-gold);font-family:"Playfair Display",Georgia,serif;font-size:22px;line-height:1}.review-card blockquote{margin:0 0 15px;color:#E6DFCE;font-family:"Playfair Display",Georgia,serif;font-size:14px;font-style:italic;line-height:1.56}.review-card cite{display:flex;flex-direction:column;gap:2px;color:#93A08F;font-size:14px;font-style:normal}.review-card cite strong{color:#C9D0C4;font-weight:500}

/* Hubungi */
.contact{background:#1D3824;padding:96px 0 98px}
.contact__grid{display:grid;grid-template-columns:.94fr 1.06fr;gap:90px;align-items:start}
.contact__title{margin:13px 0 20px;font-family:"Playfair Display",Georgia,serif;font-size:48px;font-weight:700;line-height:.97;letter-spacing:-.025em}.contact__title span{display:block;color:var(--el-coral);font-style:italic}
.contact__copy{max-width:455px;margin:0;color:#9FAE9D;font-size:14px;line-height:1.7}
.contact__meta{display:grid;gap:11px;margin-top:27px;color:#BCC6B8;font-size:14px}.contact__meta div{display:flex;align-items:center;gap:10px}.contact__meta-icon{display:inline-flex;width:10px;color:var(--el-coral);font-size:14px;justify-content:center}
.contact-form{padding:19px 21px 21px;border-radius:8px;background:#112319;border:1px solid rgba(255,255,255,.06);box-shadow:var(--el-shadow)}
.contact-form__notice,.contact-form__success,.contact-form__error{margin-bottom:12px;padding:8px 11px;border-radius:5px;font-size:14px}.contact-form__notice{background:#2C3B1F;color:#D0B954}.contact-form__success{background:#24472E;color:#D0EBD3}.contact-form__error{background:#4A2A21;color:#FFD5C8}
.form-field{margin-bottom:10px}.form-field label{display:block;margin-bottom:4px;color:#94A390;font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.07em}.form-field input,.form-field textarea,.form-field select{width:100%;padding:10px 11px;border:1px solid rgba(255,255,255,.07);border-radius:5px;background:#1E3524;color:#ECE7D8;outline:none;font-size:14px;transition:border-color .2s ease,background-color .2s ease}.form-field input::placeholder,.form-field textarea::placeholder{color:#718070}.form-field input:focus,.form-field textarea:focus,.form-field select:focus{border-color:rgba(232,96,58,.62);background:#223D29}.form-field textarea{height:88px;resize:vertical}.contact-form .el-button{width:100%;min-height:40px;margin-top:4px;border:0;font-size:14px}

/* Footer */
.site-footer{background:#0B180F;padding:61px 0 27px;border-top:1px solid rgba(255,255,255,.035)}
.site-footer__grid{display:grid;grid-template-columns:1.7fr .75fr .9fr;gap:86px;align-items:start}.site-footer__about{max-width:285px}.site-brand--footer{font-size:14px}.site-footer__desc{margin:15px 0 0;color:#7F8E7F;font-size:14px;line-height:1.7}.site-footer h4{margin:0 0 12px;color:var(--el-gold);font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.14em}.site-footer ul{margin:0;padding:0;list-style:none}.site-footer li{margin:6px 0}.site-footer li a,.footer-link-button{padding:0;border:0;background:none;color:#96A295;font-size:14px;text-align:left;transition:color .2s ease,transform .2s ease}.site-footer li a:hover,.footer-link-button:hover{color:#fff;transform:translateX(2px)}
.site-footer__bottom{display:flex;justify-content:space-between;gap:24px;margin-top:55px;padding-top:19px;border-top:1px solid rgba(255,255,255,.045);color:#697669;font-size:14px}

/* Legal pages */
.legal-page{min-height:70vh;background:var(--el-bg);padding:64px 0 112px}
.legal-article{width:min(720px,calc(100% - 40px));margin-inline:auto}
.legal-kicker{color:var(--el-gold);font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.13em}
.legal-article>h1,.generic-page h1,.error-page h1{margin:12px 0 19px;font-family:"Playfair Display",Georgia,serif;font-size:48px;line-height:1.05;font-weight:700;letter-spacing:-.03em;color:var(--el-cream)}
.legal-updated{margin:0 0 55px;color:#9BAB99;font-size:14px}
.legal-content{color:#AAB7A7;font-size:14px;line-height:1.72}
.legal-section{margin:0 0 44px}.legal-section:last-child{margin-bottom:0}.legal-section h2{margin:0 0 14px;color:var(--el-cream);font-family:"Playfair Display",Georgia,serif;font-size:20px;line-height:1.2;font-weight:700}.legal-section h3{margin:0;font-family:"Playfair Display",Georgia,serif;font-size:15px;color:var(--el-cream)}
.legal-section p{margin:0 0 13px}.legal-section ul{margin:14px 0 15px;padding:0;list-style:none}.legal-section li{position:relative;padding-left:20px;margin:9px 0}.legal-section li::before{content:"";position:absolute;left:1px;top:.72em;width:5px;height:5px;border-radius:50%;background:var(--el-gold)}
.legal-section a,.legal-inline-button{color:var(--el-cream);text-decoration:underline;text-decoration-color:rgba(201,160,80,.55);text-underline-offset:3px}.legal-inline-button{display:inline;padding:0;border:0;background:none;font:inherit;cursor:pointer}
.legal-note{padding:14px 16px;border-left:2px solid var(--el-gold);background:rgba(201,160,80,.06);color:#94A591!important;font-size:14px}
.legal-table-wrap{overflow-x:auto;margin:18px 0 10px;border:1px solid var(--el-line)}
.legal-table{width:100%;border-collapse:collapse;min-width:580px}.legal-table th,.legal-table td{padding:13px 15px;text-align:left;vertical-align:top;border-bottom:1px solid var(--el-line)}.legal-table tr:last-child td{border-bottom:0}.legal-table th{background:rgba(255,255,255,.025);color:var(--el-gold);font-size:14px;text-transform:uppercase;letter-spacing:.08em;font-weight:600}.legal-table td{color:#A5B2A3;font-size:14px;line-height:1.55}.legal-table code{color:var(--el-cream);font-size:14px}
.cookie-category{margin:13px 0;border:1px solid var(--el-line);background:rgba(255,255,255,.012)}.cookie-category__head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 16px;border-bottom:1px solid var(--el-line)}.cookie-category__head span{color:var(--el-gold);font-size:14px;text-align:right}.cookie-category__grid{display:grid;grid-template-columns:1.5fr .8fr .65fr;gap:0}.cookie-category__grid>div{padding:14px 16px;border-right:1px solid var(--el-line)}.cookie-category__grid>div:last-child{border-right:0}.cookie-category small{display:block;margin-bottom:6px;color:#758575;font-size:14px;text-transform:uppercase;letter-spacing:.08em}.cookie-category p{margin:0;font-size:14px;line-height:1.55}

/* Generic / 404 */
.generic-page,.error-page{min-height:70vh;background:var(--el-bg);padding:90px 0 110px}.generic-page__inner,.error-page__inner{width:min(820px,calc(100% - 40px));margin-inline:auto}.generic-page__content,.error-page p{color:var(--el-text);font-size:14px}.error-page__inner{padding-top:40px}.error-page h1{font-size:54px;max-width:620px}.error-page .el-button{margin-top:18px}

/* Cookie consent */
.cookie-layer{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:20px;opacity:0;transition:opacity .22s ease}.cookie-layer.is-visible{opacity:1}.cookie-layer__backdrop{position:absolute;inset:0;background:rgba(3,8,5,.76);backdrop-filter:blur(2px)}
.cookie-modal{position:relative;z-index:1;width:min(462px,calc(100vw - 32px));max-height:calc(100vh - 34px);overflow:auto;padding:27px 28px 26px;border:1px solid rgba(242,234,216,.10);border-radius:7px;background:#142619;color:var(--el-cream);box-shadow:0 28px 80px rgba(0,0,0,.46)}
.cookie-modal__brand{display:flex;align-items:center;gap:5px;margin-bottom:14px;font-size:14px;font-weight:600}.cookie-modal__brand .site-brand__mark{width:16px;height:16px;font-size:14px}.cookie-modal__close{position:absolute;top:20px;right:21px;width:28px;height:28px;border:0;background:transparent;color:#C9D0C4;font-size:18px;line-height:1;transition:color .2s ease,transform .2s ease}.cookie-modal__close:hover{color:#fff;transform:rotate(6deg)}
.cookie-view h2{margin:0 0 15px;font-family:"Playfair Display",Georgia,serif;font-size:20px;font-weight:700}.cookie-view>p{margin:0;color:#A6B3A3;font-size:14px;line-height:1.65}.cookie-modal__actions{display:grid;gap:9px;margin-top:28px}.cookie-modal__split{display:grid;grid-template-columns:1fr 1fr;gap:9px}.cookie-action{min-height:43px;border-radius:999px;border:1px solid rgba(242,234,216,.22);font-size:14px;font-weight:600}.cookie-action--primary{border-color:var(--el-coral);background:var(--el-coral);color:#fff}.cookie-action--primary:hover{background:var(--el-coral-hover);border-color:var(--el-coral-hover)}.cookie-action--secondary{background:transparent;color:var(--el-cream)}.cookie-action--secondary:hover{border-color:rgba(242,234,216,.55);background:rgba(255,255,255,.025)}
.cookie-pref{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;padding:15px 0;border-top:1px solid var(--el-line)}.cookie-pref:first-of-type{margin-top:5px}.cookie-pref strong{font-family:"Playfair Display",Georgia,serif;font-size:14px}.cookie-pref p{margin:4px 0 0;max-width:320px;color:#849483;font-size:14px;line-height:1.5}.cookie-lock{color:var(--el-gold);font-size:14px;white-space:nowrap}.cookie-switch{position:relative;width:38px;height:21px;padding:0;border:1px solid rgba(242,234,216,.18);border-radius:999px;background:#243429}.cookie-switch span{position:absolute;top:3px;left:3px;width:13px;height:13px;border-radius:50%;background:#829181;transition:transform .2s ease,background .2s ease}.cookie-switch.is-on{background:rgba(232,96,58,.23);border-color:rgba(232,96,58,.55)}.cookie-switch.is-on span{transform:translateX(17px);background:var(--el-coral)}.cookie-modal__actions--settings{margin-top:18px}.cookie-back{justify-self:start;padding:5px 0;border:0;background:none;color:#96A496;font-size:14px}

@media (max-width:1200px){
  .home-shell{width:calc(100% - 64px)}.header-shell,.footer-shell{width:calc(100% - 64px)}
  .hero__content{max-width:none;margin-left:32px;padding-right:40px}.hero__title{font-size:82px}
  .hero__actions{gap:12px}.hero__actions .el-button{padding-inline:18px}
  .story__grid{gap:70px}.story__media{margin-left:26px}.contact__grid{gap:60px}
}

@media (max-width:1024px){
  .home-shell,.header-shell,.footer-shell{width:calc(100% - 48px)}
  .site-nav{gap:18px}
  .hero__grid,.hero__visual{height:680px}.hero__content{margin-left:24px;padding-right:28px}.hero__title{font-size:70px;letter-spacing:-.045em}.hero__actions{gap:10px}.hero__actions .el-button{padding-inline:16px}
  .service-row{grid-template-columns:34px 1fr 1.45fr 82px;gap:16px}
  .story__grid{grid-template-columns:.9fr 1.1fr;gap:52px}.story__media{margin-left:0}.story__body .el-title{font-size:42px}
  .gallery__item:nth-child(1),.gallery__item:nth-child(3){height:420px}.gallery__item:nth-child(2){height:350px}
  .team__grid{gap:50px}.contact__grid{gap:45px}.contact__title{font-size:44px}
}

@media (max-width:900px){
  .hero__grid{display:flex;flex-direction:column;height:auto}
  .hero__left{order:1;align-items:stretch}
  .hero__content{width:100%;max-width:760px;margin:0 auto;padding:56px 34px 46px}
  .hero__title{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:18px;row-gap:0;max-width:680px;font-size:clamp(54px,7vw,64px);line-height:.95;letter-spacing:-.045em}
  .hero__title span{display:inline-block}
  .hero__text{max-width:520px}
  .hero__visual{order:2;height:clamp(440px,66vw,600px);margin:0}
  .hero__visual img{object-position:center 42%}
  .hero__visual::after{background:linear-gradient(180deg,rgba(14,26,17,.08),transparent 20%)}
  .hero__scroll{display:none}
}

@media (max-width:782px){body.admin-bar .site-nav{top:64px}}

@media (max-width:767px){
  .home-shell,.header-shell,.footer-shell{width:calc(100% - 34px)}
  .site-header{height:64px}.site-menu-toggle{display:block}
  .site-nav{position:fixed;inset:0;z-index:90;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:0;padding:82px 24px 28px;background:#0E1A11;visibility:hidden;opacity:0;transform:translateY(-10px);pointer-events:none;transition:opacity .2s ease,transform .2s ease,visibility .2s ease}
  .site-nav.is-open{visibility:visible;opacity:1;transform:none;pointer-events:auto}.site-nav a{width:100%;padding:17px 0;border-bottom:1px solid rgba(242,234,216,.10);font-family:"Playfair Display",Georgia,serif;font-size:25px;font-weight:700}.site-nav a:not(.site-nav__cta)::after{display:none}.site-nav__cta{width:auto!important;margin-top:28px;padding:12px 22px!important;border:0!important;font-family:"Outfit",Arial,sans-serif!important;font-size:14px!important}
  .inner-nav__label{display:none}.inner-nav__home{font-size:14px}
  .hero__grid{display:flex;flex-direction:column;height:auto}.hero__left{order:1}.hero__content{width:100%;max-width:none;margin:0;padding:50px 22px 42px}.hero__title{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:12px;row-gap:0;max-width:none;font-size:clamp(45px,12vw,58px);line-height:.95;letter-spacing:-.04em;margin:21px 0 22px}.hero__title span{display:inline-block}.hero__text{font-size:14px}.hero__actions{margin-top:25px}.hero__visual{order:2;height:clamp(390px,108vw,520px);margin:0}.hero__visual img{object-position:center 42%}.hero__scroll{display:none}
  .services{padding:73px 0 78px}.services__heading{display:block;margin-bottom:34px}.services__intro{margin-top:18px;justify-self:auto}.service-row{grid-template-columns:28px 1fr auto;gap:10px;min-height:0;padding:18px 0}.service-row__desc{grid-column:2/4;padding-right:5px}.service-row__price{grid-column:3;grid-row:1}.service-row:hover{padding-left:0;padding-right:0}.service-row__title{font-size:17px}
  .story{padding:73px 0}.story__grid{grid-template-columns:1fr;gap:54px}.story__media{width:100%;max-width:500px;margin:0 auto}.story__media img{aspect-ratio:1/1.05;object-fit:cover;object-position:center 44%}.story__badge{right:12px;bottom:-16px}.story__body .el-title{font-size:40px}
  .process{padding:73px 0}.process__heading .el-title{font-size:39px}.process__steps{grid-template-columns:1fr;gap:34px;margin-top:43px}.gallery{grid-template-columns:1fr;gap:13px;margin-top:48px}.gallery__item:nth-child(1),.gallery__item:nth-child(2),.gallery__item:nth-child(3){height:390px;margin:0}
  .team{padding:73px 0}.team__grid{grid-template-columns:1fr;gap:42px;margin-top:43px}.team-card{display:grid;grid-template-columns:82px 1fr;column-gap:18px}.team-card__photo{width:82px;height:82px;margin:0;grid-row:1/5}.team-card h3{margin-top:2px}.team-card p{margin-top:8px}
  .reviews{padding:73px 0 77px}.reviews__heading .el-title{font-size:39px}.reviews__grid{grid-template-columns:1fr;margin-top:38px}.review-card{min-height:0}
  .contact{padding:73px 0}.contact__grid{grid-template-columns:1fr;gap:42px}.contact__title{font-size:43px}
  .site-footer{padding-top:48px}.site-footer__grid{grid-template-columns:1fr 1fr;gap:34px 25px}.site-footer__about{grid-column:1/-1}.site-footer__bottom{flex-direction:column;margin-top:38px;gap:8px}
  .el-title{font-size:40px}
  .legal-page{padding:52px 0 78px}.legal-article{width:calc(100% - 34px)}.legal-article>h1{font-size:42px}.legal-updated{margin-bottom:43px;font-size:14px}.legal-section{margin-bottom:38px}.cookie-category__head{align-items:flex-start;flex-direction:column;gap:5px}.cookie-category__head span{text-align:left}.cookie-category__grid{grid-template-columns:1fr}.cookie-category__grid>div{border-right:0;border-bottom:1px solid var(--el-line)}.cookie-category__grid>div:last-child{border-bottom:0}
  .cookie-modal{padding:24px 20px 22px}.cookie-modal__split{grid-template-columns:1fr}.cookie-pref{gap:12px}.cookie-pref p{max-width:230px}
}

@media (max-width:420px){
  .hero__content{padding:45px 18px 38px}.hero__visual{height:405px}.hero__title{font-size:clamp(43px,12vw,50px);column-gap:12px}.hero__actions{display:grid;grid-template-columns:1fr}.hero__actions .el-button{width:100%;padding-inline:18px}
  .story__media{max-width:100%}.story__badge{right:10px;bottom:-14px}.story__stats{display:grid;grid-template-columns:1fr 1fr}.story-stat{min-width:0}.gallery__item:nth-child(1),.gallery__item:nth-child(2),.gallery__item:nth-child(3){height:320px}.contact__title{font-size:40px}.site-footer__grid{grid-template-columns:1fr}.site-footer__about{grid-column:auto}.cookie-modal{width:calc(100vw - 24px)}
}


/* Responsive readable typography
   Desktop: general microcopy 16px where appropriate.
   Tablet/mobile: nothing drops below 14px.
   Display headings intentionally keep their larger design sizes. */
body,
.el-eyebrow,
.el-copy,
.el-button,
.site-brand,
.site-nav,
.inner-nav__label,
.inner-nav__home,
.hero__text,
.hero__scroll,
.services__intro,
.service-row__num,
.service-row__desc,
.service-row__price,
.services__fineprint,
.story__badge span,
.story-stat span,
.story__note,
.process-step__icon,
.process-step p,
.team-card__role,
.team-card p,
.reviews__sub,
.review-card blockquote,
.review-card cite,
.contact__copy,
.contact__meta,
.contact-form__notice,
.contact-form__success,
.contact-form__error,
.form-field label,
.form-field input,
.form-field textarea,
.form-field select,
.contact-form .el-button,
.site-brand--footer,
.site-footer__desc,
.site-footer h4,
.site-footer li a,
.footer-link-button,
.site-footer__bottom,
.legal-kicker,
.legal-updated,
.legal-content,
.legal-section h3,
.legal-note,
.legal-table th,
.legal-table td,
.legal-table code,
.cookie-category__head span,
.cookie-category small,
.cookie-category p,
.generic-page__content,
.error-page p,
.cookie-modal__brand,
.cookie-view>p,
.cookie-action,
.cookie-pref strong,
.cookie-pref p,
.cookie-lock,
.cookie-back{
  font-size:var(--el-min-readable);
}

@media (max-width:1199px){
  :root{--el-min-readable:14px}
}

@media (max-width:767px){
  :root{--el-min-readable:14px}
  /* Menu item labels are intentionally larger than the minimum. */
  .site-nav a{font-size:25px}
  .site-nav__cta{font-size:14px!important}
}



/* v2.2.4 — readability refinement */
.hero__text,
.el-copy,
.services__intro,
.service-row__desc,
.team-card p,
.contact__copy,
.generic-page__content,
.error-page p{
  font-size:16px;
}

.process-step h3{font-size:20px;line-height:1.25}
.process-step p{font-size:15px;line-height:1.72;max-width:360px}
.review-card blockquote{font-size:16px;line-height:1.65}
.form-field input,.form-field textarea,.form-field select{font-size:15px}
.legal-content,.legal-table td,.cookie-category p,.cookie-view>p,.cookie-pref p{font-size:15px}
.site-footer__desc,.site-footer li a,.footer-link-button{font-size:14px}

@media (max-width:1199px){
  body{font-size:15px}
  .hero__text,.el-copy,.services__intro,.service-row__desc,.team-card p,.contact__copy{font-size:15px}
  .process-step p{font-size:15px}
}

@media (max-width:767px){
  body{font-size:14px}
  .site-nav__cta{font-size:14px!important}
  .hero__text,.el-copy,.services__intro,.service-row__desc,.team-card p,.contact__copy{font-size:14px}
  .process{padding:68px 0 72px}
  .process__heading{max-width:360px;margin-inline:auto}
  .process__heading .el-eyebrow{font-size:14px}
  .process__heading .el-title{font-size:clamp(34px,9.5vw,40px);line-height:1.08}
  .process__steps{display:grid;grid-template-columns:1fr;gap:0;margin-top:38px}
  .process-step{
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    column-gap:16px;
    row-gap:4px;
    align-items:start;
    padding:22px 0;
    border-top:1px solid rgba(242,234,216,.11);
  }
  .process-step:last-child{border-bottom:1px solid rgba(242,234,216,.11)}
  .process-step__icon{
    grid-column:1;
    grid-row:1 / span 2;
    width:36px;
    height:36px;
    margin:0;
    font-size:14px;
  }
  .process-step h3{
    grid-column:2;
    margin:0 0 4px;
    font-size:19px;
    line-height:1.28;
  }
  .process-step p{
    grid-column:2;
    margin:0;
    max-width:none;
    font-size:14px;
    line-height:1.7;
  }
  .gallery{margin-top:42px}
  .review-card blockquote{font-size:15px}
  .form-field input,.form-field textarea,.form-field select{font-size:14px}
  .legal-content,.legal-table td,.cookie-category p,.cookie-view>p,.cookie-pref p{font-size:14px}
}

@media (max-width:420px){
  .process-step{grid-template-columns:38px minmax(0,1fr);column-gap:13px;padding:20px 0}
  .process-step__icon{width:34px;height:34px}
  .process-step h3{font-size:18px}
}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}


/* v2.2.5 — mobile copy uses available width instead of artificial text columns */
@media (max-width:767px){
  /* General content paragraphs: let the viewport/container, not a desktop max-width, control wrapping. */
  .hero__text,
  .services__intro,
  .service-row__desc,
  .story__body .el-title,
  .story__body .el-copy,
  .story__body .el-copy p,
  .team-card p,
  .contact__copy,
  .site-footer__about,
  .site-footer__desc,
  .review-card blockquote{
    width:100%;
    max-width:none;
  }

  /* Services: keep number/title/price compact on the first line, let description breathe below. */
  .service-row__desc{
    grid-column:1 / -1;
    padding-right:0;
    margin-top:4px;
  }

  /* Process: number + title form the compact heading row; paragraph gets the full card width beneath it. */
  .process-step{
    grid-template-columns:42px minmax(0,1fr);
  }
  .process-step__icon{
    grid-row:1;
  }
  .process-step h3{
    align-self:center;
  }
  .process-step p{
    grid-column:1 / -1;
    grid-row:2;
    width:100%;
    max-width:none;
    margin-top:7px;
  }

  /* Pasukan: portrait + identity stay together, biography becomes a comfortable full-width paragraph. */
  .team-card{
    grid-template-columns:82px minmax(0,1fr);
    row-gap:0;
  }
  .team-card__photo{
    grid-row:1 / span 2;
  }
  .team-card h3,
  .team-card__role{
    grid-column:2;
  }
  .team-card p{
    grid-column:1 / -1;
    margin-top:15px;
  }

  /* Hubungi intro no longer inherits the desktop 455px reading column. */
  .contact__copy{
    max-width:none;
  }

  /* Footer about text can use the full mobile column as well. */
  .site-footer__about{
    max-width:none;
  }
}

@media (max-width:420px){
  .process-step{grid-template-columns:38px minmax(0,1fr)}
  .team-card{grid-template-columns:76px minmax(0,1fr);column-gap:16px}
  .team-card__photo{width:76px;height:76px}
}


/* Centralised company contact block */
.site-footer__contact{display:grid;gap:.3rem;margin-top:1rem;font-size:.92rem;line-height:1.45;color:var(--el-muted)}
.site-footer__contact strong{color:var(--el-cream);font-weight:600}
.site-footer__contact a{color:inherit;text-decoration:none}
.site-footer__contact a:hover,.site-footer__contact a:focus{color:var(--el-cream);text-decoration:underline;text-underline-offset:3px}

/* v2.2.8 footer cleanup */
.site-footer__bottom{justify-content:flex-start}
